/* Farol Desk case study (farol-desk/ and en/farol-desk/).
   Loaded after site.css. The site's header, footer and skip link keep their markup and are
   only re-toned through the tokens below; everything else on the page is scoped to html.fd
   and uses the fd- prefix, so no other page is affected.

   Look: quiet, light and plain. A #f5f5f7 page with white surfaces, one sans family in the
   system (SF) style, one accent colour (petrol) on links and buttons, hairline dividers, a
   lot of white space. Amber exists only in the lighthouse logo and as the small dot of the
   "por quê?" pill. Motion is a light fade on scroll, off with prefers-reduced-motion. */

html.fd{
  --fd-bg:#f5f5f7; --fd-surface:#fff; --fd-text:#1d1d1f; --fd-text-2:#6e6e73;
  --fd-line:rgba(0,0,0,.08); --fd-line-2:rgba(0,0,0,.16);
  --fd-accent:#0e6a78; --fd-accent-dark:#0a535e; --fd-accent-soft:rgba(14,106,120,.09);
  --fd-amber:#f2b84b; --fd-logo-ink:#0f2530;
  --fd-sans:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","Inter",system-ui,sans-serif;
  --fd-code:ui-monospace,"SF Mono",SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;
  --fd-max:1120px; --fd-r:22px; --fd-r-lg:28px;
  --fd-shadow:0 0 0 1px rgba(0,0,0,.05),0 22px 60px -34px rgba(0,0,0,.22);
  /* the site's own tokens, re-toned so its header and footer sit on the light page */
  --ink:#f5f5f7; --ink-2:#fff; --ink-rgb:245,245,247; --ink2-rgb:255,255,255;
  --fg:#1d1d1f; --fg-2:#424245; --mute:#6e6e73;
  --line:rgba(0,0,0,.08); --line-2:rgba(0,0,0,.16); --cyan:#0e6a78;
  --display:var(--fd-sans); --mono:var(--fd-code);
  background:var(--fd-bg);
  color-scheme:light;
}
.fd body{background:var(--fd-bg);color:var(--fd-text);font:400 17px/1.55 var(--fd-sans);letter-spacing:-.011em}
.fd main{display:block}
.fd :focus-visible{outline:2px solid var(--fd-accent);outline-offset:3px}
.fd ::selection{background:var(--fd-accent);color:#fff}

/* ---------- the site header and footer, in the light tone ---------- */
.fd .hdr{background:rgba(245,245,247,.82);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);color:var(--fd-text);border-bottom-color:var(--fd-line)}
.fd .brand{font:600 17px/1 var(--fd-sans);font-stretch:normal;letter-spacing:-.02em}
.fd .brand small{font:400 12px/1 var(--fd-sans);letter-spacing:0;text-transform:none;color:var(--fd-text-2)}
.fd .brand-mark{border-radius:2px}
.fd .nav a{font:400 13px/1 var(--fd-sans);letter-spacing:-.005em;color:var(--fd-text-2);padding:8px 10px;white-space:nowrap}
.fd .nav a i{display:none}
.fd .nav a:hover,.fd .nav a[aria-current="true"]{color:var(--fd-text)}
.fd .nav a[aria-current="true"]{box-shadow:none;font-weight:600}
.fd .tgl,.fd .menu-btn{height:32px;padding:0 14px;border:1px solid var(--fd-line-2);border-radius:999px;background:transparent;color:var(--fd-text);font:500 13px/1 var(--fd-sans);letter-spacing:0;text-transform:none}
.fd .tgl:hover,.fd .menu-btn:hover{border-color:var(--fd-text)}
.fd .skip{border-radius:999px;background:var(--fd-text);color:#fff;font:500 14px/1.4 var(--fd-sans)}
.fd .foot{background:var(--fd-bg);border-top-color:var(--fd-line);color:var(--fd-text-2);font:400 12.5px/1.7 var(--fd-sans);letter-spacing:0}
.fd .foot .foot-id{color:var(--fd-text)}
.fd .foot a{color:var(--fd-accent)}
@media (max-width:1380px){.fd .brand small{display:none}}
/* seven sections: below 1000px the menu folds behind the Menu button, as the home does below 900px */
@media (max-width:1000px){
  .fd .nav{position:fixed;top:var(--hdr);left:0;right:0;flex-direction:column;gap:0;margin:0;padding:4px var(--gr) 16px var(--gl);background:rgba(245,245,247,.98);border-bottom:1px solid var(--fd-line);display:none}
  .fd.nav-open .nav{display:flex}
  .fd .nav a{padding:15px 0;font-size:17px;color:var(--fd-text);border-top:1px solid var(--fd-line)}
  .fd .nav a:first-child{border-top:0}
  .fd .hdr-tools{margin-left:auto}
  .fd .menu-btn{display:inline-flex}
}
@media (pointer:coarse),(max-width:900px){.fd .tgl,.fd .menu-btn{height:40px;padding:0 16px}}

.fd-sprite{position:absolute;width:0;height:0;overflow:hidden}
.fd-wrap{max-width:var(--fd-max);margin:0 auto;padding:0 var(--gr) 0 var(--gl)}
.fd code{font:500 .88em/1.4 var(--fd-code);letter-spacing:0;color:var(--fd-text);overflow-wrap:anywhere}
.fd-main :where(a:not([class])){color:var(--fd-accent);text-decoration:none}
.fd-main :where(a:not([class])):hover{text-decoration:underline;text-underline-offset:3px}
.fd-main b{font-weight:600}
.fd-title,.fd-tag,.fd-h2,.fd-h3,.fd-intro,.fd-big,.fd-q,.fd-end-t,.fd-ribbon p,.fd-lede,.fd-demo,.fd-callout,.fd-keys dt,.fd-frame figcaption{text-wrap:balance}

/* ---------- buttons: pills, one accent ---------- */
.fd-btn{display:inline-flex;align-items:center;gap:6px;min-height:46px;padding:0 24px;border:1px solid var(--fd-accent);border-radius:999px;font:500 17px/1 var(--fd-sans);letter-spacing:-.011em;text-decoration:none;white-space:nowrap;transition:background .2s,color .2s,border-color .2s}
.fd-btn-fill{background:var(--fd-accent);color:#fff}
.fd-btn-fill:hover{background:var(--fd-accent-dark);border-color:var(--fd-accent-dark)}
.fd-btn-line{background:transparent;color:var(--fd-accent)}
.fd-btn-line:hover{background:var(--fd-accent);color:#fff}
.fd-tlink{display:inline-flex;align-items:center;min-height:46px;padding:0 6px;font:400 17px/1 var(--fd-sans);letter-spacing:-.011em;color:var(--fd-accent);text-decoration:none}
.fd-tlink:hover{text-decoration:underline;text-underline-offset:4px}

/* ---------- the logo: the amber lighthouse on its ink tile ---------- */
.fd-logo{display:inline-grid;place-items:center;width:64px;height:64px;border-radius:17px;background:var(--fd-logo-ink);color:var(--fd-amber);box-shadow:0 14px 30px -16px rgba(15,37,48,.55)}
.fd-logo svg{display:block;width:40px;height:40px}

/* ---------- the note about the old name: a ribbon under the header ---------- */
.fd-ribbon{margin-top:var(--hdr);background:var(--fd-surface);border-bottom:1px solid var(--fd-line)}
.fd-ribbon p{max-width:860px;margin:0 auto;padding:13px 0;text-align:center;font-size:14.5px;line-height:1.45;color:var(--fd-text-2)}
.fd-ribbon b{color:var(--fd-text)}

/* ---------- hero: light, centred, a lot of air ---------- */
.fd-hero{background:linear-gradient(180deg,#fbfbfd 0%,var(--fd-bg) 100%);padding:20px 0 0;text-align:center}
.fd-back{margin:0;text-align:left;font-size:14px;line-height:1.4}
.fd-back a{display:inline-flex;align-items:center;min-height:44px;color:var(--fd-text-2);text-decoration:none}
.fd-back a:hover{color:var(--fd-accent)}
.fd-hero-in{padding-top:clamp(20px,4vw,56px)}
.fd-hero .fd-eyebrow{margin:26px 0 0}
.fd-title{margin:10px 0 0;font:600 clamp(56px,11.6vw,136px)/.98 var(--fd-sans);letter-spacing:-.05em;color:var(--fd-text)}
.fd-tag{max-width:22em;margin:clamp(18px,2.4vw,28px) auto 0;font:500 clamp(22px,2.7vw,32px)/1.2 var(--fd-sans);letter-spacing:-.025em;color:var(--fd-text)}
.fd-tag em{font-style:normal}
.fd-lede{max-width:60ch;margin:18px auto 0;font-size:clamp(17px,1.5vw,19px);line-height:1.5;color:var(--fd-text-2)}
.fd-cta{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px 18px;margin-top:30px}
.fd-demo{max-width:60ch;margin:18px auto 0;font-size:14px;line-height:1.5;color:var(--fd-text-2)}
.fd-demo b{color:var(--fd-text)}
.fd-frame.fd-hero-shot{max-width:1040px;margin:clamp(40px,7vw,88px) auto 0}
.fd-keys{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:clamp(56px,8vw,104px) 0 0;padding:0}
.fd-keys div{display:flex;flex-direction:column-reverse;justify-content:flex-end;padding:0 16px;border-left:1px solid var(--fd-line)}
.fd-keys div:first-child{border-left:0}
.fd-keys dd{margin:0;font:600 clamp(40px,6vw,80px)/1 var(--fd-sans);letter-spacing:-.045em;color:var(--fd-text);font-variant-numeric:tabular-nums}
.fd-keys dt{max-width:15em;margin:12px auto 0;font-size:15px;line-height:1.35;color:var(--fd-text-2)}
.fd-keys-src{margin:28px 0 0;font-size:14px;line-height:1.5;color:var(--fd-text-2)}

/* ---------- sections ---------- */
.fd-sec{padding-top:clamp(96px,13vw,176px)}
.fd-head{max-width:820px;margin:0 auto clamp(40px,5.5vw,72px);text-align:center}
.fd-kick,.fd-eyebrow{margin:0 0 10px;font:600 17px/1.3 var(--fd-sans);letter-spacing:-.015em;color:var(--fd-text-2)}
.fd-kick b{font-weight:600;margin-right:.45em}
.fd-kick b::after{content:" ·"}
.fd-h2{margin:0;font:600 clamp(36px,5.4vw,64px)/1.05 var(--fd-sans);letter-spacing:-.04em;color:var(--fd-text)}
.fd-h2:focus,.fd-h3:focus{outline:none}
.fd-h2 em{font-style:normal}
.fd-intro{max-width:36em;margin:18px auto 0;font-size:clamp(19px,1.75vw,22px);line-height:1.4;letter-spacing:-.018em;color:var(--fd-text-2)}
.fd-h3{margin:0;font:600 clamp(26px,3vw,38px)/1.1 var(--fd-sans);letter-spacing:-.032em;color:var(--fd-text)}
.fd-h3 em{font-style:normal}
.fd-h4{margin:0;font:600 clamp(19px,1.8vw,22px)/1.25 var(--fd-sans);letter-spacing:-.022em;color:var(--fd-text)}
.fd-src{margin:26px 0 0;font-size:14px;line-height:1.6;color:var(--fd-text-2);text-align:center}
.fd-list{list-style:none;margin:20px 0 0;padding:0}
.fd-list li{padding:14px 0;border-top:1px solid var(--fd-line);font-size:17px;line-height:1.5;color:var(--fd-text-2)}
.fd-list li:first-child{border-top:0;padding-top:0}
.fd-list b{color:var(--fd-text)}

/* ---------- in 60 seconds + the brief ---------- */
.fd-60 .fd-h2{font-size:17px;line-height:1.3;letter-spacing:-.015em;color:var(--fd-text-2);text-align:center}
.fd-big{max-width:22em;margin:14px auto 0;text-align:center;font:600 clamp(28px,4.2vw,52px)/1.1 var(--fd-sans);letter-spacing:-.04em;color:var(--fd-text-2)}
.fd-big strong{font-weight:600;color:var(--fd-text)}
.fd-qa{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,4vw,56px);margin:clamp(48px,6vw,80px) 0 0}
.fd-qa dt{font:600 17px/1.3 var(--fd-sans);letter-spacing:-.018em;color:var(--fd-text)}
.fd-qa dd{margin:8px 0 0;color:var(--fd-text-2)}
.fd-qa dd span{font-weight:600;color:var(--fd-text)}
.fd-sheet{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(20px,3vw,40px);margin:clamp(40px,5vw,64px) 0 0;background:var(--fd-surface);border-radius:var(--fd-r-lg);padding:clamp(24px,3.6vw,44px)}
.fd-sheet dt{font-size:14px;line-height:1.4;color:var(--fd-text-2)}
.fd-sheet dd{margin:6px 0 0;font-size:16px;line-height:1.45;color:var(--fd-text)}
.fd-ask{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,5vw,72px);align-items:start}
.fd-ask p{margin:0 0 14px;color:var(--fd-text-2)}
.fd-pull{margin:22px 0 0!important;font:600 clamp(21px,2.2vw,28px)/1.2 var(--fd-sans);letter-spacing:-.03em;color:var(--fd-text)!important}
.fd-check{list-style:none;margin:6px 0 0;padding:0}
.fd-check li{padding:13px 0;border-top:1px solid var(--fd-line);font-size:16.5px;line-height:1.5}
.fd-check li:first-child{border-top:0}

/* ---------- product: real screenshots in plain frames ---------- */
.fd-row{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(28px,5vw,72px);align-items:center;margin-top:clamp(72px,10vw,136px)}
.fd-head + .fd-row{margin-top:0}
.fd-row>.fd-frame{grid-column:span 7}
.fd-row>.fd-copy{grid-column:span 5}
.fd-row.fd-rev>.fd-frame{order:2}
.fd-frame{margin:0}
.fd-frame>a,.fd-frame>img,.fd-frame>video{display:block;border-radius:var(--fd-r);background:var(--fd-surface);box-shadow:var(--fd-shadow);overflow:hidden}
.fd-frame>a{line-height:0;cursor:zoom-in}
.fd-frame img,.fd-frame video{display:block;width:100%;height:auto}
.fd-frame>a img{border-radius:inherit}
.fd-frame figcaption{margin-top:14px;font-size:14px;line-height:1.45;color:var(--fd-text-2);text-align:center}
.fd-frame figcaption b{font-weight:400}
/* the "por quê?" of every answer */
.fd-lit{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,460px);gap:clamp(28px,5vw,72px);align-items:center;margin-top:clamp(72px,10vw,136px);padding:clamp(28px,5.4vw,72px);border-radius:var(--fd-r-lg);background:var(--fd-surface)}
.fd-lit .fd-h3{font-size:clamp(30px,4vw,52px);letter-spacing:-.04em;line-height:1.05}
.fd-lit p{margin:16px 0 0;color:var(--fd-text-2)}
.fd-lit p b{color:var(--fd-text)}
.fd-lit .fd-eyebrow{margin:0 0 18px}
.fd-chips{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 0;padding:0;list-style:none}
.fd-chips li{padding:7px 14px;border-radius:999px;background:var(--fd-bg);font-size:14.5px;line-height:1.3;color:var(--fd-text)}
.fd-lit figure{margin:0}
.fd-lit figure a{display:block;line-height:0;border-radius:18px;overflow:hidden;box-shadow:var(--fd-shadow);cursor:zoom-in}
.fd-lit figure img{display:block;width:100%;height:auto}
.fd-lit figcaption{margin-top:14px;font-size:14px;line-height:1.45;color:var(--fd-text-2);text-align:center}
.fd-lit figcaption b{font-weight:400}
/* the pill, with the one amber detail: its dot */
.fd-pill,.fd-why>summary{display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:0 16px 0 14px;border:1px solid var(--fd-line-2);border-radius:999px;background:var(--fd-surface);color:var(--fd-text);font:500 15px/1 var(--fd-sans);letter-spacing:-.008em}
.fd-pill::before,.fd-why>summary::before{content:"";flex:none;width:7px;height:7px;border-radius:50%;background:var(--fd-amber)}
.fd-feature{margin-top:clamp(72px,10vw,136px);text-align:center}
.fd-feature>p:not(.fd-eyebrow){max-width:38em;margin:14px auto 0;color:var(--fd-text-2)}
.fd-feature .fd-frame{max-width:1040px;margin:clamp(32px,4.5vw,56px) auto 0}
.fd-photo{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px,5vw,72px);align-items:center;margin-top:clamp(72px,10vw,136px)}
.fd-photo p{margin:14px 0 0;color:var(--fd-text-2)}
.fd-photo p b{color:var(--fd-text)}
.fd-photo .fd-eyebrow{margin:0 0 10px}
.fd-photo .fd-h3 + p{margin-top:18px}
.fd-flow{margin-top:clamp(56px,7vw,96px);text-align:center}
.fd-flow .fd-h4{margin-bottom:20px}
.fd-flow video{aspect-ratio:1696/486;background:#07111c}

/* ---------- inside: layers, steps, delivery ---------- */
.fd-arch{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px,5vw,72px);align-items:start}
.fd-layers{margin:0;position:sticky;top:calc(var(--hdr) + 24px)}
.fd-layer{padding:18px 18px 20px;border-radius:var(--fd-r-lg);background:var(--fd-surface)}
.fd-layer>span{display:block;font:500 14px/1.5 var(--fd-code);letter-spacing:0;color:var(--fd-text)}
.fd-layer>small{display:block;margin:2px 0 14px;font-size:14px;line-height:1.4;color:var(--fd-text-2)}
.fd-layer .fd-layer{background:var(--fd-bg);border-radius:20px}
.fd-layer .fd-layer .fd-layer{background:var(--fd-text);border-radius:14px}
.fd-layer .fd-layer .fd-layer>span{color:#fff}
.fd-layer .fd-layer .fd-layer>small{margin-bottom:0;color:#a1a1a6}
.fd-layers figcaption{margin-top:16px;font-size:14.5px;line-height:1.45;color:var(--fd-text-2)}
.fd-layers figcaption b{color:var(--fd-text)}
.fd-steps{list-style:none;margin:0;padding:0}
.fd-steps>li{display:grid;grid-template-columns:36px minmax(0,1fr);gap:0 14px;padding:24px 0;border-top:1px solid var(--fd-line)}
.fd-steps>li:first-child{border-top:0;padding-top:0}
.fd-steps>li>span{padding-top:3px;font-size:15px;line-height:1.5;color:var(--fd-text-2);font-variant-numeric:tabular-nums}
.fd-steps p{margin:8px 0 0;color:var(--fd-text-2)}
.fd-tools{display:flex;flex-wrap:wrap;gap:6px;margin:16px 0 0;padding:0;list-style:none}
.fd-tools li{padding:5px 11px;border-radius:999px;background:var(--fd-surface);font:500 13px/1.4 var(--fd-code);letter-spacing:0;color:var(--fd-text)}
.fd-tools li.fd-on{background:var(--fd-accent-soft);color:var(--fd-accent)}
.fd-sub{margin-top:clamp(72px,10vw,128px);text-align:center}
.fd-ship{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(16px,2vw,24px);margin-top:clamp(28px,4vw,44px);text-align:left}
.fd-ship article{background:var(--fd-surface);border-radius:var(--fd-r-lg);padding:clamp(24px,3.6vw,44px)}
.fd-ship p{margin:12px 0 0;color:var(--fd-text-2)}
.fd-pipe{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:22px 0 0;font:500 13px/1.3 var(--fd-code);letter-spacing:0}
.fd-pipe span{padding:7px 12px;border-radius:999px;background:var(--fd-bg);color:var(--fd-text)}
.fd-pipe i{font-style:normal;color:var(--fd-text-2)}
.fd-pipe b{margin-left:4px;padding:7px 12px;border-radius:999px;background:var(--fd-accent-soft);color:var(--fd-accent);font:500 13px/1.3 var(--fd-sans)}
.fd-fine{margin-top:18px!important;font-size:14.5px!important;line-height:1.5;color:var(--fd-text-2)}

/* ---------- decisions: each one opens its "por quê?" ---------- */
.fd-dec-bar{display:flex;justify-content:center;margin:-16px 0 20px}
.fd-all{min-height:44px;padding:0 8px;border:0;background:none;font:400 17px/1 var(--fd-sans);letter-spacing:-.011em;color:var(--fd-accent);cursor:pointer}
.fd-all:hover{text-decoration:underline;text-underline-offset:4px}
.fd-d{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,9fr);gap:8px clamp(24px,4vw,56px);margin-top:clamp(16px,2vw,24px);padding:clamp(28px,4.4vw,56px);border-radius:var(--fd-r-lg);background:var(--fd-surface)}
.fd-d-n{margin:0;font:600 clamp(40px,4.6vw,60px)/1 var(--fd-sans);letter-spacing:-.045em;color:#86868b}
.fd-d-n small{display:block;margin-top:10px;font:400 15px/1.3 var(--fd-sans);letter-spacing:-.005em;color:var(--fd-text-2)}
.fd-answer{max-width:60ch;margin:14px 0 0;font-size:clamp(17px,1.5vw,19px);line-height:1.5;color:var(--fd-text)}
.fd-fact{margin:16px 0 0;font-size:14.5px;line-height:1.55;color:var(--fd-text-2)}
.fd-why{margin-top:22px}
.fd-why>summary{list-style:none;cursor:pointer;-webkit-user-select:none;user-select:none;transition:border-color .2s,background .2s}
.fd-why>summary::-webkit-details-marker{display:none}
.fd-why>summary::after{content:"";width:6px;height:6px;margin-left:2px;border-right:1.5px solid var(--fd-text-2);border-bottom:1.5px solid var(--fd-text-2);transform:translateY(-2px) rotate(45deg);transition:transform .2s}
.fd-why>summary:hover{border-color:var(--fd-text)}
.fd-why[open]>summary{background:var(--fd-bg);border-color:transparent}
.fd-why[open]>summary::after{transform:translateY(2px) rotate(-135deg)}
.fd-why>summary:focus-visible{outline:2px solid var(--fd-accent);outline-offset:3px;border-radius:999px}
.fd-trace{margin:16px 0 0;padding:6px 24px;border-radius:18px;background:var(--fd-bg)}
.fd-trace>div{display:grid;grid-template-columns:150px minmax(0,1fr);gap:6px 20px;padding:18px 0;border-top:1px solid var(--fd-line)}
.fd-trace>div:first-child{border-top:0}
.fd-trace dt{font-size:15px;line-height:1.6;color:var(--fd-text-2)}
.fd-trace dd{margin:0;font-size:16.5px;line-height:1.55}
.fd-trace dd p{margin:0 0 10px}
.fd-trace dd p:last-child{margin-bottom:0}
.fd-links{display:flex;flex-wrap:wrap;gap:4px 24px;margin:14px 0 0}
.fd-links a{display:inline-flex;align-items:center;min-height:44px;font-size:17px;color:var(--fd-accent);text-decoration:none}
.fd-links a:hover{text-decoration:underline;text-underline-offset:4px}
@media (prefers-reduced-motion:no-preference){.fd-why[open]>.fd-trace{animation:fd-open .3s ease-out}@keyframes fd-open{from{opacity:0;transform:translateY(-6px)}}}

/* ---------- evidence: a ledger, the number with its source beside it ---------- */
.fd-asof{max-width:820px;margin:-24px auto clamp(32px,4vw,48px);text-align:center;font-size:14.5px;line-height:1.5;color:var(--fd-text-2)}
.fd-ledger{margin:0;padding:clamp(8px,1.6vw,20px) clamp(24px,4.4vw,56px);border-radius:var(--fd-r-lg);background:var(--fd-surface)}
.fd-p{display:grid;grid-template-columns:minmax(0,3.2fr) minmax(0,5.6fr) minmax(0,3.2fr);grid-template-areas:"n t s" "n d s";gap:4px clamp(20px,3.4vw,48px);padding:clamp(24px,3vw,36px) 0;border-top:1px solid var(--fd-line)}
.fd-p:first-child{border-top:0}
.fd-p dt{grid-area:t;font:600 19px/1.3 var(--fd-sans);letter-spacing:-.02em;color:var(--fd-text)}
.fd-p dd{margin:0}
.fd-p .n{grid-area:n;font:600 clamp(36px,4.2vw,56px)/1 var(--fd-sans);white-space:nowrap;letter-spacing:-.045em;color:var(--fd-text);font-variant-numeric:tabular-nums}
.fd-p .n small{display:block;white-space:normal;margin-top:10px;font:400 14px/1.4 var(--fd-sans);letter-spacing:-.005em;color:var(--fd-text-2)}
.fd-p .d{grid-area:d;font-size:16px;line-height:1.5;color:var(--fd-text-2)}
.fd-p .d span{color:var(--fd-text);font-weight:600}
.fd-p .s{grid-area:s;align-self:start;font-size:14.5px;line-height:1.5}
.fd-p .s::before{content:attr(data-label);display:block;margin-bottom:2px;color:var(--fd-text-2)}
.fd-p .s a{display:inline;padding:2px 0;overflow-wrap:break-word}

/* ---------- 11 Nov 2026: review and new name ---------- */
.fd-new{display:inline-block;padding:5px 13px;border-radius:999px;background:var(--fd-accent-soft);color:var(--fd-accent);font:500 14px/1.4 var(--fd-sans);letter-spacing:-.005em}
.fd-tl{list-style:none;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;margin:0 0 clamp(56px,8vw,104px);padding:0}
.fd-tl li{position:relative;padding:24px 18px 0 0;border-top:1px solid var(--fd-line-2)}
.fd-tl li::before{content:"";position:absolute;left:0;top:-5px;width:9px;height:9px;border-radius:50%;background:#c7c7cc}
.fd-tl time{display:block;font-size:14px;line-height:1.4;color:var(--fd-text-2)}
.fd-tl p{margin:6px 0 0;font-size:15.5px;line-height:1.45;color:var(--fd-text-2)}
.fd-tl li.fd-now::before{background:var(--fd-accent);box-shadow:0 0 0 5px var(--fd-accent-soft)}
.fd-tl li.fd-now time{color:var(--fd-accent);font-weight:600}
.fd-tl li.fd-now p{color:var(--fd-text);font-weight:600}
.fd-q{max-width:24em;margin:0 auto clamp(56px,8vw,104px);text-align:center;font:600 clamp(24px,3.3vw,40px)/1.14 var(--fd-sans);letter-spacing:-.035em;color:var(--fd-text)}
.fd-q small{display:block;margin-bottom:14px;font:600 17px/1.3 var(--fd-sans);letter-spacing:-.015em;color:var(--fd-text-2)}
.fd-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(16px,2vw,24px);align-items:stretch}
.fd-two>div{background:var(--fd-surface);border-radius:var(--fd-r-lg);padding:clamp(24px,3.6vw,44px)}
.fd-checks{margin:18px 0 0}
.fd-checks>div{padding:14px 0;border-top:1px solid var(--fd-line)}
.fd-checks dt{font:500 13.5px/1.5 var(--fd-code);letter-spacing:0;color:var(--fd-text-2)}
.fd-checks dd{margin:3px 0 0;font-size:16.5px;line-height:1.5}
.fd-fixes{list-style:none;margin:18px 0 0;padding:0;counter-reset:fx}
.fd-fixes li{counter-increment:fx;position:relative;padding:14px 0 14px 34px;border-top:1px solid var(--fd-line);font-size:16.5px;line-height:1.5;color:var(--fd-text-2)}
.fd-fixes li::before{content:counter(fx);position:absolute;left:0;top:14px;font:600 17px/1.5 var(--fd-sans);color:#6e6e73}
.fd-fixes b{display:block;color:var(--fd-text)}
.fd-sec3{margin-top:clamp(72px,10vw,128px)}
.fd-sec3>.fd-h3{text-align:center}
.fd-sec3>p{max-width:42em;margin:16px auto 0;color:var(--fd-text-2)}
.fd-sec3>p b{color:var(--fd-text)}
.fd-tablebox{margin-top:clamp(28px,4vw,44px);padding:clamp(20px,3.2vw,40px) clamp(24px,4.4vw,56px);border-radius:var(--fd-r-lg);background:var(--fd-surface)}
.fd-table{width:100%;border-collapse:collapse;font-size:16px;line-height:1.5}
.fd-table caption{caption-side:top;padding-bottom:14px;text-align:left;font:600 19px/1.3 var(--fd-sans);letter-spacing:-.02em;color:var(--fd-text)}
.fd-table th{padding:10px 16px 10px 0;border-bottom:1px solid var(--fd-line-2);text-align:left;font-size:14px;font-weight:400;color:var(--fd-text-2)}
.fd-table td{padding:16px 24px 16px 0;border-bottom:1px solid var(--fd-line);vertical-align:top;color:var(--fd-text-2)}
.fd-table tr:last-child td{border-bottom:0}
.fd-table td:last-child,.fd-table th:last-child{padding-right:0}
.fd-table td:first-child{width:104px;white-space:nowrap}
.fd-table td:nth-child(2){width:44%;color:var(--fd-text)}
.fd-sev{display:inline-block;padding:3px 12px;border-radius:999px;background:var(--fd-bg);font-size:13.5px;font-weight:500;line-height:1.5;color:var(--fd-text-2)}
.fd-sev.fd-hi{background:var(--fd-text);color:#fff}
.fd-sev.fd-md{background:transparent;box-shadow:inset 0 0 0 1px var(--fd-text);color:var(--fd-text)}
.fd-limits{margin-top:clamp(16px,2vw,24px);padding:clamp(24px,3.6vw,44px);border-radius:var(--fd-r-lg);background:var(--fd-surface)}
.fd-limits ul{margin:12px 0 0;padding-left:20px;color:var(--fd-text-2)}
.fd-limits li{margin-top:8px;padding-left:4px}

/* ---------- video ---------- */
.fd-callout{max-width:42em;margin:0 auto clamp(28px,4vw,44px);text-align:center;font-size:16px;line-height:1.5;color:var(--fd-text-2)}
.fd-callout b{color:var(--fd-text)}
.fd-video{margin:0}
.fd-video video{display:block;width:100%;height:auto;aspect-ratio:16/9;border-radius:var(--fd-r);background:#000;box-shadow:var(--fd-shadow)}
.fd-video figcaption{max-width:52em;margin:16px auto 0;text-align:center;font-size:14px;line-height:1.5;color:var(--fd-text-2)}
.fd-chaps{list-style:none;columns:2;column-gap:clamp(24px,4vw,56px);margin:clamp(28px,4vw,44px) 0 0;padding:clamp(14px,2vw,24px) clamp(24px,4.4vw,56px);border-radius:var(--fd-r-lg);background:var(--fd-surface)}
.fd-chaps li{break-inside:avoid}
.fd-chaps button{display:grid;grid-template-columns:44px minmax(0,1fr);gap:12px;width:100%;min-height:44px;padding:10px 0;border:0;background:none;color:var(--fd-text);font:400 16px/1.4 var(--fd-sans);letter-spacing:-.011em;text-align:left;cursor:pointer}
.fd-chaps button:hover{color:var(--fd-accent)}
.fd-chaps time{color:var(--fd-accent);font-variant-numeric:tabular-nums}

/* ---------- still open ---------- */
.fd-open{list-style:none;margin:0;padding:clamp(8px,1.6vw,20px) clamp(24px,4.4vw,56px);border-radius:var(--fd-r-lg);background:var(--fd-surface)}
.fd-open li{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:8px clamp(24px,4vw,56px);padding:24px 0;border-top:1px solid var(--fd-line)}
.fd-open li:first-child{border-top:0}
.fd-open b{font:600 19px/1.3 var(--fd-sans);letter-spacing:-.02em;color:var(--fd-text)}
.fd-open p{margin:0;color:var(--fd-text-2)}

/* ---------- closing ---------- */
.fd-end{margin-top:clamp(96px,13vw,176px);padding:clamp(72px,10vw,128px) 0;background:var(--fd-surface);text-align:center}
.fd-end-t{max-width:16em;margin:0 auto;font:600 clamp(34px,5.4vw,64px)/1.05 var(--fd-sans);letter-spacing:-.04em}
.fd-end-t em{font-style:normal}

/* ---------- a light fade as blocks come into view (farol.js adds .fd-motion; never with reduced motion) ---------- */
@media (prefers-reduced-motion:no-preference){
  .fd-motion .fd-rv{transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1)}
  .fd-motion .fd-rv:not(.is-in){opacity:0;transform:translateY(18px)}
}

/* ---------- small screens ---------- */
@media (max-width:1000px){
  .fd-ask,.fd-arch,.fd-photo{grid-template-columns:minmax(0,1fr)}
  .fd-layers{position:static;max-width:560px;margin:0 auto}
  .fd-row{grid-template-columns:minmax(0,1fr)}
  .fd-row>.fd-frame,.fd-row>.fd-copy{grid-column:auto}
  .fd-row.fd-rev>.fd-frame{order:0}
  .fd-lit{grid-template-columns:minmax(0,1fr)}
  .fd-lit figure{width:100%;max-width:460px;margin:0 auto}
  .fd-photo>.fd-frame{width:100%;max-width:560px;margin:0 auto}
  .fd-sheet{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fd-p{grid-template-columns:minmax(0,4fr) minmax(0,8fr);grid-template-areas:"n t" "n d" "n s"}
  .fd-p .s{margin-top:10px}
  .fd-tl{grid-template-columns:minmax(0,1fr);max-width:520px;margin-left:auto;margin-right:auto}
  .fd-tl li{padding:0 0 22px 26px;border-top:0;border-left:1px solid var(--fd-line-2)}
  .fd-tl li:last-child{padding-bottom:0}
  .fd-tl li::before{left:-5px;top:5px}
}
@media (max-width:760px){
  .fd body{font-size:17px}
  .fd-ribbon p{font-size:13.5px}
  .fd-keys{grid-template-columns:repeat(2,minmax(0,1fr));gap:36px 0}
  .fd-keys div:nth-child(odd){border-left:0}
  .fd-qa{grid-template-columns:minmax(0,1fr);text-align:center}
  .fd-sheet,.fd-ship,.fd-two{grid-template-columns:minmax(0,1fr)}
  .fd-chaps{columns:1}
  .fd-trace>div{grid-template-columns:minmax(0,1fr);gap:4px}
  .fd-trace{padding:4px 18px}
  .fd-d{grid-template-columns:minmax(0,1fr)}
  .fd-d-n{display:flex;align-items:baseline;gap:12px;font-size:34px}
  .fd-d-n small{margin:0}
  .fd-p{grid-template-columns:minmax(0,1fr);grid-template-areas:"n" "t" "d" "s"}
  .fd-p dt{margin-top:10px}
  .fd-open li{grid-template-columns:minmax(0,1fr)}
  .fd-steps>li{grid-template-columns:28px minmax(0,1fr);gap:0 10px}
  /* the findings table becomes one block per finding */
  .fd-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
  .fd-table,.fd-table caption,.fd-table tbody,.fd-table tr,.fd-table td{display:block;width:auto!important}
  .fd-table tr{padding:18px 0;border-top:1px solid var(--fd-line)}
  .fd-table td{padding:0;border:0}
  .fd-table td + td{margin-top:10px}
  .fd-table td[data-label]::before{content:attr(data-label);display:block;margin-bottom:2px;font-size:14px;color:var(--fd-text-2)}
}
@media (max-width:420px){.fd-cta .fd-btn{flex:1 1 100%;justify-content:center}}
@media (pointer:coarse){.fd-why>summary{min-height:44px;padding:0 20px 0 16px}}

@media print{
  .fd .hdr,.fd-video,.fd-chaps,.fd-all{display:none!important}
  .fd-ribbon{margin-top:0}
}