/* ============================================================
   Colour My Run — theme.css
   Ported from approved prototype. Brand: colour arrives
   deliberately on a light/neutral base.
   ============================================================ */

:root{
  --cmr-magenta:#D81E7E; --cmr-magenta-deep:#A0165B; --cmr-magenta-deepest:#7C1250;
  --cmr-pink:#F24E9C; --cmr-gold:#F4B63E; --cmr-lime:#93C93F;
  --cmr-teal:#12A3A8; --cmr-cyan:#35C4D0; --cmr-ink:#1A1620; --cmr-base:#FBFAF6;
  --cmr-grad:linear-gradient(105deg,#2BC2D4,#F4B63E 34%,#F24E9C 67%,#D81E7E);
  --cmr-grad-hover:linear-gradient(105deg,#1E97A0,#E0A52E 34%,#D81E7E 70%,#A0165B);
}

*{box-sizing:border-box;margin:0;padding:0}
[hidden]{display:none !important} /* ensure hidden attr wins over inline display */
html{scroll-behavior:smooth}
body{font-family:'Hanken Grotesk',system-ui,sans-serif;color:#1A1620;background:#FBFAF6;-webkit-font-smoothing:antialiased;line-height:1.55;overflow-x:hidden}
img{max-width:100%}
a{color:#D81E7E;text-decoration:none}
a:hover{color:#A0165B}
h1,h2,h3,h4{font-family:'Bricolage Grotesque',system-ui,sans-serif;line-height:1.02;letter-spacing:-0.02em;font-weight:800}
button{font-family:inherit;cursor:pointer;border:none;background:none}
input,textarea,select{font-family:inherit;font-size:16px}
::selection{background:#F4B63E;color:#1A1620}
input:focus,textarea:focus,select:focus{outline:2px solid #12A3A8;outline-offset:1px}

/* ---------- keyframes ---------- */
@keyframes cmr-burst{0%{transform:scale(0);opacity:0}12%{opacity:1}100%{transform:scale(2.6);opacity:0}}
@keyframes cmr-rise{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
@keyframes cmr-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-16px)}}

/* ---------- reveal overlay ---------- */
.cmr-reveal{position:fixed;inset:0;z-index:400;background:#FBFAF6;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;transition:opacity 1s ease 2.6s,visibility 1s ease 2.6s;overflow:hidden}
.cmr-reveal.go{opacity:0;visibility:hidden;pointer-events:none}
.cmr-reveal .blob{position:absolute;border-radius:50%;transform:scale(0);filter:blur(2px);will-change:transform,opacity}
.cmr-reveal.go .blob{animation:cmr-burst 1.25s cubic-bezier(.16,.8,.3,1) forwards}
.cmr-reveal .cmr-color{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .6s ease .2s}
.cmr-reveal.go .cmr-color{opacity:1}
.cmr-reveal .cmr-muted{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(1) brightness(1.8) contrast(.82);opacity:.5;transition:opacity .55s ease}
.cmr-reveal.go .cmr-muted{opacity:0}
.cmr-reveal.go .cmr-introtxt{color:#fff !important;text-shadow:0 2px 18px rgba(0,0,0,.4)}
.cmr-reveal .cmr-logo-dark{transition:opacity .55s ease}
.cmr-reveal.go .cmr-logo-dark{opacity:0}
.cmr-reveal .cmr-logo-light{opacity:0;transition:opacity .6s ease .2s}
.cmr-reveal.go .cmr-logo-light{opacity:1}
.cmr-reveal .cmr-btn-dark{background:#1A1620;color:#fff;font-weight:700;font-size:18px;padding:17px 40px;border-radius:100px;display:inline-flex;align-items:center;gap:12px;transition:transform .2s ease}
.cmr-reveal .cmr-btn-dark:hover{transform:scale(1.04)}

/* stage desaturated until revealed */
.cmr-stage{filter:saturate(.12) contrast(.97) brightness(1.02);transition:filter 1.1s ease .2s}
.cmr-stage.lit{filter:none}
/* when reveal is disabled (no overlay) the stage must be fully lit */
.cmr-stage.no-reveal{filter:none}

/* ---------- header ---------- */
.cmr-header{background:transparent;border-bottom:1px solid transparent;transition:background .3s ease,border-color .3s ease;position:fixed;top:0;left:0;right:0;z-index:120}
.cmr-header.scrolled{background:linear-gradient(90deg,rgba(16,12,20,.92),rgba(124,18,80,.8) 55%,rgba(16,12,20,.92));backdrop-filter:blur(12px);border-bottom:1px solid rgba(255,255,255,.12)}
.cmr-navlink{padding:9px 13px;border-radius:8px;font-weight:600;font-size:15px;color:#fff;transition:color .2s ease}
.cmr-navlink:hover{color:#F4B63E}
.cmr-mobilelink{text-align:left;padding:12px 8px;font-weight:600;font-size:17px;border-bottom:1px solid rgba(255,255,255,.14);color:#F24E9C;transition:color .2s ease;display:block;width:100%}
.cmr-mobilelink:hover{color:#F4B63E}

/* WP-menu (wp_nav_menu) rendering — desktop */
.cmr-menu{list-style:none;margin:0;padding:0;display:flex;align-items:center;gap:4px}
.cmr-menu li{list-style:none}
.cmr-desknav .cmr-menu a{display:inline-block;padding:9px 13px;border-radius:8px;font-weight:600;font-size:15px;color:#fff;transition:color .2s ease}
.cmr-desknav .cmr-menu a:hover,.cmr-desknav .cmr-menu .current-menu-item>a{color:#F4B63E}
/* WP-menu — mobile stacked */
.cmr-menu-mobile{flex-direction:column;align-items:stretch;gap:0;width:100%}
.cmr-menu-mobile a{display:block;width:100%;text-align:left;padding:12px 8px;font-weight:600;font-size:17px;border-bottom:1px solid rgba(255,255,255,.14);color:#F24E9C;transition:color .2s ease}
.cmr-menu-mobile a:hover,.cmr-menu-mobile .current-menu-item>a{color:#F4B63E}

/* ---------- buttons ---------- */
.cmr-btn-grad{background:var(--cmr-grad);color:#fff;font-weight:700;border-radius:100px;transition:background .2s ease,transform .2s ease;display:inline-flex;align-items:center;justify-content:center;gap:8px}
.cmr-btn-grad:hover{background:var(--cmr-grad-hover);color:#fff}
.cmr-cta-scale{transition:transform .2s ease}
.cmr-cta-scale:hover{transform:scale(1.04)}

/* ---------- cards ---------- */
.cmr-rise{animation:cmr-rise .7s cubic-bezier(.2,.7,.3,1) both}
.cmr-card{transition:transform .25s ease,box-shadow .25s ease}
.cmr-card:hover{transform:translateY(-6px);box-shadow:0 18px 40px rgba(26,22,32,.09)}

/* ---------- pricing grid ---------- */
.cmr-price-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:34px}
@media(max-width:860px){.cmr-price-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.cmr-price-grid{grid-template-columns:1fr}}
a.cmr-phase-pill{display:inline-block;transition:transform .2s ease}
a.cmr-phase-pill:hover{transform:scale(1.05)}
a.cmr-price-card{transition:transform .25s ease,box-shadow .25s ease}
a.cmr-price-card:hover{transform:translateY(-6px);box-shadow:0 18px 40px rgba(0,0,0,.35)}

/* ---------- forms ---------- */
.cmr-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}

/* ---------- responsive ---------- */
@media(max-width:860px){
  .cmr-desknav{display:none !important}
  .cmr-burger{display:flex !important}
  .cmr-split{grid-template-columns:1fr !important}
  .cmr-gallery{grid-template-columns:repeat(2,1fr) !important;grid-auto-rows:150px !important}
  .cmr-corp-form{grid-template-columns:1fr !important}
  .cmr-corp-form .span2{grid-column:auto !important}
}