/* Brand stories use the existing Basara palette and local typography. */
.brand-hero{padding:25px 0 0}
.brand-hero .breadcrumb{margin-bottom:30px}
.brand-hero-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(40px,7vw,100px);align-items:center;padding-bottom:46px}
.brand-hero h1{font-size:clamp(43px,5vw,70px);line-height:1.1;margin-bottom:23px}
.brand-hero h1>span,.brand-section-heading h2>span,.brand-shop h2>span{font-family:Georgia,serif;font-style:italic;font-weight:400;color:var(--gold)}
.brand-intro{font-size:17px;line-height:1.85;max-width:570px;color:var(--ink-soft);margin-bottom:26px}
.brand-hero .actions{gap:18px 26px}
.brand-hero .button,.brand-shop .button{font-size:15px}
.brand-signature{min-height:350px;padding:32px 38px;background:#e8eeea;border:1px solid #cbd8cf;border-radius:8px;display:flex;flex-direction:column;align-items:center;text-align:center;position:relative;overflow:hidden}
.brand-signature:before,.brand-signature:after{content:'';position:absolute;width:280px;height:280px;border:1px solid #173d420d;border-radius:50%;pointer-events:none}
.brand-signature:before{top:-170px;left:-100px}.brand-signature:after{bottom:-200px;right:-80px}
.brand-signature-year{font-size:13px;letter-spacing:.08em;color:var(--ink-soft)}
.brand-signature>img{width:70%;max-width:290px;height:100px;object-fit:contain;margin:30px 0 24px}
.brand-signature>p{font-size:18px;line-height:1.6;margin-bottom:25px}
.brand-signature>a{display:inline-flex;align-items:center;gap:12px;font-size:14px;line-height:1.5;border-top:1px solid #173d4226;padding-top:18px;margin-top:auto}
.brand-signature>a svg{width:17px;height:17px}
.brand-jump{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.brand-jump>a{display:flex;align-items:center;gap:13px;padding:22px 18px;font-size:15px;font-weight:650;line-height:1.5;transition:background .2s}
.brand-jump>a+a{border-left:1px solid var(--line)}
.brand-jump>a>svg:first-child{color:var(--gold);width:23px;height:23px}
.brand-jump>a>svg:last-child{margin-left:auto;width:17px;height:17px}
.brand-jump>a:hover{background:var(--sage)}
.brand-section-heading{display:grid;grid-template-columns:1.2fr 1fr;gap:50px;align-items:end;margin-bottom:42px}
.brand-section-heading h2{margin:0;max-width:650px}
.brand-section-heading>p{margin:0;max-width:430px;font-size:17px;color:var(--ink-soft);line-height:1.8}
.brand-option-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.brand-option{min-width:0;border:1px solid var(--line);border-radius:8px;background:white;overflow:hidden;display:flex;flex-direction:column;scroll-margin-top:125px}
.brand-option>figure{margin:0}
.brand-option-photo{position:relative;isolation:isolate;aspect-ratio:1.24;overflow:hidden;background:var(--sage)}
.brand-option-photo>picture{position:relative;display:block;width:100%;height:100%}
.brand-option-photo>picture>img{width:100%;height:100%;object-fit:contain}
.brand-photo-backdrop{position:absolute;inset:-12%;pointer-events:none;filter:blur(18px) brightness(.7)}
.brand-photo-backdrop picture,.brand-photo-backdrop img{width:100%;height:100%;object-fit:cover}
.brand-option figcaption{font-size:13px;line-height:1.6;padding:12px 20px;color:var(--ink-soft);border-bottom:1px solid var(--line);min-height:66px}
.brand-option-copy{padding:25px 24px 30px;display:flex;flex-direction:column;flex:1}
.brand-option-label{display:flex;align-items:center;gap:10px;font-size:13px;line-height:1.6;color:var(--gold);margin:0 0 17px}
.brand-option-label>span{font-weight:750}.brand-option-label>svg{width:22px;height:22px;margin-left:auto}
.brand-option h3{font-size:28px;line-height:1.2;margin-bottom:20px;min-height:68px;text-wrap:balance}
.brand-option-copy>p:not(.brand-option-label){font-size:16px;line-height:1.8;color:var(--ink-soft);margin-bottom:18px}
.brand-option-copy>.text-link{margin-top:auto;align-self:flex-start;font-size:15px;line-height:1.5}
.brand-combination-note{display:flex;align-items:start;gap:16px;padding:24px 28px;background:var(--sage);border-radius:8px;margin-top:26px}
.brand-combination-note>svg{color:var(--gold);margin-top:4px}
.brand-combination-note p{font-size:15px;line-height:1.8;margin:0;color:var(--ink-soft)}
.brand-combination-note strong{color:var(--ink)}
.brand-shop{background:#e8eeea}
.brand-shop-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(35px,6vw,80px);align-items:center}
.brand-shop-photo{margin:0;min-width:0}
.brand-shop-photo picture,.brand-shop-photo img{display:block;width:100%;height:auto;border-radius:8px}
.brand-shop-photo figcaption{font-size:13px;line-height:1.7;color:var(--ink-soft);margin-top:13px}
.brand-shop-copy>p:not(.eyebrow){font-size:17px;line-height:1.85;color:var(--ink-soft)}
.brand-shop .actions{gap:20px 25px;margin-top:26px}
.brand-shop .text-link{font-size:15px}
.brand-shop-address{display:flex;align-items:start;gap:12px;margin-top:25px;margin-bottom:0}
.brand-shop-copy>p.brand-shop-address{font-size:14px;line-height:1.8}
.brand-shop-address>svg{width:19px;height:19px;margin-top:4px}
.brand-history{background:white}
.brand-timeline{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));list-style:none;padding:0;margin:0 0 50px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.brand-timeline>li{padding:24px 30px 26px 0}
.brand-timeline>li+li{border-left:1px solid var(--line);padding-left:30px}
.brand-timeline strong{display:block;font-size:38px;font-weight:450;letter-spacing:-.05em;line-height:1.2;color:var(--gold);margin-bottom:10px}
.brand-timeline span{display:block;font-size:15px;line-height:1.7;max-width:270px;color:var(--ink-soft)}
.brand-history-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:36px}
.brand-story-number{display:block;font-size:14px;color:var(--gold);margin-bottom:20px}
.brand-story h3{font-size:28px;line-height:1.25;min-height:70px;margin-bottom:22px;text-wrap:balance}
.brand-story p{font-size:16px;line-height:1.85;color:var(--ink-soft);margin:0}
.brand-sources{font-size:14px;line-height:1.9;color:var(--ink-soft);border-top:1px solid var(--line);padding-top:25px;margin:40px 0 0}
.brand-sources a{text-decoration:underline;text-underline-offset:4px}
.brand-questions{background:var(--paper)}
.brand-questions .questions-intro>.text-link{font-size:15px}
.eyewear-purposes{background:var(--sage)}
.eyewear-purpose-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.eyewear-purpose{padding:28px;background:var(--paper);border:1px solid #d1ddd5;border-radius:8px}
.eyewear-purpose>.eyebrow{font-size:13px;letter-spacing:.1em}
.eyewear-purpose h3{font-size:27px;line-height:1.2}
.eyewear-purpose p{font-size:16px;line-height:1.8;color:var(--ink-soft)}
.eyewear-purpose .text-link{font-size:15px}
@media(min-width:721px) and (max-height:800px){
 .brand-hero{padding-top:18px}.brand-hero .breadcrumb{margin-bottom:20px}.brand-hero-grid{padding-bottom:30px}
 .brand-hero .eyebrow{margin-bottom:17px}.brand-hero h1{font-size:clamp(40px,4vw,56px);margin-bottom:20px}
 .brand-intro{font-size:16px;line-height:1.7;margin-bottom:22px}.brand-signature{min-height:285px;padding-block:25px}
 .brand-signature>img{height:72px;margin-block:20px}.brand-signature>p{font-size:17px;margin-bottom:18px}
}
@media(max-width:1100px){.brand-option-grid{gap:18px}.brand-option-copy{padding:22px 20px 25px}.brand-option h3{font-size:25px}.brand-section-heading .eyebrow{letter-spacing:.09em}.brand-story h3{font-size:25px}.brand-jump>a{padding-inline:12px;gap:10px}.brand-jump>a>svg:last-child{display:none}}
@media(max-width:1000px) and (min-width:721px){.brand-hero-grid{gap:35px}.brand-signature{padding:25px;min-height:320px}.brand-signature>img{margin-block:25px;height:80px}.brand-option-grid{grid-template-columns:1fr}.brand-option{display:grid;grid-template-columns:.8fr 1fr}.brand-option>figure{display:flex;flex-direction:column}.brand-option-photo{flex:1;aspect-ratio:auto;min-height:230px}.brand-option h3{min-height:0}.brand-option-copy{padding:26px}.brand-history-grid{gap:25px}.brand-story h3{min-height:95px}.brand-jump>a{font-size:14px}.brand-shop-grid{gap:32px}.brand-shop h2{font-size:38px}.eyewear-purpose{padding:24px 20px}}
@media(max-width:720px){
 .brand-hero{padding-top:20px}.brand-hero .breadcrumb{margin-bottom:24px;font-size:13px;gap:9px}
 .brand-hero-grid{grid-template-columns:minmax(0,1fr) 130px;gap:20px 16px;padding-bottom:28px;align-items:center}
 .brand-hero-copy{display:contents}.brand-hero .eyebrow{grid-column:1/-1;font-size:13px;letter-spacing:.1em;margin:0}
 .brand-hero h1{grid-column:1;grid-row:2;font-size:clamp(32px,8vw,46px);line-height:1.12;margin:0;letter-spacing:-.05em}
 .brand-hero h1>span{display:block;font-size:.83em;margin-top:7px}
 .brand-intro{grid-column:1/-1;font-size:16px;line-height:1.75;margin:0;max-width:none}
 .brand-hero .actions{grid-column:1/-1;gap:15px;justify-content:space-between}
 .brand-hero .button{font-size:14px;padding:13px 16px;min-height:50px;gap:12px}.brand-hero .actions .text-link{font-size:14px;gap:9px}
 .brand-signature{grid-column:2;grid-row:2;min-height:130px;padding:17px 13px;gap:15px;border-radius:8px}
 .brand-signature-year{font-size:13px;letter-spacing:0;line-height:1.45}.brand-signature>img{width:100%;height:40px;margin:0}
 .brand-signature>p,.brand-signature>a{display:none}
 .brand-jump{grid-template-columns:repeat(2,minmax(0,1fr))}.brand-jump>a{font-size:14px;padding:15px 10px;gap:11px;min-height:58px}
 .brand-jump>a:nth-child(3){border-left:0;border-top:1px solid var(--line)}.brand-jump>a:nth-child(4){border-top:1px solid var(--line)}
 .brand-jump>a>svg:first-child{width:20px;height:20px}
 .brand-landing .section{padding-block:52px}
 .brand-section-heading{display:block;margin-bottom:29px}.brand-section-heading h2{font-size:36px;margin-bottom:22px}.brand-section-heading .eyebrow{font-size:13px;letter-spacing:.06em;line-height:1.6;margin-bottom:19px}.brand-section-heading>p{font-size:16px;line-height:1.75;max-width:none}
 .brand-option-grid{grid-template-columns:minmax(0,1fr);gap:25px}.brand-option-photo{aspect-ratio:1.35}.brand-option figcaption{min-height:0;padding:11px 20px;font-size:13px}
 .brand-option-copy{padding:24px 22px 29px}.brand-option h3{font-size:29px;min-height:0;margin-bottom:18px}.brand-option-label{margin-bottom:15px}.brand-option-copy>p:not(.brand-option-label){font-size:16px;line-height:1.8}
 .brand-combination-note{padding:21px 18px;gap:12px;margin-top:24px}.brand-combination-note p{font-size:15px;line-height:1.75}
 .brand-shop-grid{grid-template-columns:minmax(0,1fr);gap:28px}.brand-shop h2{font-size:36px}.brand-shop .eyebrow{font-size:13px;letter-spacing:.09em;margin-bottom:20px}
 .brand-shop-photo figcaption{font-size:13px;line-height:1.6}.brand-shop-copy>p:not(.eyebrow){font-size:16px;line-height:1.8}.brand-shop .actions{gap:15px 20px}.brand-shop .button{font-size:14px;padding-inline:17px}.brand-shop .text-link{font-size:14px;gap:10px}
 .brand-timeline{margin-bottom:35px}.brand-timeline>li{padding:20px 12px 20px 0}.brand-timeline>li+li{padding-left:12px}.brand-timeline strong{font-size:30px}.brand-timeline span{font-size:13px;line-height:1.75}
 .brand-history-grid{grid-template-columns:minmax(0,1fr);gap:30px}.brand-story{border-top:1px solid var(--line);padding-top:25px}.brand-story-number{margin-bottom:13px}.brand-story h3{font-size:29px;min-height:0;margin-bottom:18px}.brand-story p{font-size:16px;line-height:1.85}
 .brand-sources{margin-top:30px;font-size:14px}.brand-sources>a{display:block}.brand-sources>span{display:none}
 .brand-questions h2{font-size:36px}
 .eyewear-purpose-grid{grid-template-columns:minmax(0,1fr);gap:18px}.eyewear-purpose{padding:25px}.eyewear-purpose h3{font-size:27px}
}
@media(max-width:380px){.brand-hero-grid{grid-template-columns:minmax(0,1fr) 103px;gap:18px 12px}.brand-signature{padding:14px 10px;min-height:119px;gap:12px}.brand-signature-year{font-size:13px}.brand-hero h1{font-size:31px}.brand-hero .actions{gap:12px;flex-wrap:wrap}.brand-hero .actions .text-link{font-size:14px}.brand-jump>a{gap:8px;font-size:13px;padding-inline:8px}.brand-section-heading h2,.brand-shop h2,.brand-questions h2{font-size:33px}.brand-option-copy{padding-inline:20px}.brand-option h3{font-size:27px}.brand-timeline strong{font-size:27px}.brand-timeline>li+li{padding-left:10px}.brand-timeline>li{padding-right:10px}}

/* Each historical story has its own credited documentary photograph. */
.brand-history-grid{grid-template-columns:minmax(0,1fr);gap:64px}
.brand-history-grid .brand-story{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,70px);align-items:center;padding-top:45px;border-top:1px solid var(--line)}
.brand-history-grid .brand-story:first-child{border-top:0;padding-top:0}
.brand-history-grid .brand-story:nth-child(even)>.brand-story-figure{order:2}
.brand-story-figure{margin:0;min-width:0}
.brand-story-photo{aspect-ratio:1.3;border:1px solid var(--line);border-radius:8px;background:var(--paper);overflow:hidden}
.brand-story-photo picture,.brand-story-photo img{display:block;width:100%;height:100%;object-fit:contain}
.brand-story-figure figcaption{padding-top:14px;color:var(--ink-soft);line-height:1.7}
.brand-story-figure figcaption>span{display:block;font-size:14px;line-height:1.7;margin-bottom:7px}
.brand-story-figure small{display:block;font-size:13px;line-height:1.7}
.brand-story-figure a{text-decoration:underline;text-underline-offset:3px}
.brand-story-copy h3{min-height:0;font-size:34px;line-height:1.22;margin-bottom:24px}
.brand-story-copy p{font-size:17px;line-height:1.9}
.brand-story-copy .brand-story-fact{font-size:16px;line-height:1.7;margin-top:24px;border-left:2px solid var(--gold);padding:13px 18px;background:var(--paper);color:var(--ink)}
@media(max-width:1000px){.brand-history-grid .brand-story{gap:30px}.brand-story-copy h3{font-size:29px}.brand-story-copy p{font-size:16px}}
@media(max-width:720px){.brand-history-grid{gap:35px}.brand-history-grid .brand-story{grid-template-columns:minmax(0,1fr);gap:24px;padding-top:30px}.brand-history-grid .brand-story:nth-child(even)>.brand-story-figure{order:0}.brand-story-photo{aspect-ratio:1.18}.brand-story-copy h3{font-size:29px;margin-bottom:18px}.brand-story-copy p{font-size:16px;line-height:1.85}.brand-story-copy .brand-story-fact{font-size:15px;margin-top:20px}.brand-story-figure figcaption>span{font-size:14px}}
