/**
 * @file v10SiteStyles
 * @description The site's layout and component styles, taken from the approved v10 demo as
 *   written, in v10's order (later rules override earlier ones, so the order is kept).
 *   Left out: the demo strip, demo controls and hidden demo variants, the placeholder
 *   colour, and the chat panel (no chat at launch until legal decision 12 is made).
 *   Token values are in theme.json; their v10 names are in designTokens.css.
 *
 * @status In use (build stage 05)
 * @issues One file rather than one per component: splitting it would change the cascade.
 * @todo None
 */

*,*::before,*::after{box-sizing:border-box;}
body{margin:0;position:relative;background:var(--ground);color:var(--text-body);
  font-family:var(--font-sans);font-size:var(--fs-body);line-height:1.65;
  font-weight:var(--fw-regular);-webkit-font-smoothing:antialiased;overflow-x:hidden;}
h1,h2,h3{margin:0;color:var(--text-heading);font-weight:var(--fw-semibold);}
p,ul{margin:0;} ul{padding:0;list-style:none;}
a{color:inherit;}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}

/* the 3D field: fixed to the viewport, the page scrolls over it */
#field{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;display:block;}
#field[hidden]{display:none;}
/* the still version: one SVG the height of the page, so it scrolls with it */
.still{position:absolute;left:0;top:0;z-index:0;pointer-events:none;display:block;}

.masthead,main,.fab,.site-foot{position:relative;z-index:1;}

.wrap{width:100%;max-width:var(--container-max);margin:0 auto;padding-inline:var(--gutter);}
.offset{max-width:var(--col-offset);}
.measure{max-width:var(--measure-body);}


.masthead{position:sticky;top:env(safe-area-inset-top,0px);z-index:30;
  padding-block:var(--space-6);background:var(--ground);
  border-bottom:1px solid transparent;
  transition:border-color var(--dur-base) var(--ease-standard);}
.masthead.is-stuck{border-bottom-color:rgba(74,74,82,0.10);}
html{scroll-padding-top:88px;}
.masthead .wrap{display:flex;align-items:center;justify-content:space-between;gap:var(--space-6);flex-wrap:wrap;}
.logo{display:inline-flex;align-items:center;gap:16px;text-decoration:none;color:var(--nl-orange);}
.logo svg{display:block;flex:0 0 auto;}
.logo span{font-size:17px;line-height:1;letter-spacing:var(--tracking-wordmark);
  text-transform:uppercase;font-weight:var(--fw-semibold);white-space:nowrap;}
.nav{display:flex;gap:var(--space-6);flex-wrap:wrap;font-size:16px;letter-spacing:0.02em;}
.nav a{text-decoration:none;color:var(--text-body);transition:color var(--dur-fast) var(--ease-standard);}
.nav a:hover{color:var(--text-heading);}
.nav a.nav__cta{color:var(--text-heading);font-weight:var(--fw-semibold);}

.statement{display:flex;flex-direction:column;}
.statement--hero{min-height:calc(100vh - 186px);min-height:calc(100svh - 186px);justify-content:center;}
.statement__field{padding-block:var(--space-8);text-align:center;}
.statement .kicker{margin-bottom:var(--space-5);}
.display{font-size:var(--fs-display);font-weight:var(--fw-display);line-height:var(--lh-display);
  letter-spacing:var(--tracking-display);color:var(--text-heading);max-width:1000px;margin-inline:auto;
  font-variation-settings:"wght" var(--fw-display);text-wrap:balance;}
.statement__sub{margin-top:var(--space-6);font-size:var(--fs-h4);line-height:1.55;
  max-width:660px;margin-inline:auto;text-wrap:pretty;}
.statement__act{margin-top:var(--space-7);display:flex;flex-wrap:wrap;gap:var(--space-5) var(--space-6);
  align-items:center;justify-content:center;}
.word{font-weight:var(--fw-word);font-variation-settings:"wght" var(--fw-word);}

.btn{display:inline-flex;align-items:center;gap:12px;font-size:var(--fs-h4);font-weight:var(--fw-regular);
  color:var(--text-heading);text-decoration:none;cursor:pointer;padding:15px 30px;
  border-radius:var(--radius-pill);border:1px solid var(--btn-edge);background:transparent;
  transition:border-color var(--dur-base) var(--ease-standard),background-color var(--dur-base) var(--ease-standard);}
.btn:hover{border-color:var(--text-heading);background:var(--btn-fill);}
/* the closing button: the lines end here, so it keeps a clean white inside */
/* the closing button: solid orange, the point every line runs into. White on
   #E2551C is 3.57:1, which passes AA only as large text, so it is set at
   20px semibold (large = 18.66px bold and up), on phones too. */
.btn--close{background:var(--nl-orange);border-color:var(--nl-orange);color:#FFFFFF;font-weight:var(--fw-semibold);}
.btn--close .mark{color:#FFFFFF;}
.btn--close:hover{background:var(--nl-orange-deep);border-color:var(--nl-orange-deep);}
/* more room above and below the closing button, so the ball round it can be
   rounder (Usha, 2026-09-29) */
.band .statement__act{margin-top:clamp(80px,10vw,136px);}
.band .statement__field{padding-bottom:clamp(64px,8vw,112px);}
.mark{display:block;flex:0 0 auto;color:var(--accent);transition:transform var(--dur-fast) var(--ease-standard);}
.btn:hover .mark{transform:translateX(5px);}
.act{display:inline-flex;align-items:center;gap:10px;font-size:var(--fs-small);
  font-weight:var(--fw-semibold);color:var(--accent-text);text-decoration:none;}
.act .mark{color:var(--accent);}
.act:hover .mark{transform:translateX(4px);}

.section{padding-block:var(--section-pad);}
.kicker{display:block;font-size:var(--fs-eyebrow);font-weight:var(--fw-bold);
  text-transform:uppercase;letter-spacing:var(--tracking-eyebrow);color:var(--accent-text);}
.section__title{margin-top:var(--space-5);font-size:var(--fs-section);font-weight:var(--fw-regular);
  line-height:1.14;letter-spacing:var(--tracking-display);max-width:16ch;text-wrap:balance;}
.section__lede{margin-top:var(--space-6);max-width:var(--measure-lead);font-size:var(--fs-lead);
  line-height:1.62;text-wrap:pretty;}
.section__body{margin-top:var(--space-9);}
.section__foot{margin-top:var(--space-8);max-width:var(--measure-lead);}
.section__foot p + p{margin-top:var(--space-5);}

.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-5);}
.cards--2{grid-template-columns:repeat(2,minmax(0,1fr));}
.card{position:relative;overflow:hidden;background:var(--panel);
  padding:30px 28px 28px;display:flex;flex-direction:column;min-width:0;}
.card__photo{margin:-30px -28px 22px;aspect-ratio:5/4;max-width:calc(100% + 56px);overflow:hidden;background:var(--nl-sunken);}
.card__photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 22%;
  filter:grayscale(1) contrast(1.02);}
.card__li{margin-top:auto;padding-top:var(--space-5);display:inline-flex;align-items:center;gap:8px;
  font-size:var(--fs-caption);font-weight:var(--fw-bold);color:var(--accent-text);text-decoration:none;align-self:flex-start;}
.card__li:hover span{text-decoration:underline;text-underline-offset:3px;}
.card__n{font-size:var(--fs-caption);font-weight:var(--fw-bold);color:var(--accent-text);
  font-variant-numeric:tabular-nums;letter-spacing:0.06em;text-transform:uppercase;}
.card__ghost{position:absolute;top:-26px;right:2px;font-size:110px;line-height:1;font-weight:700;
  color:var(--accent);opacity:.08;letter-spacing:-0.05em;pointer-events:none;font-variant-numeric:tabular-nums;}
.card h3{margin-top:var(--space-4);font-size:var(--fs-card);line-height:1.2;
  letter-spacing:var(--tracking-tight);text-wrap:pretty;}
.card__for{margin-top:10px;font-family:var(--font-accent);font-style:italic;
  font-size:var(--fs-body);line-height:1.45;color:var(--text-body);}
.card__body{margin-top:var(--space-5);font-size:var(--fs-body);line-height:1.6;text-wrap:pretty;}
.card__list{margin-top:var(--space-5);display:flex;flex-direction:column;gap:9px;}
.card__list li{display:flex;align-items:baseline;gap:9px;font-size:var(--fs-small);color:var(--text-body);}
.card__list span[aria-hidden]{color:var(--accent);flex:0 0 auto;}
.card > .card__act{margin-top:auto;padding-top:var(--space-6);}

.seq{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-5);}
.seq__step{min-width:0;border:1px solid rgba(74,74,82,0.16);padding:28px 28px 30px;background:var(--ground);}
.seq__step h3{margin-top:var(--space-4);font-size:var(--fs-h4);line-height:1.16;}
.seq__step p{margin-top:var(--space-4);text-wrap:pretty;}
.meta{display:block;font-size:var(--fs-eyebrow);color:var(--accent-text);
  letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;font-weight:var(--fw-bold);}

.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-6);}
.steps + p{margin-top:var(--space-6);}
.step{min-width:0;border:1px solid rgba(74,74,82,0.16);padding:28px 28px 30px;background:var(--ground);}   /* hairline box, as the three steps (Usha, 2026-09-30) */
.step__n{font-size:var(--fs-caption);font-weight:var(--fw-bold);color:var(--accent-text);letter-spacing:0.06em;}
.step h3{margin-top:10px;font-size:var(--fs-h4);line-height:1.16;}
.step p{margin-top:10px;font-size:var(--fs-body);line-height:1.6;text-wrap:pretty;}


.figures{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-7);max-width:1100px;}
.figures > div{min-width:0;}
.figures__n{font-size:clamp(34px,4.4vw,62px);font-weight:var(--fw-display);line-height:1.05;
  letter-spacing:var(--tracking-display);color:var(--accent);
  font-variant-numeric:tabular-nums;font-variation-settings:"wght" var(--fw-display);}
.figures__c{margin-top:var(--space-4);font-size:var(--fs-caption);color:var(--text-body);text-wrap:pretty;}

.qa{padding-block:var(--space-5);}
.qa summary{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-6);
  cursor:pointer;list-style:none;}
.qa summary::-webkit-details-marker{display:none;}
.qa summary:hover h3{color:var(--nl-orange-deep);}
.qa h3{font-size:var(--fs-h4);line-height:1.16;text-wrap:pretty;font-weight:var(--fw-semibold);
  transition:color var(--dur-fast) var(--ease-standard);}
.qa__mark{position:relative;flex:0 0 auto;width:13px;height:13px;align-self:center;}
.qa__mark::before,.qa__mark::after{content:"";position:absolute;left:0;top:6px;
  width:13px;height:1.5px;background:var(--nl-orange);
  transition:transform var(--dur-base) var(--ease-standard);}
.qa__mark::after{transform:rotate(90deg);}
.qa[open] .qa__mark::after{transform:rotate(0deg);}
.qa > .measure{margin-top:var(--space-4);}

.band{min-height:92vh;display:flex;flex-direction:column;justify-content:center;
  padding-block:var(--section-pad);}
.colophon{margin-top:var(--space-10);display:flex;justify-content:space-between;
  gap:var(--space-4) var(--space-5);flex-wrap:wrap;font-size:var(--fs-caption);color:var(--text-body);}
.colophon a{text-decoration:none;}
.colophon nav{display:flex;gap:var(--space-5);flex-wrap:wrap;}
.colophon__legal{flex-basis:100%;}
/* the closing line: the brand's quote line (ui_kits/website quote band:
   30px, weight 500, tight tracking, charcoal), centred on its own line
   above the small print (Usha, 2026-09-29) */
.colophon__tag{flex-basis:100%;margin-bottom:var(--space-7);text-align:center;
  font-size:30px;font-weight:var(--fw-medium);line-height:1.3;letter-spacing:var(--tracking-tight);
  color:var(--text-heading);text-wrap:balance;}

:root.js .fade:not(.in){opacity:0;transform:translateY(14px);}
:root.js .fade.in{opacity:1;transform:none;
  transition:opacity var(--dur-reveal) var(--ease-out) var(--d,0ms),
             transform var(--dur-reveal) var(--ease-out) var(--d,0ms);}
.cards > *:nth-child(1),.steps > *:nth-child(1),.seq > *:nth-child(1){--d:0ms;}
.cards > *:nth-child(2),.steps > *:nth-child(2),.seq > *:nth-child(2){--d:60ms;}
.cards > *:nth-child(3),.steps > *:nth-child(3),.seq > *:nth-child(3){--d:120ms;}
.cards > *:nth-child(4),.steps > *:nth-child(4){--d:180ms;}

.fab{position:fixed;left:16px;bottom:16px;z-index:40;padding-bottom:env(safe-area-inset-bottom,0px);
  display:flex;flex-direction:column;align-items:flex-start;gap:12px;}
.fab[hidden]{display:none;}
.fab--in{animation:fab-rise var(--dur-reveal) var(--ease-out) both;}
@keyframes fab-rise{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:none;}}
.fab__trigger{display:inline-flex;align-items:center;gap:10px;font:inherit;font-size:var(--fs-caption);
  font-weight:var(--fw-medium);cursor:pointer;background:var(--nl-charcoal);color:var(--nl-cream);
  border:0;border-radius:var(--radius-pill);padding:12px 19px;
  transition:background-color var(--dur-base) var(--ease-standard);}
.fab__trigger:hover{background:var(--nl-orange-deep);}
.fab__trigger svg{display:block;flex:0 0 auto;}
.fab__card{background:var(--nl-sunken);padding:22px 24px 24px;max-width:308px;
  opacity:0;visibility:hidden;transform:translateY(10px);
  transition:opacity var(--dur-base) var(--ease-standard),transform var(--dur-base) var(--ease-standard),
             visibility 0s linear var(--dur-base);}
.fab__card.is-open{opacity:1;visibility:visible;transform:none;transition-delay:0s;}
.fab__head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;}
.fab__title{font-size:var(--fs-h4);line-height:1.16;color:var(--nl-charcoal);font-weight:var(--fw-semibold);}
.fab__close{background:transparent;border:0;padding:2px;cursor:pointer;color:var(--nl-body);}
.fab__close:hover{color:var(--nl-charcoal);}
.fab__close svg{display:block;}
.fab__body{margin-top:10px;font-size:var(--fs-body);line-height:1.6;color:var(--nl-body);}
.fab__act{margin-top:20px;}
.btn--sm{padding:11px 22px;font-size:var(--fs-body);color:var(--nl-charcoal);}


.brk{display:none;}
@media (min-width:760px){ .brk{display:inline;} }
@media (max-width:1000px){ .cards,.steps,.seq{grid-template-columns:repeat(2,minmax(0,1fr));} }
@media (max-width:860px){
  .figures{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-6);}
  .section__title{max-width:none;}
}
@media (max-width:700px){
  .masthead{padding-block:var(--space-5);}
  .nav{gap:var(--space-4);font-size:15px;width:100%;}
  .cards,.cards--2,.steps,.seq{grid-template-columns:minmax(0,1fr);}
}
@media (max-width:560px){
  .btn{padding:13px 24px;font-size:var(--fs-body);}
  .btn--close{font-size:19px;}
  .fab{left:10px;right:74px;bottom:10px;} .fab__card{max-width:none;}

}
@media (max-width:420px){ .figures{grid-template-columns:minmax(0,1fr);} }
/* phones: tighter rhythm (Usha, 2026-09-29: "when the screen is narrow the
   spaces should be less"). Desktop spacing is unchanged. */
@media (max-width:700px){
  .masthead{padding-block:14px;}
  .statement--hero{min-height:0;}
  .statement__field{padding-block:36px;}
  /* room under the buttons for the phone's low wave */
  .statement--hero .statement__field{padding-top:48px;padding-bottom:128px;}
  .statement__sub{margin-top:var(--space-5);}
  .statement__act{margin-top:var(--space-6);}
  .statement--page{min-height:0;}
  .section{padding-block:56px;}
  .section__title{margin-top:var(--space-4);}
  .section__lede{margin-top:var(--space-5);}
  .section__body{margin-top:44px;}
  .section__foot{margin-top:40px;}
  .seq{gap:16px;} .steps{gap:16px;}
  .seq__step,.step{padding:22px 22px 24px;}
  .figures{gap:var(--space-5);}

  .card{padding:24px 22px 24px;}
  .card__photo,.card > .shot{margin:-24px -22px 20px;max-width:calc(100% + 44px);}
  .band{min-height:0;padding-block:64px 32px;}
  .band .statement__act{margin-top:64px;}
  .band .statement__field{padding-bottom:52px;}
  .colophon{margin-top:var(--space-7);}
  .colophon__tag{margin-bottom:var(--space-6);font-size:24px;}
  /* room under the small print, so the floating button does not cover it */
  .colophon{padding-bottom:76px;}

  /* the menu becomes a button (2026-09-29): two lines that turn into a
     cross, opening a full-width panel under the header with the links
     stacked at a size a thumb can hit */
  .masthead .wrap{flex-wrap:nowrap;}
  .menu-btn{display:inline-flex;flex-direction:column;justify-content:center;gap:7px;
    width:44px;height:44px;margin-right:-10px;padding:0 10px;background:transparent;border:0;cursor:pointer;}
  .menu-btn span{display:block;height:1.5px;width:24px;background:var(--nl-charcoal);
    transition:transform var(--dur-base) var(--ease-standard);}
  .masthead.menu-open .menu-btn span:first-child{transform:translateY(4.25px) rotate(45deg);}
  .masthead.menu-open .menu-btn span:last-child{transform:translateY(-4.25px) rotate(-45deg);}
  .nav{position:absolute;left:0;right:0;top:100%;width:auto;flex-direction:column;flex-wrap:nowrap;gap:0;
    padding:8px var(--gutter) 28px;background:var(--ground);border-bottom:1px solid rgba(74,74,82,0.10);
    font-size:22px;letter-spacing:0;
    opacity:0;visibility:hidden;transform:translateY(-6px);
    transition:opacity var(--dur-base) var(--ease-standard),transform var(--dur-base) var(--ease-standard),
               visibility 0s linear var(--dur-base);}
  .nav a{padding:14px 0;color:var(--text-heading);border-top:1px solid rgba(74,74,82,0.08);}
  .nav a:first-child{border-top:0;}
  .nav a.is-here{color:var(--accent-text);}
  .masthead.menu-open{border-bottom-color:rgba(74,74,82,0.10);}
  .masthead.menu-open .nav{opacity:1;visibility:visible;transform:none;transition-delay:0s;}
}
@media (min-width:701px){ .menu-btn{display:none;} }
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:1ms!important;transition-duration:1ms!important;}
}

/* ---- pages, placeholders and the form: added 2026-09-29 for the content pass ---- */
.page[hidden]{display:none!important;}
.statement--page{min-height:calc(78vh - 186px);justify-content:center;}
.statement--page .display{font-size:clamp(34px,6.4vw,66px);}
.statement__field .kicker{margin-bottom:var(--space-5);}
.figures--4{grid-template-columns:repeat(4,minmax(0,1fr));max-width:none;}
/* three figures in one row (Usha, 2026-09-30); a second row of three if more figures arrive */
.figures--3{grid-template-columns:repeat(3,minmax(0,1fr));max-width:none;}
/* two figures (Suite band, 2026-09-30: the styling figures left) */
.figures--2{grid-template-columns:repeat(2,minmax(0,1fr));max-width:760px;}
/* the "For ..." line in cards and product boxes: DM Sans, emphasis by weight (Usha, 2026-09-30) */
.card__for,.prod__for{font-family:var(--font-sans)!important;font-style:normal!important;
  font-weight:var(--fw-medium);font-size:var(--fs-small)!important;line-height:1.5!important;color:var(--text-heading)!important;}
/* ---- About: the name, 2026-09-30 (Usha) ---- */
.name__text{margin-top:var(--space-6);max-width:var(--measure-lead);font-size:var(--fs-lead);line-height:1.62;text-wrap:pretty;}
.name__text p + p{margin-top:var(--space-5);}
.name__text strong{font-weight:var(--fw-semibold);color:var(--text-heading);}
.name__tag{margin-top:var(--space-7);font-size:clamp(22px,2.2vw,28px);font-weight:var(--fw-medium);line-height:1.3;
  letter-spacing:var(--tracking-tight);color:var(--text-heading);text-wrap:balance;}
/* ---- Consulting: client stories, 2026-09-30 ---- */
.story{padding-top:var(--space-7);border-top:1px solid rgba(74,74,82,0.14);max-width:1000px;}
.story + .story{margin-top:var(--space-9);}
.story h3{font-size:var(--fs-card);line-height:1.2;letter-spacing:var(--tracking-tight);}
.story__for{margin-top:6px;font-size:var(--fs-small);font-weight:var(--fw-medium);color:var(--text-body);}
.story__text{margin-top:var(--space-5);max-width:var(--measure-lead);font-size:var(--fs-body);line-height:1.65;text-wrap:pretty;}
.story .figures{margin-top:var(--space-7);}
.story__line{margin-top:var(--space-6);max-width:var(--measure-lead);}
.story .act{margin-top:var(--space-5);}
@media (max-width:700px){ .story{padding-top:var(--space-6);} .story + .story{margin-top:56px;} }
/* ---- the footer, 2026-09-30 (Usha): two quiet rows. The site menu (lined
   up with the header's logo) and a LinkedIn "in" on the right; under a
   hairline, the company line and the legal links, smaller. ---- */
.colophon{display:block;}
.colophon__row{display:flex;justify-content:space-between;align-items:center;gap:var(--space-4) var(--space-6);flex-wrap:wrap;}
.colophon__menu{display:flex;flex-wrap:wrap;gap:var(--space-3) var(--space-5);font-size:var(--fs-caption);}
.colophon__menu a{color:var(--text-body);}
.colophon__menu a:hover,.colophon__row--legal a:hover{color:var(--accent-text);}
.colophon__icons{display:inline-flex;gap:14px;align-items:center;}
.colophon__in{display:inline-flex;color:var(--text-body);opacity:.55;transition:opacity var(--dur-fast) var(--ease-standard),color var(--dur-fast) var(--ease-standard);}
.colophon__in:hover{opacity:1;color:var(--accent-text);}
/* more room under the footer line, less under the footer (Usha, 2026-09-30) */
.colophon__tag{margin-bottom:var(--space-9);}
.band{padding-bottom:var(--space-8);}

.colophon__row--legal{margin-top:10px;font-size:var(--fs-caption);}
.colophon__row--legal nav{display:flex;gap:var(--space-5);flex-wrap:wrap;}
@media (max-width:700px){ .colophon__menu{gap:var(--space-3) var(--space-5);} .colophon__row--legal{flex-direction:column;align-items:flex-start;} }
/* ---- Suite: how it runs, 2026-09-30 (the MCE-EOS page's depth, joined) ---- */
.inside__head{font-size:var(--fs-card);font-weight:var(--fw-semibold);line-height:1.25;letter-spacing:var(--tracking-tight);color:var(--text-heading);}
.inside__head span{font-weight:var(--fw-regular);color:var(--text-body);font-size:var(--fs-body);letter-spacing:0;}
.inside__sub{margin-top:8px;margin-bottom:var(--space-6);max-width:var(--measure-lead);}
.prods{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-5);}
.prods--2{grid-template-columns:repeat(2,minmax(0,1fr));max-width:900px;}
.prod{min-width:0;border:1px solid rgba(74,74,82,0.16);padding:26px 26px 28px;background:var(--ground);display:flex;flex-direction:column;}
.prod h3{font-size:var(--fs-h4);line-height:1.2;letter-spacing:var(--tracking-tight);}
.prod__for{margin-top:8px;font-family:var(--font-accent);font-style:italic;font-size:var(--fs-body);line-height:1.45;}
.prod__what{margin-top:10px;font-size:var(--fs-body);line-height:1.6;text-wrap:pretty;}
.prod__what + .prod__what{margin-top:var(--space-3);}
.prod__meta{margin-top:auto;padding-top:var(--space-5);font-size:var(--fs-caption);line-height:1.5;}
.prod__status{font-weight:var(--fw-bold);color:var(--accent-text);}
.prod .act{margin-top:var(--space-4);}
.prods > *:nth-child(1){--d:0ms;} .prods > *:nth-child(2){--d:60ms;} .prods > *:nth-child(3){--d:120ms;}
.prods > *:nth-child(4){--d:0ms;} .prods > *:nth-child(5){--d:60ms;} .prods > *:nth-child(6){--d:120ms;}
.figures__u{display:block;margin-top:10px;font-size:var(--fs-lead);line-height:1.3;font-weight:var(--fw-semibold);
  font-variation-settings:"wght" 600;letter-spacing:-0.01em;color:var(--text-heading);text-wrap:balance;}
@media (max-width:1000px){ .prods{grid-template-columns:repeat(2,minmax(0,1fr));} }
@media (max-width:700px){ .prods{grid-template-columns:minmax(0,1fr);gap:16px;} .prod{padding:22px 22px 24px;}
  .figures--2{grid-template-columns:minmax(0,1fr);} }
.shot{display:flex;align-items:center;justify-content:center;text-align:center;aspect-ratio:16/10;
  background:var(--nl-sunken);border:1px dashed rgba(74,74,82,0.30);color:var(--text-body);
  font-size:var(--fs-caption);line-height:1.5;padding:16px;margin-bottom:var(--space-6);}
.card > .shot{margin:-30px -28px 22px;border-width:0 0 1px;}
.shot strong{color:var(--text-heading);font-weight:var(--fw-semibold);}
.legal{max-width:var(--measure-lead);font-size:var(--fs-body);line-height:1.65;color:var(--text-body);}
.legal h2{margin-top:var(--space-8);font-size:var(--fs-card);line-height:1.25;color:var(--text-heading);font-weight:var(--fw-semibold);}
.legal p,.legal ul,.legal__table{margin-top:var(--space-4);}
.legal ul{padding-left:1.2em;}
.legal li+li{margin-top:var(--space-3);}
.legal__date{font-size:var(--fs-small);}
.legal__table{overflow-x:auto;}
.legal table{border-collapse:collapse;width:100%;font-size:var(--fs-small);line-height:1.5;}
.legal th,.legal td{text-align:left;vertical-align:top;padding:var(--space-3) var(--space-4) var(--space-3) 0;border-bottom:1px solid rgba(74,74,82,0.14);}
.legal th{color:var(--text-heading);font-weight:var(--fw-semibold);}
.legal code{font-size:0.92em;}
@media (max-width:640px){.legal thead{position:absolute;left:-9999px;}
.legal tr{display:block;padding:var(--space-4) 0;border-bottom:1px solid rgba(74,74,82,0.14);}
.legal td{display:block;border:0;padding:4px 0;}
.legal td[data-label]::before{content:attr(data-label);display:block;font-weight:var(--fw-semibold);color:var(--text-heading);}}
.page--plain .section{padding-top:var(--space-8);padding-bottom:var(--space-8);}
.legal__title{margin-top:var(--space-4);font-size:var(--fs-section);font-weight:var(--fw-regular);
  line-height:1.14;letter-spacing:var(--tracking-display);color:var(--text-heading);}
.legal__title + .legal__date{margin-top:var(--space-5);}
.plain-foot{padding-block:var(--space-7) var(--space-8);}   /* no hairline above the legal pages' footer (Usha, 2026-10-02) */
.plain-foot .colophon{margin-top:0;}
.plain-foot .colophon__tag{display:none;}
.page-head{padding-top:var(--space-8);}
.page-head__title{margin-top:var(--space-4);font-size:var(--fs-section);font-weight:var(--fw-regular);
  line-height:1.14;letter-spacing:var(--tracking-display);color:var(--text-heading);max-width:16ch;text-wrap:balance;}
.page-head__sub{margin-top:var(--space-5);max-width:var(--measure-lead);font-size:var(--fs-lead);line-height:1.62;text-wrap:pretty;}
.page-head + .section{padding-top:var(--space-8);}
.page-head + .section .wrap > .section__body:first-child{margin-top:0;}
.fab__icon{display:inline-flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:50%;
  background:var(--nl-charcoal);color:var(--nl-cream);transition:background-color var(--dur-base) var(--ease-standard);}
.fab__icon:hover{background:var(--nl-orange-deep);}
.fab__icon svg{display:block;}
@media (max-width:560px){ .fab{right:auto;} }
.page-head__act{margin-top:var(--space-6);}
.contact__other{margin-top:var(--space-6);font-size:var(--fs-small);color:var(--text-body);}
.contact__other a{color:var(--text-heading);font-weight:var(--fw-semibold);text-decoration:none;}
.contact__other a:hover{color:var(--accent-text);}
.or{display:inline-block;width:18px;}
.statement__act .act{vertical-align:middle;}
.form{display:grid;gap:18px;max-width:560px;}
.form label{display:block;margin-bottom:6px;font-size:var(--fs-small);font-weight:var(--fw-semibold);color:var(--text-heading);}
.form .opt{font-weight:var(--fw-regular);color:var(--text-body);}
.form input:not([type=checkbox]),.form textarea{width:100%;font:inherit;font-size:var(--fs-body);padding:12px 14px;
  border:1px solid rgba(74,74,82,0.24);border-radius:0;background:#FFFFFF;color:var(--text-heading);}
.form input:focus,.form textarea:focus{outline:2px solid var(--nl-orange-deep);outline-offset:1px;}
.form .check{display:flex;gap:10px;align-items:flex-start;font-weight:var(--fw-regular);color:var(--text-body);}
.form .check input{margin-top:5px;}
.form__note{font-size:var(--fs-caption);}
@media (max-width:1000px){ .figures--4{grid-template-columns:repeat(2,minmax(0,1fr));} }
@media (max-width:860px){ .figures--4{grid-template-columns:minmax(0,1fr);} }
@media (max-width:860px){ .figures--3{grid-template-columns:minmax(0,1fr);} }
.lv{margin:var(--space-9) 0 0;}
@media (max-width:700px){ .lv{margin-top:56px;} }
.lv__cap{font-size:var(--fs-eyebrow);font-weight:var(--fw-bold);letter-spacing:var(--tracking-eyebrow);
  text-transform:uppercase;color:var(--text-body);margin-bottom:var(--space-4);}
.lv__cap--foot{margin:var(--space-5) 0 0;text-transform:none;letter-spacing:0;font-weight:var(--fw-regular);font-size:var(--fs-caption);}

/* ---- language switcher, 2026-09-30: a look only, not working yet (Usha).
   ES and PT come from the content engine's translation pass. ---- */
.nav{align-items:center;}
.nav .lang{display:inline-flex;align-items:center;gap:2px;margin-left:calc(-1*var(--space-6) + var(--space-5));
  padding-left:var(--space-5);border-left:1px solid rgba(74,74,82,0.18);font-size:13px;letter-spacing:0.08em;}
.nav .lang a{padding:4px 6px;color:var(--text-body);font-weight:var(--fw-medium);}
.nav .lang a.is-lang{color:var(--text-heading);font-weight:var(--fw-bold);}
.nav .lang a:not(.is-lang):hover{color:var(--accent-text);}
@media (max-width:700px){
  .nav{align-items:stretch;}
  .nav .lang{margin:0;padding:18px 0 0;border-left:0;border-top:1px solid rgba(74,74,82,0.08);gap:14px;font-size:15px;}
  .nav .lang a{padding:6px 0;border-top:0;font-size:15px;}
}
/* ---- a blog post, 2026-09-30: small header, text 640px wide, a sphere
   beside the header (it is a shape host, see secs) that stays on screen
   beside the text while you read (data-pin), then turns into the "More
   from the blog" shape and the ball ---- */
.post{padding-top:var(--space-8);}
.post .kicker a{text-decoration:none;color:inherit;}
.post .kicker a:hover{text-decoration:underline;text-underline-offset:3px;}
.post__head,.post__body,.post__author{max-width:var(--measure-lead);}
.post__title{margin-top:var(--space-4);font-size:var(--fs-section);font-weight:var(--fw-regular);line-height:1.14;
  letter-spacing:var(--tracking-display);color:var(--text-heading);text-wrap:balance;}
.post__meta{margin-top:var(--space-5);font-size:var(--fs-small);}
.post__img{margin:var(--space-7) 0;max-width:880px;aspect-ratio:16/8;}
.post__body{font-size:18px;line-height:1.7;}
.post__body p + p{margin-top:var(--space-5);}
.post__lede{font-size:var(--fs-lead);line-height:1.6;color:var(--text-heading);}
.post__body h2{margin:var(--space-8) 0 var(--space-4);font-size:26px;line-height:1.2;letter-spacing:var(--tracking-tight);font-weight:var(--fw-semibold);}
.post__quote{margin:var(--space-7) 0;padding:4px 0 4px var(--space-6);border-left:2px solid var(--nl-orange);}
.post__quote p{font-family:var(--font-accent);font-style:italic;font-size:26px;line-height:1.4;color:var(--text-heading);}
.post__body ul{margin:var(--space-5) 0;padding-left:1.2em;}
.post__body li + li{margin-top:var(--space-3);}
.post__body a{color:var(--accent-text);text-underline-offset:3px;}
.post__table{width:100%;margin:var(--space-6) 0;border-collapse:collapse;font-size:16px;line-height:1.5;}
.post__table th,.post__table td{text-align:left;vertical-align:top;padding:12px 16px 12px 0;border-bottom:1px solid rgba(74,74,82,0.14);}
.post__table th{font-weight:var(--fw-semibold);color:var(--text-heading);}
.post__table td strong{color:var(--text-heading);}
.post__author{margin-top:var(--space-8);padding-top:var(--space-6);border-top:1px solid rgba(74,74,82,0.14);
  display:flex;gap:var(--space-5);align-items:flex-start;}
.post__author img{width:72px;height:72px;object-fit:cover;filter:grayscale(1);flex:0 0 auto;}
.post__by{color:var(--text-heading);}
.post__role{font-size:var(--fs-small);margin-top:4px;}
.post__author .card__li{padding-top:10px;}
.card__link{text-decoration:none;color:inherit;}
.card__link:hover{color:var(--accent-text);}
@media (max-width:700px){ .post{padding-top:var(--space-6);} .post__body{font-size:17px;} .post__quote p{font-size:22px;} .post__img{aspect-ratio:16/10;} }

.lv-cycle__grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:var(--space-8);align-items:center;max-width:1060px;}
.lv-cycle__svg{display:block;width:100%;height:auto;overflow:visible;}
.lv-cycle__path{fill:none;stroke:var(--nl-charcoal);stroke-opacity:.35;stroke-width:1.2;}
.lv-cycle__ticks line{stroke:var(--nl-orange);stroke-width:3;stroke-linecap:round;}
.lv-cycle__nodes rect{fill:var(--nl-charcoal);}
.lv-cycle__core{fill:var(--nl-orange);}
.lv-cycle__run{fill:var(--nl-charcoal);}
.lv-cycle__labels text{font-family:var(--font-sans);font-size:21px;font-weight:600;fill:var(--nl-charcoal);letter-spacing:-0.01em;}
.lv-cycle__lead{font-size:var(--fs-lead);line-height:1.5;color:var(--text-heading);text-wrap:pretty;}
.lv-cycle__item{margin-top:var(--space-5);display:flex;gap:14px;align-items:baseline;font-size:var(--fs-body);}
.lv-cycle__sw{flex:0 0 auto;display:inline-block;}
.lv-cycle__sw--tick{width:4px;height:18px;background:var(--nl-orange);border-radius:2px;transform:translateY(3px);}
.lv-cycle__sw--core{width:14px;height:14px;border-radius:50%;background:var(--nl-orange);transform:translateY(1px);}
@media (max-width:860px){ .lv-cycle__grid{grid-template-columns:minmax(0,1fr);gap:var(--space-6);} .lv-cycle__svg{max-width:520px;margin:0 auto;} .lv-cycle__labels text{font-size:25px;} }

/* ---- post narration, 2026-09-30: the content engine's audio module on our
   own posts. A look only: no audio file yet, the bar just runs. ---- */
.listen{margin-top:var(--space-6);max-width:var(--measure-lead);display:flex;align-items:center;gap:var(--space-5);
  flex-wrap:wrap;border:1px solid rgba(74,74,82,0.16);padding:18px 22px;}
.listen__play{flex:0 0 auto;width:48px;height:48px;border-radius:50%;border:0;cursor:pointer;display:inline-flex;
  align-items:center;justify-content:center;background:var(--nl-orange);color:#fff;transition:background-color var(--dur-base) var(--ease-standard);}
.listen__play:hover{background:var(--nl-orange-deep);}
.listen__play .i-pause,.listen__play[aria-pressed="true"] .i-play{display:none;}
.listen__play[aria-pressed="true"] .i-pause{display:block;}
.listen__main{flex:1 1 260px;min-width:0;}
.listen__title{font-size:var(--fs-body);font-weight:var(--fw-semibold);color:var(--text-heading);display:flex;justify-content:space-between;gap:12px;}
.listen__time{font-weight:var(--fw-regular);font-size:var(--fs-caption);color:var(--text-body);font-variant-numeric:tabular-nums;}
.listen__bar{margin-top:10px;height:3px;background:rgba(74,74,82,0.14);}
.listen__bar span{display:block;height:100%;width:0;background:var(--nl-orange);}
.listen__note{margin-top:8px;font-size:var(--fs-caption);}
.listen__pod{flex:0 0 auto;font-size:var(--fs-caption);font-weight:var(--fw-semibold);color:var(--text-heading);}

/* ---- WordPress fit: what v10 had inside one page, the theme splits into parts ---- */
/* the footer part: v10's colophon sat inside the closing band */
.site-foot{padding-bottom:var(--space-8);}
.site-foot .colophon{margin-top:var(--space-10);}
.site-foot--plain{padding-block:var(--space-7) var(--space-8);}
.site-foot--plain .colophon{margin-top:0;}
.site-foot--plain .colophon__tag{display:none;}
@media (max-width:700px){ .site-foot .colophon{margin-top:var(--space-7);} .site-foot--plain .colophon{margin-top:0;} }
/* the closing band no longer holds the footer, so it gives that height back */
.band{min-height:72vh;padding-bottom:0;}
@media (max-width:700px){ .band{min-height:0;padding-block:64px 0;} }
/* WordPress wraps the page in its own boxes; they add no spacing of their own */
.wp-site-blocks > *{margin-block:0;}
/* the "skip to content" target */
main:focus{outline:none;}

/* ---- About: the team as rows, 2026-10-06 (Usha): one person per row, the
   photo beside the text, so the longer About texts have room. The homepage
   keeps the three short cards. ---- */
.cards.cards--rows{grid-template-columns:minmax(0,1fr);gap:var(--space-8);}
.cards--rows .card{display:grid;grid-template-columns:260px minmax(0,1fr);column-gap:var(--space-7);align-content:start;
  background:none;padding:var(--space-7) 0 0;border-top:1px solid rgba(74,74,82,0.14);overflow:visible;}
.cards--rows .card > *{grid-column:2;max-width:var(--measure-lead);}
.cards--rows .card > .card__photo{grid-column:1;grid-row:1 / span 12;align-self:start;margin:0;max-width:none;aspect-ratio:4/5;}
.cards--rows .card > .card__n{margin-top:0;}
.cards--rows .card > .card__li{margin-top:var(--space-5);padding-top:0;justify-self:start;}
@media (max-width:700px){
  .cards.cards--rows{gap:var(--space-7);}
  .cards--rows .card{grid-template-columns:minmax(0,1fr);padding-top:var(--space-6);}
  .cards--rows .card > *{grid-column:1;}
  .cards--rows .card > .card__photo{grid-row:auto;max-width:240px;margin:0 0 var(--space-5);}
}
