/* MNK v145 — the three principles assemble from the original monogram.
   This is intentionally scoped to the About route and doesn't alter shared motion. */
.mnk144-values{position:relative;box-sizing:border-box;height:370svh;min-height:2100px;background:#102B3B!important;color:#f4f7f8!important;isolation:isolate;overflow:clip}
.mnk144-values *{box-sizing:border-box}
.mnk144-values .mnk144-stage{position:sticky;top:0;width:100%;height:100svh;min-height:540px;overflow:hidden;display:block;background:#102B3B;color:#f4f7f8}
.mnk144-stage::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 42% 43% at 50% 52%,rgba(117,159,177,.11),transparent 74%);z-index:0}
.mnk144-head{position:absolute;z-index:4;top:clamp(84px,14vh,146px);left:clamp(26px,6.7vw,122px);right:clamp(26px,6.7vw,122px);display:flex;align-items:baseline;justify-content:space-between;gap:2rem}
.mnk144-head h2{color:#f4f7f8!important;font-family:inherit!important;font-size:clamp(30px,3.25vw,50px)!important;line-height:1.06!important;font-weight:500!important;letter-spacing:-.055em!important;margin:0!important}
.mnk144-head p{color:#9eb5c2!important;font-size:clamp(13px,1vw,16px)!important;line-height:1.45;letter-spacing:-.005em;margin:0!important}
.mnk144-symbol{position:absolute;z-index:2;width:clamp(340px,37.5vw,550px);max-width:78%;aspect-ratio:1168/894;left:50%;top:50%;transform:translate(-50%,-50%);pointer-events:none;will-change:transform}
.mnk144-symbol img{position:absolute;display:block;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none;user-select:none;-webkit-user-drag:none;transform-origin:50% 50%;backface-visibility:hidden}
.mnk144-symbol .mnk144-arc{z-index:3;will-change:transform;transform-origin:50% 50%}
.mnk144-symbol .mnk144-monogram{z-index:2;will-change:clip-path,opacity,transform,filter;transform-origin:50% 50%}
.mnk144-node{position:absolute;z-index:3;max-width:clamp(210px,19.5vw,305px);color:#f4f7f8;text-align:left;transform-origin:50% 50%;will-change:transform,opacity,filter;backface-visibility:hidden}
.mnk144-node--quality{left:7%;top:36%}
.mnk144-node--transparency{left:76.8%;top:41%}
.mnk144-node--determination{left:13%;top:72%}
.mnk144-node-num{display:block;margin-bottom:12px;font-size:11px;font-weight:650;letter-spacing:.14em;color:#8eaebc}
.mnk144-node h3{margin:0 0 12px!important;font-weight:500!important;font-size:clamp(29px,3vw,49px)!important;letter-spacing:-.062em!important;line-height:1.05!important;color:#f4f7f8!important}
.mnk144-node p{font-size:clamp(13px,1.08vw,16px)!important;line-height:1.55!important;max-width:260px;margin:0!important;color:#adbfca!important;letter-spacing:-.005em}
.mnk144-progress{position:absolute;z-index:5;right:clamp(26px,6vw,112px);bottom:clamp(24px,5vh,55px);display:flex;align-items:center;gap:12px;color:#91afbe;font-size:10px;letter-spacing:.10em;text-transform:uppercase;white-space:nowrap;pointer-events:none}
.mnk144-progress-track{height:47px;width:1px;background:rgba(214,231,240,.22);position:relative;display:block}
.mnk144-progress-fill{position:absolute;left:0;top:0;width:1px;height:100%;background:#e4edf3;transform-origin:top center;transform:scaleY(0);display:block}
.mnk144-motion .mnk144-node{opacity:0}
.mnk144-motion .mnk144-monogram{opacity:0;clip-path:inset(0 50% 0 50%);filter:blur(12px);transform:scale(.70)}
.mnk144-motion .mnk144-arc{opacity:0}
.mnk144-motion .mnk144-node{filter:blur(10px)}
@media (max-width:1100px) and (min-width:701px){
 .mnk144-symbol{width:clamp(300px,39vw,445px)}
 .mnk144-node--quality{left:4.5%;top:34%}
 .mnk144-node--transparency{left:72.5%;top:43%}
 .mnk144-node--determination{left:6.5%;top:74%}
 .mnk144-node h3{font-size:clamp(27px,3.3vw,37px)!important}
 .mnk144-node p{max-width:188px;font-size:13px!important}
}
@media (max-width:700px){
 .mnk144-values{height:365svh;min-height:1950px}
 .mnk144-values .mnk144-stage{min-height:540px}
 .mnk144-head{top:clamp(85px,12svh,116px);left:7%;right:7%;display:block}
 .mnk144-head h2{font-size:clamp(32px,8.3vw,44px)!important;max-width:340px}
 .mnk144-head p{margin-top:8px!important;font-size:13px!important}
 .mnk144-symbol{top:36%;width:min(73vw,340px);max-width:none}
 .mnk144-node{left:7%!important;right:7%!important;top:auto;max-width:none;width:86%;display:grid;grid-template-columns:minmax(130px, .93fr) minmax(0,1fr);align-items:center;column-gap:14px}
 .mnk144-node--quality{top:59%}
 .mnk144-node--transparency{top:72%}
 .mnk144-node--determination{top:85%}
 .mnk144-node-num{grid-column:1;align-self:end;margin:0 0 4px;font-size:9px}
 .mnk144-node h3{grid-column:1;align-self:start;font-size:clamp(25px,6vw,33px)!important;line-height:1.1!important;margin:0!important}
 .mnk144-node p{grid-column:2;grid-row:1/3;max-width:180px;font-size:clamp(11px,2.85vw,13px)!important;line-height:1.35!important}
 .mnk144-progress{right:7%;bottom:11px;gap:9px;font-size:9px}
 .mnk144-progress-track{height:20px}
}
@media (max-width:370px){.mnk144-node{column-gap:8px}.mnk144-node h3{font-size:21px!important}.mnk144-node p{font-size:11px!important}.mnk144-node--quality{top:60%}.mnk144-node--transparency{top:73%}.mnk144-node--determination{top:86%}}
@media (prefers-reduced-motion:reduce){
 .mnk144-values{height:auto;min-height:0;overflow:visible}
 .mnk144-values .mnk144-stage{height:auto;min-height:0;position:relative;padding:150px 7% 70px;overflow:visible}
 .mnk144-head{position:relative;inset:auto;display:block;margin:0 0 28px}
 .mnk144-symbol{position:relative;inset:auto;left:auto;top:auto;width:min(62vw,400px);margin:0 auto 15px;transform:none!important}
 .mnk144-symbol img{opacity:1!important;clip-path:none!important;transform:none!important}
 .mnk144-nodes{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
 .mnk144-node{position:relative;inset:auto!important;left:auto!important;right:auto!important;top:auto!important;width:auto;max-width:none;display:block;transform:none!important;opacity:1!important}
 .mnk144-progress{display:none}
}
@media (prefers-reduced-motion:reduce) and (max-width:700px){.mnk144-values .mnk144-stage{padding-top:125px}.mnk144-nodes{grid-template-columns:1fr;gap:28px}.mnk144-node h3{font-size:32px!important}.mnk144-node p{max-width:none}}

/* v145: larger orbit perimeter and smaller central mark, without redrawing the brand. */
.mnk144-symbol::before{content:"";position:absolute;pointer-events:none;z-index:0;
 width:102%;aspect-ratio:1;top:50%;left:50%;
 background:radial-gradient(circle,rgba(222,238,248,.14) 0%,rgba(156,190,207,.07) 32%,transparent 69%);
 opacity:var(--mnk145-bloom,0);transform:translate(-50%,-50%) scale(1.02);
 filter:blur(9px);}
.mnk144-symbol .mnk144-monogram{transform:scale(.79);}
.mnk144-symbol .mnk144-arc--upper{transform:scale(1.55)}
.mnk144-symbol .mnk144-arc--lower{transform:scale(1.59)}
/* The value copy remains accessible and in the HTML at every timeline state. */
@media (prefers-reduced-motion:reduce){
 .mnk144-symbol::before{opacity:.32;filter:none}
 .mnk144-symbol .mnk144-monogram{transform:scale(.79)!important;filter:none!important;clip-path:none!important;opacity:1!important}
 .mnk144-symbol .mnk144-arc--upper{transform:scale(1.55)!important;filter:none!important;opacity:1!important}
 .mnk144-symbol .mnk144-arc--lower{transform:scale(1.59)!important;filter:none!important;opacity:1!important}
 .mnk144-node{filter:none!important}
}

/* v145 mobile art direction: preserve breathing room above the orbit and below it. */
@media (max-width:700px){
 .mnk144-symbol{top:43%;width:min(66vw,31svh,300px)}
 .mnk144-node--quality{top:63%}
 .mnk144-node--transparency{top:75%}
 .mnk144-node--determination{top:87%}
}
@media (max-width:370px){
 .mnk144-node--quality{top:63%}
 .mnk144-node--transparency{top:75%}
 .mnk144-node--determination{top:87%}
}
@media (max-width:700px) and (max-height:640px){
 .mnk144-head{top:50px}
 .mnk144-head h2{font-size:30px!important}
 .mnk144-progress{display:none}
}
@media (prefers-reduced-motion:reduce) and (max-width:700px){
 /* Static layout must not inherit the sticky mobile orbit's top offset. */
 .mnk144-values .mnk144-stage{overflow:clip}
 .mnk144-symbol{top:auto;width:min(58vw,260px);margin:0 auto 22px}
}


/* v146 - optical depth & quiet reflections, only for the About values moment. */
.mnk144-values .mnk144-stage{isolation:isolate}
.mnk146-optical-field{position:absolute;z-index:1;left:50%;top:50%;width:min(61vw,830px);aspect-ratio:1;pointer-events:none;opacity:var(--mnk146-field-opacity,0);transform:translate(-50%,-50%) rotate(var(--mnk146-field-angle,0deg)) scale(var(--mnk146-field-scale,1));background:radial-gradient(ellipse 43% 36% at 40% 45%,rgba(103,162,189,.28),transparent 100%),radial-gradient(ellipse 33% 28% at 65% 61%,rgba(192,214,228,.10),transparent 100%);filter:blur(36px);will-change:transform,opacity}
.mnk144-symbol .mnk146-arc-echo{z-index:1!important;mix-blend-mode:screen;opacity:0;filter:blur(9px) saturate(.8);will-change:transform,opacity}
.mnk144-symbol .mnk144-arc{z-index:4!important}
.mnk144-symbol .mnk144-monogram{z-index:3!important}
.mnk146-letter-sheen{position:absolute;z-index:5;inset:0;pointer-events:none;transform-origin:50% 50%;transform:scale(.79);-webkit-mask-image:url('/assets/mnk144/monogram.webp');mask-image:url('/assets/mnk144/monogram.webp');-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;background:linear-gradient(108deg,transparent 35%,rgba(255,255,255,.01) 42%,rgba(255,255,255,.52) 49%,rgba(255,255,255,.08) 55%,transparent 63%);background-size:240% 100%;background-position:var(--mnk146-sheen-position,0%) 50%;opacity:var(--mnk146-sheen-opacity,0);will-change:background-position,opacity}
.mnk144-node{isolation:isolate}
.mnk144-node:before{content:"";position:absolute;z-index:-1;inset:-24px -28px;pointer-events:none;background:radial-gradient(ellipse at 38% 50%,rgba(161,206,224,.24) 0%,rgba(145,187,205,.08) 32%,transparent 74%);filter:blur(14px);opacity:var(--mnk146-value-pulse,0);transform:scale(1.04);}
.mnk144-node h3{text-shadow:0 0 24px rgba(235,247,254,var(--mnk146-text-glow,0));transition:none!important}
/* All new effects are decorative; no interaction or scrolling overlay. */
@media(max-width:700px){
 .mnk146-optical-field{top:43%;width:92vw;filter:blur(26px)}
 .mnk144-node:before{inset:-10px -14px;filter:blur(8px)}
}
@media(prefers-reduced-motion:reduce){
 .mnk146-optical-field{opacity:.28!important;transform:translate(-50%,-50%) scale(1)!important;filter:blur(25px)}
 .mnk144-symbol .mnk146-arc-echo{display:none!important}
 .mnk146-letter-sheen{display:none!important}
 .mnk144-node:before{opacity:0!important}
 .mnk144-node h3{text-shadow:none!important}
}


/* v148 - independently living orbits; scroll only releases each principle. */
.mnk144-values{height:450svh;min-height:2740px}
.mnk144-values .mnk144-stage{overflow:hidden}
.mnk144-symbol{width:clamp(290px,31vw,460px);top:51%}
.mnk144-node{
  left:50%!important;right:auto!important;top:51%!important;
  display:block!important;max-width:255px!important;width:240px!important;
  padding:0!important;border:0!important;border-radius:0!important;
  background:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
  box-shadow:none!important;text-align:left!important;
  pointer-events:none!important;isolation:initial;
}
.mnk144-node:after,.mnk144-node:before{content:none!important;display:none!important}
.mnk144-node h3{font-size:clamp(26px,2.65vw,43px)!important;line-height:1.04!important;margin:0 0 10px!important}
.mnk144-node p{font-size:clamp(12px,1vw,15px)!important;line-height:1.5!important;max-width:235px}
.mnk144-node-num{margin:0 0 9px}
.mnk146-optical-field{top:51%}
.mnk144-symbol .mnk144-monogram{transform:scale(.75)}
.mnk146-letter-sheen{transform:scale(.75)}
@media (max-width:1200px) and (min-width:701px){
 .mnk144-values{height:430svh;min-height:2460px}
 .mnk144-symbol{width:clamp(265px,32vw,390px)}
 .mnk144-node{width:200px!important;max-width:200px!important}
 .mnk144-node h3{font-size:clamp(24px,2.7vw,34px)!important}
 .mnk144-node p{font-size:12px!important}
}
@media (max-width:700px){
 .mnk144-values{height:420svh;min-height:2300px}
 .mnk144-head{top:clamp(88px,12svh,118px)}
 .mnk144-head h2{font-size:clamp(28px,7.8vw,39px)!important}
 .mnk144-head p{font-size:12px!important}
 .mnk144-symbol{top:45%;width:min(34vw,138px);max-width:none}
 .mnk146-optical-field{top:45%;width:min(90vw,390px)}
 .mnk144-node{top:45%!important;left:50%!important;right:auto!important;width:clamp(98px,30vw,128px)!important;max-width:128px!important}
 .mnk144-node-num{font-size:8px;margin-bottom:3px}
 .mnk144-node h3{font-size:clamp(14px,3.7vw,18px)!important;letter-spacing:-.055em!important;line-height:1.08!important;margin:0 0 4px!important}
 .mnk144-node p{font-size:clamp(9px,2.25vw,10px)!important;line-height:1.23!important;max-width:none}
}
@media (max-width:370px){
 .mnk144-values{height:420svh;min-height:2200px}
 .mnk144-symbol{width:31vw}
 .mnk144-node{width:102px!important;max-width:102px!important}
 .mnk144-node h3{font-size:14px!important}
 .mnk144-node p{font-size:9px!important}
}
/* Reduced-motion makes the values a readable static list, not a hidden orbit. */
@media (prefers-reduced-motion:reduce){
 .mnk144-values{height:auto!important;min-height:0!important}
 .mnk144-symbol{top:auto!important;width:min(58vw,370px)!important}
 .mnk144-node{position:relative!important;left:auto!important;right:auto!important;top:auto!important;max-width:none!important;width:auto!important;transform:none!important;opacity:1!important;filter:none!important;padding:0!important}
 .mnk144-node h3{font-size:clamp(25px,3vw,35px)!important}
 .mnk144-node p{font-size:14px!important}
 .mnk144-nodes{position:relative!important;display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
}
@media (prefers-reduced-motion:reduce) and (max-width:700px){
 .mnk144-nodes{grid-template-columns:1fr}
 .mnk144-node h3{font-size:28px!important}
 .mnk144-symbol{width:min(55vw,240px)!important}
}

/* Clearance refinement: the revolving curves sit between the monogram and the value orbit. */
@media (min-width:701px){.mnk144-symbol{width:clamp(280px,29vw,420px)}}
.mnk144-symbol .mnk144-monogram{transform:scale(.70)}
.mnk146-letter-sheen{transform:scale(.70)}
@media (max-width:700px){.mnk144-symbol .mnk144-monogram{transform:scale(.72)}.mnk146-letter-sheen{transform:scale(.72)}}
@media (prefers-reduced-motion:reduce){
 .mnk144-symbol .mnk144-monogram{transform:scale(.70)!important}
 .mnk144-symbol .mnk144-arc--upper,.mnk144-symbol .mnk144-arc--lower{transform:scale(1.32)!important}
}

/* Keep moving labels below the floating navigation, including at the orbit apex. */
@media (min-width:701px){
 .mnk144-symbol{top:60%}
 .mnk146-optical-field{top:60%}
 .mnk144-node{top:60%!important}
}
@media (max-width:700px){
 .mnk144-symbol{top:53%}
 .mnk146-optical-field{top:53%}
 .mnk144-node{top:53%!important}
}
@media (prefers-reduced-motion:reduce){
 .mnk144-symbol{top:auto!important}
 .mnk144-node{top:auto!important}
}

/* Compact mobile landscape/short screens: keep the orbit below the fixed header. */
@media (max-width:700px) and (max-height:720px){
 .mnk144-symbol,.mnk146-optical-field{top:64%}
 .mnk144-node{top:64%!important}
}
@media (prefers-reduced-motion:reduce) and (max-width:700px) and (max-height:720px){
 .mnk144-symbol,.mnk144-node{top:auto!important}
}


/* v150: the original artwork is three perfectly registered transparent layers.
   Reduced-motion shows the same original proportions as the assembled frame. */
@media (prefers-reduced-motion:reduce){
 .mnk144-symbol .mnk144-monogram{transform:scale(.75)!important;clip-path:none!important;filter:none!important;opacity:1!important}
 .mnk144-symbol .mnk144-arc--upper,
 .mnk144-symbol .mnk144-arc--lower{transform:rotate(0deg) scale(.75)!important;filter:none!important;opacity:1!important}
 .mnk144-symbol .mnk146-arc-echo{display:none!important}
}


/* v157: give the completed brand identity an entire additional viewport
   before the next About section arrives.  These are additive lengths;
   reduced-motion's normal-height rule remains in force. */
.mnk144-values.mnk157-extended{height:calc(450svh + 100svh);min-height:calc(2740px + 100svh)}
@media (max-width:1200px) and (min-width:701px){
  .mnk144-values.mnk157-extended{height:calc(430svh + 100svh);min-height:calc(2460px + 100svh)}
}
@media (max-width:700px){
  .mnk144-values.mnk157-extended{height:calc(420svh + 100svh);min-height:calc(2300px + 100svh)}
}
@media (max-width:370px){
  .mnk144-values.mnk157-extended{height:calc(420svh + 100svh);min-height:calc(2200px + 100svh)}
}
