/* ShopLens type layer — patch 7 (15 Oct 2026). Loaded last on the home page.
   One typeface (Source Sans 3, served as the "Lens" family), no serif italics, and every
   size and gap on one golden-ratio scale:

     sizes   11 · 13 · 17 · 22 · 28 · 35 · 44 · 56 · 72 · 116   (× 1.272 = √φ per step, × 1.618 = φ every two)
     gaps     8 · 13 · 21 · 34 · 55 · 89 · 144                   (Fibonacci, ratio → φ)

   This file only overrides the rules in the six stylesheets before it; it never restyles
   the demo's simulated extension UI (dots, cards, player), which keeps its own em scale. */
:root{
  --t-xs:.6875rem;--t-s:.8125rem;--t-1:1.0625rem;--t-2:1.375rem;--t-3:1.75rem;--t-4:2.1875rem;--t-5:2.75rem;--t-6:3.5rem;--t-7:4.5rem;--t-8:7.25rem;
  --s-1:8px;--s-2:13px;--s-3:21px;--s-4:34px;--s-5:55px;--s-6:89px;--s-7:144px;
  --lh-display:1;--lh-head:1.1;--lh-body:1.6;
  --trk-display:-.03em;--trk-head:-.02em;--trk-kicker:.12em;
}
body{font-size:var(--t-1);line-height:var(--lh-body)}

/* one family, two weights of contrast instead of a second typeface */
.story-heading h2 em,.lab-content h2 em,.principles-intro h2 em,.browser-heading h2 em,.questions-layout h2 em,
.room-demo-heading em,.demo-heading h2 em,.approach-heading h2 em,.try-layout h2 em,.extensions-copy h2 em,
h1>span:not(.title-period){font-family:inherit;font-style:normal;font-weight:400;letter-spacing:inherit}

/* header */
.docked-brand{font-size:var(--t-2);font-weight:600;letter-spacing:var(--trk-head)}
.docked-nav{font-size:var(--t-1)}
.header-browsers a{font-size:var(--t-s);font-weight:600}

/* opening */
.flying-name{font-size:var(--t-8);font-weight:600;letter-spacing:var(--trk-display);line-height:var(--lh-display)}
.flying-tagline{font-size:var(--t-2);font-weight:400;letter-spacing:0;line-height:1.4}
.opening-value{font-size:var(--t-2);font-weight:600;letter-spacing:var(--trk-head)}
.opening-caption{font-size:var(--t-1)}
.opening-sub{font-size:var(--t-1);letter-spacing:0;margin-top:var(--s-1)}
.opening-browsers a>span{font-size:var(--t-1);font-weight:600}
.opening-browsers small{font-size:var(--t-s)}
.opening-bottom,.quiet-button{font-size:var(--t-s)}

/* demo (pinned) */
.room-demo-heading{margin-bottom:var(--s-3)}
.room-demo-heading .eyebrow{font-size:var(--t-xs);font-weight:600;letter-spacing:var(--trk-kicker);margin-bottom:var(--s-1)}
.room-demo-heading h2{font-size:var(--t-5);font-weight:600;line-height:var(--lh-head);letter-spacing:var(--trk-head)}
.furniture-demo.real-interior-demo{width:min(1060px,calc((100svh - 250px) * 1.77778))}

/* three steps */
.story-kicker{font-size:var(--t-xs);font-weight:600;letter-spacing:var(--trk-kicker);line-height:1.5;margin-bottom:var(--s-3)}
.story-heading{margin-bottom:var(--s-5)}
.story-heading h2{font-size:clamp(var(--t-6),6vw,var(--t-7));font-weight:600;line-height:var(--lh-display);letter-spacing:var(--trk-display);margin-bottom:var(--s-3)}
.story-heading>p:last-child{font-size:var(--t-2);line-height:1.4}
.discovery-story{padding-block:var(--s-6)}
.discovery-grid{gap:var(--s-4)}
.step-copy>span{font-size:var(--t-s);font-weight:600;padding-top:9px}
.step-copy h3{font-size:var(--t-3);font-weight:600;letter-spacing:var(--trk-head);line-height:var(--lh-head);margin-bottom:var(--s-1)}
.step-copy p{font-size:var(--t-1);line-height:var(--lh-body)}
.story-text-link{font-size:var(--t-1);margin-top:var(--s-5)}

/* what to expect */
.lens-principles{padding-block:var(--s-6)}
.principles-intro h2{font-size:var(--t-5);font-weight:600;line-height:var(--lh-head);letter-spacing:var(--trk-head)}
.principle-symbol{font-size:var(--t-2)}
.principle-columns h3{font-size:var(--t-2);font-weight:600;letter-spacing:var(--trk-head);margin-bottom:var(--s-2)}
.principle-list li{font-size:var(--t-1);line-height:var(--lh-body);margin-top:var(--s-1)}
.principle-benefits{padding-top:var(--s-5);gap:var(--s-4)}
.principle-benefits-title{font-size:var(--t-3);font-weight:600;letter-spacing:var(--trk-head)}
.principle-benefits h4{font-size:var(--t-2);font-weight:600;letter-spacing:var(--trk-head);line-height:1.3;margin-bottom:var(--s-1)}
.principle-benefits p{font-size:var(--t-1);line-height:var(--lh-body)}

/* the extension */
.browser-destination{padding-block:var(--s-6)}
.browser-heading{margin-bottom:var(--s-5)}
.browser-heading h2{font-size:clamp(var(--t-4),4vw,var(--t-5));font-weight:600;line-height:var(--lh-head);letter-spacing:var(--trk-head);margin-bottom:var(--s-3)}
.browser-heading>p:last-child{font-size:var(--t-2);line-height:1.4}
.browser-choice-label{font-size:var(--t-xs);font-weight:600;letter-spacing:var(--trk-kicker)}
.browser-choice-body h3{font-size:var(--t-3);font-weight:600;letter-spacing:var(--trk-head)}
.browser-choice-body>p{font-size:var(--t-1);line-height:var(--lh-body);margin:var(--s-2) 0 var(--s-3)}
.notify-label{font-size:var(--t-1)}
.notify input{font-size:var(--t-1)}
.browser-release{font-size:var(--t-1);font-weight:600}
.notify-note{font-size:var(--t-s)}
.browser-bottom-note{font-size:var(--t-s);margin-top:var(--s-4)}

/* questions */
.questions-layout{padding-block:var(--s-6) var(--s-4);gap:var(--s-6)}
.questions-layout h2{font-size:var(--t-5);font-weight:600;line-height:var(--lh-head);letter-spacing:var(--trk-head)}
.questions-layout .faq-list summary{font-size:var(--t-1);font-weight:600;padding:var(--s-3) 0;line-height:1.4}
.faq-list summary>span{font-size:var(--t-3);font-weight:400}
.questions-layout .faq-list p{font-size:var(--t-1);line-height:var(--lh-body);margin-top:var(--s-2)}

/* footer */
.footer{padding-block:var(--s-4)}
.footer .brand{font-size:var(--t-2);font-weight:600;letter-spacing:var(--trk-head)}
.footer>p{font-size:var(--t-s)}
.footer>div{font-size:var(--t-s)}
.browser-attribution{font-size:var(--t-s);line-height:1.5;margin-bottom:var(--s-4)}

@media(max-width:1100px){
  .flying-name{font-size:var(--t-7)}
  .room-demo-heading h2{font-size:var(--t-4)}
}
@media(max-width:800px){
  .flying-name{font-size:var(--t-6)}
  .room-demo-heading h2{font-size:var(--t-4)}
  .story-heading h2{font-size:var(--t-6)}
}
@media(min-width:641px) and (max-width:800px){
  .furniture-demo.real-interior-demo{width:min(1060px,calc((100svh - 230px) * 1.77778))}
}
@media(max-width:640px){
  .furniture-demo.real-interior-demo{width:100%;max-width:500px}
}
@media(max-width:760px){
  .discovery-story,.lens-principles,.browser-destination{padding-block:var(--s-5)}
  .questions-layout{padding-top:var(--s-5);gap:var(--s-4)}
  .story-heading,.browser-heading{margin-bottom:var(--s-4)}
  .story-heading h2{font-size:var(--t-6)}
  .principles-intro h2,.browser-heading h2,.questions-layout h2{font-size:var(--t-4)}
  .principle-benefits{padding-top:var(--s-4);gap:var(--s-3)}
  .step-copy h3{font-size:var(--t-2)}
}
@media(max-width:640px){
  .room-demo-heading h2{font-size:var(--t-3)}
  .room-demo-heading .eyebrow{font-size:var(--t-xs)}
}
@media(max-width:560px){
  .flying-name{font-size:15vw;letter-spacing:var(--trk-display)}
  .opening-value{font-size:var(--t-2)}
  .opening-sub{font-size:var(--t-1)}
}
@media(max-width:520px){
  .story-kicker{font-size:var(--t-xs);letter-spacing:var(--trk-kicker);margin-bottom:var(--s-2)}
  .story-heading h2{font-size:var(--t-5);letter-spacing:var(--trk-display)}
  .step-copy h3{font-size:var(--t-2)}
  .step-copy p,.principle-list li,.principle-benefits p,.questions-layout .faq-list p{font-size:var(--t-1)}
  .principles-intro h2,.browser-heading h2,.questions-layout h2{font-size:var(--t-4)}
  .principle-columns h3{font-size:var(--t-2)}
  .browser-heading>p:last-child{font-size:var(--t-1)}
  .browser-choice-body h3{font-size:var(--t-3)}
  .browser-choice-body>p{font-size:var(--t-1)}
  .browser-release{font-size:var(--t-1)}
  .questions-layout .faq-list summary{font-size:var(--t-1)}
  .footer .brand{font-size:var(--t-2)}
  .browser-attribution{font-size:var(--t-s)}
}