@font-face{font-family:Inter;src:url('assets/InterVariable.woff2') format('woff2');font-style:normal;font-weight:100 900;font-display:swap}
@font-face{font-family:'Source Serif 4';src:url('assets/SourceSerif4-SemiBold.ttf') format('truetype');font-style:normal;font-weight:600;font-display:swap}
:root{--charcoal:#0b0c0d;--ivory:#f1eadf;--gold:#c8ad72;--muted:rgba(241,234,223,.76);--line:rgba(200,173,114,.25);--serif:'Source Serif 4',Georgia,serif;--sans:Inter,Arial,sans-serif;color-scheme:dark}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:2rem}
body{margin:0;background:var(--charcoal);color:var(--ivory);font-family:var(--sans);font-size:1rem;font-weight:400;line-height:1.65;-webkit-font-smoothing:antialiased}
::selection{background:var(--gold);color:var(--charcoal)}
a{color:inherit;text-underline-offset:.3em}
a:focus-visible{outline:2px solid var(--gold);outline-offset:6px}
img{display:block;max-width:100%}
h1,h2,h3,p{margin:0}
h1,h2,h3{font-family:var(--serif);font-weight:600}
.section-shell{padding-inline:clamp(1.5rem,6vw,7.5rem);max-width:1600px;margin-inline:auto}
.eyebrow{font-size:.875rem;font-weight:500;line-height:1.5;letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}
.eyebrow.release-label{text-transform:none;letter-spacing:.04em}
.skip-link{position:fixed;top:1rem;left:1rem;padding:.7rem 1rem;background:var(--ivory);color:var(--charcoal);z-index:10;transform:translateY(-200%)}
.skip-link:focus{transform:translateY(0)}
.site-header{position:relative;z-index:2;min-height:112px;padding:1.4rem clamp(1.5rem,4vw,5rem);display:flex;gap:2rem;align-items:center;border-bottom:1px solid var(--line)}
.brand{display:block;flex:none;width:154px;line-height:0}
.brand img{width:100%;height:auto}
.site-header nav{display:flex;gap:2.3rem;margin-left:auto;font-size:.875rem;font-weight:500}
.site-header nav a{text-decoration:none;transition:color .18s ease}
.site-header nav a:hover{color:var(--gold)}
.release-note{margin-left:1rem;padding:.55rem .9rem;border:1px solid var(--line);color:var(--muted);font-size:.8125rem;font-weight:500;line-height:1.35}
.hero{position:relative;isolation:isolate;min-height:780px;min-height:min(900px,calc(100svh - 112px));display:flex;align-items:center;max-width:1800px;margin-inline:auto;padding:5.5rem clamp(1.5rem,6vw,7.5rem) 8.5rem;overflow:hidden}
.hero-image{position:absolute;inset:0 0 0 38%;z-index:-2}
.hero-image img{width:100%;height:100%;object-fit:cover;object-position:50% 67%}
.hero:before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#0b0c0d 8%,rgba(11,12,13,.94) 26%,rgba(11,12,13,.38) 56%,rgba(11,12,13,0) 80%),linear-gradient(0deg,#0b0c0d,transparent 22%)}
.hero-content{max-width:650px}
.hero h1{font-size:clamp(3.5rem,6.4vw,6.6rem);line-height:1.08;letter-spacing:-.045em;margin-top:1.45rem}
.hero h1 .hero-accent{color:var(--gold)}
.hero-description{margin-top:1.8rem;font-size:1.0625rem;color:var(--muted);line-height:1.7}
.button{display:inline-flex;align-items:center;justify-content:space-between;gap:2rem;min-height:54px;padding:.85rem 1.4rem;text-decoration:none;font-size:.9375rem;font-weight:500;line-height:1.4;transition:background-color .2s,color .2s;max-width:100%}
.button span{font-size:1.3rem;line-height:1}
.button-gold{margin-top:2rem;background:var(--gold);color:var(--charcoal);border:1px solid var(--gold)}
.button-gold:hover{background:var(--ivory);border-color:var(--ivory)}
.hero-foot{position:absolute;bottom:2.4rem;left:clamp(1.5rem,6vw,7.5rem);right:clamp(1.5rem,6vw,7.5rem);padding-top:1.2rem;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:1.5rem;font-size:.8125rem;color:var(--muted)}
.hero-foot a{text-decoration:none;color:var(--ivory)}
.hero-foot a span{margin-left:1rem;color:var(--gold)}
.pairing{padding-block:7.5rem;display:grid;grid-template-columns:1.03fr 1fr;gap:clamp(3rem,8vw,8rem);align-items:center}
.pairing-visual{height:690px;border:1px solid var(--line)}
.pairing-visual img{width:100%;height:100%;object-fit:cover;object-position:center 75%}
h2{font-size:clamp(2.7rem,4.2vw,4.8rem);line-height:1.13;letter-spacing:-.035em}
.pairing h2{margin-top:1.3rem}
.section-intro{font-size:1.125rem;margin-top:1.7rem;max-width:31rem;color:var(--muted)}
.pairing-detail{margin-top:1.8rem;padding-top:1.5rem;border-top:1px solid var(--line)}
.pairing-detail h3{font-size:clamp(1.5rem,2vw,2rem);line-height:1.35}
.pairing-detail p{color:var(--muted);max-width:31rem;margin-top:.6rem}
.personal{padding-block:6rem 7rem;display:grid;grid-template-columns:1fr 1.3fr;gap:clamp(3rem,8vw,8rem);border-top:1px solid var(--line)}
.personal-intro h2{margin-top:1.3rem}
.feature{display:grid;grid-template-columns:2rem 1fr;gap:1.4rem;padding:2.2rem 0;border-bottom:1px solid var(--line)}
.feature:first-child{padding-top:0}
.feature:last-child{border:0;padding-bottom:0}
.feature-number{font-size:.875rem;color:var(--gold);padding-top:.08rem;font-variant-numeric:tabular-nums}
.feature .eyebrow{color:var(--muted);font-size:.8125rem;letter-spacing:.13em}
.feature h3{font-size:clamp(1.5rem,2vw,2rem);line-height:1.25;margin-top:.55rem;letter-spacing:-.015em}
.feature p:last-child{color:var(--muted);margin-top:.85rem;max-width:36rem}
.contact{padding-block:6.5rem 7rem;border-top:1px solid var(--line);text-align:center;background:linear-gradient(180deg,rgba(200,173,114,.035),transparent)}
.contact h2{margin-top:1.5rem}
.contact>p:not(.eyebrow){margin:1.6rem auto 0;max-width:34rem;color:var(--muted)}
.button-outline{border:1px solid var(--gold);color:var(--gold);margin-top:2rem}
.button-outline:hover{background:var(--gold);color:var(--charcoal)}
.email-address{display:block;width:fit-content;max-width:100%;overflow-wrap:anywhere;margin:1.2rem auto 0;color:var(--muted);font-size:.875rem}
.site-footer{border-top:1px solid var(--line);padding-block:2rem;display:flex;align-items:center;gap:2rem;color:var(--muted);font-size:.8125rem}
.site-footer .brand{width:116px}
.site-footer>a:last-child{margin-left:auto;text-decoration:none}
.site-footer>a:last-child span{color:var(--gold);margin-left:.7rem}
@media(min-width:1800px){.hero-image:after{content:'';position:absolute;inset:0;background:linear-gradient(270deg,var(--charcoal),transparent 20%)}}
@media(max-width:1000px){.site-header{gap:1rem}.site-header nav{gap:1.3rem}.release-note{margin-left:0;max-width:11rem}.hero{min-height:760px;padding-top:4.5rem}.hero-image{left:27%}.hero h1{font-size:clamp(4rem,8vw,6rem)}.pairing{padding-block:5rem;gap:3rem}.pairing-visual{height:640px}.personal{gap:3rem;grid-template-columns:1fr 1.35fr}}
@media(max-width:700px){html{scroll-padding-top:1.5rem}.site-header{min-height:96px;padding-block:1.1rem;flex-wrap:wrap;gap:.5rem 1rem}.brand{width:132px}.site-header nav{gap:1.1rem;font-size:.8125rem}.release-note{flex-basis:100%;max-width:none;padding:0;border:0;font-size:.75rem;line-height:1.5;letter-spacing:.035em}.hero{min-height:830px;min-height:max(780px,calc(100svh - 110px));align-items:flex-start;padding-top:3.2rem;padding-bottom:15rem}.hero-content{width:100%}.hero .eyebrow{font-size:.75rem;letter-spacing:.13em}.hero h1{font-size:clamp(3.25rem,12.5vw,5.5rem);line-height:1.08;margin-top:1.2rem}.hero-description{font-size:1rem;margin-top:1.4rem;max-width:24rem}.hero-image{inset:26% -15% 0 10%}.hero-image img{object-position:50% 75%}.hero:before{background:linear-gradient(180deg,#0b0c0d 2%,rgba(11,12,13,.97) 20%,rgba(11,12,13,.76) 42%,rgba(11,12,13,.12) 68%,#0b0c0d 100%),linear-gradient(90deg,rgba(11,12,13,.6),transparent 90%)}.hero-foot{bottom:1.8rem;padding-top:1rem;font-size:.75rem}.hero-foot>a{display:none}.pairing{grid-template-columns:1fr;gap:2.5rem;padding-block:3.5rem 4.5rem}.pairing-visual{height:380px;order:2}.pairing-content{order:1}.pairing h2{max-width:24rem;font-size:clamp(2rem,9vw,3.75rem)}.section-intro{font-size:1.0625rem}.pairing-detail{margin-top:1.5rem;padding-top:1.2rem}.personal{padding-block:3.5rem 4.5rem;grid-template-columns:1fr;gap:2.6rem}.personal h2{font-size:clamp(2rem,9vw,3.75rem)}.feature{gap:.8rem;padding-block:1.8rem;grid-template-columns:1.7rem 1fr}.feature h3,.pairing-detail h3{font-size:clamp(1.5rem,5.5vw,1.75rem)}.contact{padding-block:4.2rem}.contact h2{font-size:clamp(2rem,9vw,3.75rem)}.contact>p:not(.eyebrow){font-size:1rem}.site-footer{flex-wrap:wrap;gap:1rem;justify-content:space-between}.site-footer p{order:3;flex-basis:100%}.site-footer>a:last-child{margin-left:0}}
@media(max-width:360px){.site-header nav{gap:.9rem}.brand{width:112px}.hero h1{font-size:3.25rem}.hero{min-height:820px}.button{gap:1.2rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

/* Responsive layout: shared flow, touch targets, and text enlargement. */
body{overflow-wrap:break-word}
h1,h2,h3,p{text-wrap:wrap}
.sentence{display:block}
.site-footer>a:last-child,.email-address{font-weight:500}
.site-header,.site-footer{flex-wrap:wrap}
.site-header nav{flex-wrap:wrap;align-items:center;min-width:0;column-gap:clamp(1rem,2.6vw,2.3rem);row-gap:.25rem}
.site-header nav a,.site-footer>a:last-child{display:inline-flex;align-items:center;min-height:44px}
.site-header .release-note{max-width:100%}
.hero-content,.pairing-content,.personal-intro,.features,.feature>div{min-width:0}
.hero-content{width:min(100%,650px)}
.hero h1{overflow-wrap:anywhere}
.pairing{grid-template-columns:minmax(0,1.03fr) minmax(0,1fr)}
.personal{grid-template-columns:minmax(0,1fr) minmax(0,1.3fr)}
.feature{grid-template-columns:2rem minmax(0,1fr)}
.hero-foot{flex-wrap:wrap}
.pairing-visual{height:auto;aspect-ratio:4/5;min-width:0;overflow:hidden}
.pairing-visual img{aspect-ratio:4/5}
.button{min-height:54px;gap:clamp(.75rem,4vw,2rem);padding-inline:clamp(.75rem,4vw,1.4rem)}
.button span{flex:none}
.button .button-label{min-width:0;flex:0 1 auto;font:inherit;line-height:inherit;overflow-wrap:anywhere}
.email-address{display:inline-flex;align-items:center;min-height:44px;margin:1rem auto 0;overflow-wrap:anywhere}
.contact .email-address{display:flex;width:fit-content}

@media(min-width:701px) and (max-width:1000px){
  .hero h1{font-size:clamp(3.5rem,8vw,5rem)}
  .personal{grid-template-columns:minmax(0,1fr) minmax(0,1.35fr)}
  .pairing-visual{min-height:32rem}
}
@media(max-width:700px){
  .site-header nav{font-size:.875rem;gap:.25rem 1rem}
  .pairing,.personal{grid-template-columns:minmax(0,1fr)}
  .pairing-visual{height:auto;aspect-ratio:5/4;min-height:0}
  .pairing-visual img{aspect-ratio:5/4}
  .feature{grid-template-columns:1.7rem minmax(0,1fr)}
  .hero{padding-bottom:17rem}
  .hero h1{font-size:clamp(3rem,12.5vw,5.5rem)}
  .hero .eyebrow,.release-note{font-size:.8125rem}
  .hero-foot{font-size:.8125rem}
  .site-footer{font-size:.875rem}
}
@media(max-width:380px){
  .button span[aria-hidden]{display:none}
  .site-header nav{flex-basis:100%;margin-left:0;justify-content:space-between;order:3}
  .site-header .release-note{flex:1;max-width:10rem;margin-left:auto;text-align:right;font-size:.75rem}
  .hero{min-height:760px;padding-top:2.5rem}
  .hero h1{font-size:clamp(2.5rem,12.5vw,3rem)}
}
@media(max-height:600px) and (min-width:701px){
  .hero{min-height:0;padding-block:3.5rem 7rem}
  .hero h1{font-size:clamp(3.25rem,7vw,5rem)}
}
@media(pointer:coarse){
  .site-header nav a,.site-footer>a:last-child,.email-address{min-height:48px}
}

/* Preserve the accepted portrait hero composition on wider screens. */
@media(min-width:701px){
  .hero-image{inset:0 0 0 auto;height:100%;width:auto;aspect-ratio:3/4;max-width:65%;mask-image:linear-gradient(90deg,transparent,#000 18%)}
  .hero-image img{object-fit:contain;object-position:right center}
}

/* Footer profile link and compact mobile arrangement. */
.site-footer .instagram-link{display:inline-flex;align-items:center;justify-content:center;flex:none;width:44px;height:44px;margin-left:auto;color:var(--gold);text-decoration:none;border-radius:50%;transition:color .2s ease}
.site-footer .instagram-link svg{display:block;width:24px;height:24px}
.site-footer .instagram-link:hover{color:var(--ivory)}
.site-footer>.instagram-link+a{margin-left:0}
@media(max-width:700px){
  .site-footer{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center}
  .site-footer .brand{grid-column:1;grid-row:1}
  .site-footer .instagram-link{grid-column:2;grid-row:1;justify-self:end;margin:0}
  .site-footer p{grid-column:1;grid-row:2;order:initial;min-width:0}
  .site-footer>a:last-child{grid-column:2;grid-row:2;justify-self:end}
}
@media(pointer:coarse){.site-footer .instagram-link{width:48px;height:48px}}
@media(prefers-reduced-motion:reduce){.site-footer .instagram-link{transition:none}}
