/* Evren Face concept: product photography and native scroll. Scoped to this page. */
html:has(body[data-page="face"]) { scroll-padding-top:88px; }
body[data-page="face"] { background:#090a0e; color:#f4f2ef; }
.eh-page { --eh-bg:#090a0e; --eh-muted:#a9a8b0; --eh-line:#ffffff21; --eh-warm:#d7b894; background:var(--eh-bg); color:#f4f2ef; overflow:clip; }
.eh-page [hidden] { display:none!important; }
.eh-page img { width:100%; height:auto; }
.eh-page h1,.eh-page h2,.eh-page h3 { letter-spacing:-.055em; text-wrap:balance; }
.eh-page p { line-height:1.7; }
.eh-page button:focus-visible,.eh-page a:focus-visible { outline:2px solid #ddd2ff; outline-offset:6px; }
.eh-wrap { width:min(1280px,calc(100% - 112px)); margin-inline:auto; }
.eh-kicker { display:block; font-size:12px; line-height:1.6; font-weight:600; letter-spacing:.18em; }
.eh-nav { position:relative; z-index:12; height:64px; display:flex; align-items:center; justify-content:space-between; gap:24px; padding:0 max(40px,calc((100vw - 1392px)/2)); border-bottom:1px solid var(--eh-line); background:#111216c9; backdrop-filter:blur(24px); }
.eh-wordmark { font-family:var(--display); font-size:22px; letter-spacing:-1px; white-space:nowrap; }
.eh-wordmark b { font-weight:400; color:#aba9b5; }
.eh-nav>div { display:flex; align-items:center; gap:28px; }
.eh-nav>div a { font-size:13px; padding:15px 0; color:#d5d2db; }
.eh-nav>div a:hover { color:white; }
.eh-concept { border:1px solid #ffffff24; border-radius:30px; padding:6px 11px; font-size:11px; color:#b8b5c1; white-space:nowrap; }
.eh-hero { position:relative; isolation:isolate; }
.eh-hero-inner { position:relative; display:grid; grid-template-columns:.85fr 1.15fr; align-items:center; min-height:calc(100svh - 152px); max-height:1100px; }
.eh-hero-copy { z-index:2; padding:65px 0 95px; }
.eh-hero-copy .eh-kicker { color:#bbb6c9; margin-bottom:24px; }
.eh-hero h1 { font-size:clamp(48px,5.7vw,88px); line-height:1.08; font-weight:440; max-width:7em; }
.eh-hero p { font-size:19px; color:var(--eh-muted); max-width:345px; margin-top:28px; }
.eh-glass { background:var(--studio-crystal-fill); border:1px solid var(--studio-crystal-edge); box-shadow:var(--studio-crystal-shadow); color:#f9f7fc; border-radius:18px; backdrop-filter:blur(24px); font-size:14px; }
.eh-hero .eh-glass { margin-top:32px; }
.eh-glass span { font-size:21px; }
.eh-hero-product { margin-left:-90px; margin-right:-95px; transform:translateY(calc(var(--hero-progress,0)*-70px)) scale(calc(1 + var(--hero-progress,0)*.12)); will-change:transform; }
.eh-hero-product img { height:min(760px,76svh); object-fit:contain; mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent); }
.eh-hero-foot { position:absolute; bottom:25px; left:0; width:100%; display:flex; justify-content:space-between; gap:20px; align-items:center; border-top:1px solid var(--eh-line); padding-top:23px; color:#a3a0ae; font-size:12px; }
.eh-hero-foot>span { font-size:10px; letter-spacing:.14em; }
.eh-hero-foot a { display:flex; gap:24px; align-items:center; }
.eh-hero-foot a span { color:#ded7ed; font-size:22px; }
.eh-intro { text-align:center; padding:140px 0 135px; }
.eh-intro h2 { font-size:clamp(34px,4.4vw,64px); line-height:1.14; margin:24px auto; max-width:15em; }
.eh-intro p { color:var(--eh-muted); font-size:20px; }
.eh-design { height:230svh; min-height:1400px; position:relative; scroll-margin-top:0; }
.eh-design-sticky { position:sticky; top:88px; height:calc(100svh - 88px); min-height:560px; overflow:hidden; background:#050609; }
.eh-detail-photos { position:absolute; inset:0; }
.eh-detail-photos img { position:absolute; inset:0; height:100%; object-fit:cover; opacity:0; transition:opacity .7s ease; transform:scale(calc(1.02 + var(--detail-progress,0)*.07)); object-position:center; }
.eh-detail-photos img.is-current { opacity:1; }
.eh-detail-shade { position:absolute; inset:0; background:linear-gradient(0deg,#06070af2,transparent 60%),linear-gradient(90deg,#06070a88,transparent 70%); }
.eh-detail-copy { position:relative; height:100%; display:flex; flex-direction:column; justify-content:flex-end; padding-bottom:40px; padding-top:40px; }
.eh-detail-copy>.eh-kicker { color:#cac0d0; margin-bottom:18px; }
.eh-detail-copy h2 { font-size:clamp(36px,4.4vw,64px); line-height:1.12; }
.eh-detail-copy p { color:#c5c0c9; font-size:18px; margin-top:18px; }
[data-detail-copy]:not(.is-current),[data-finish-copy]:not(.is-current) { display:none; }
.eh-detail-controls { display:flex; gap:10px; align-items:center; margin-top:32px; }
.eh-detail-controls button { min-height:48px; padding:0 18px; border:1px solid #ffffff35; border-radius:50px; background:#11111899; color:#c1bdca; font-size:13px; backdrop-filter:blur(16px); }
.eh-detail-controls button span { color:#8e879e; margin-right:8px; font-size:11px; }
.eh-detail-controls button[aria-pressed=true] { background:#e1d9e5; color:#17151d; border-color:#f3eef7; }
.eh-detail-controls a { margin-left:auto; border:1px solid #ffffff40; border-radius:50%; width:48px; height:48px; display:grid; place-items:center; }
.eh-detail-progress { position:absolute; bottom:0; left:0; right:0; height:2px; background:#ffffff16; }
.eh-detail-progress i { display:block; width:100%; height:100%; background:linear-gradient(90deg,#c7b2d5,#f2dbc0); transform:scaleX(var(--detail-progress,0)); transform-origin:left; }
.eh-family { padding:135px 0 100px; }
.eh-section-head { margin-bottom:50px; }
.eh-section-head>.eh-kicker { color:#c1b4ce; margin-bottom:20px; }
.eh-section-head h2 { font-size:clamp(35px,4.2vw,64px); line-height:1.13; }
.eh-section-head h2 span { color:#8b8895; }
.eh-section-head p { color:#b2aebc; font-size:19px; margin-top:24px; }
.eh-size-tabs { position:sticky; top:104px; z-index:11; display:flex; align-items:end; gap:6px; width:fit-content; margin:0 auto 32px; padding:7px; background:#1b1c23; border:1px solid #ffffff18; border-radius:22px; }
.eh-size-tabs button { display:flex; gap:12px; align-items:center; padding:13px 25px; min-height:58px; border:1px solid transparent; background:transparent; border-radius:15px; color:#aaa7b4; font-size:15px; }
.eh-size-tabs button[aria-selected=true] { background:var(--studio-crystal-fill); border-color:var(--studio-crystal-edge); box-shadow:var(--studio-crystal-shadow); color:white; }
.eh-size-symbol { display:block; width:calc(9px + var(--size)*2px); height:calc(14px + var(--size)*3px); border:1px solid currentColor; border-radius:3px; opacity:.7; }
.eh-model-stage,.eh-detach-visual { position:relative; border-radius:28px; overflow:hidden; aspect-ratio:3/2; background:#232026; }
.eh-model-stage { width:min(100%,1080px); margin-inline:auto; }
.eh-model-description { max-width:1080px; margin-inline:auto; }
.eh-model-photo { position:absolute; inset:0; }
.eh-model-stage img,.eh-detach-visual img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transition:opacity .55s; }
.eh-model-stage img.is-current,.eh-detach-visual img.is-current { opacity:1; }
.eh-model-label { position:absolute; top:24px; left:26px; font-size:14px; color:#fff; border:1px solid #ffffff40; border-radius:50px; padding:8px 15px; background:#15131988; backdrop-filter:blur(20px); }
.eh-model-label strong { font-weight:500; margin-left:5px; }
.eh-mode-tabs { position:absolute; bottom:24px; left:50%; transform:translateX(-50%); display:flex; gap:5px; background:#17161ccb; border:1px solid #ffffff44; backdrop-filter:blur(25px); padding:5px; border-radius:50px; box-shadow:0 5px 35px #0003; white-space:nowrap; }
.eh-mode-tabs button { border:0; min-height:43px; padding:0 23px; color:#dfdbe4; background:transparent; border-radius:50px; font-size:14px; }
.eh-mode-tabs button[aria-pressed=true] { color:#1c1a20; background:#f0ebdf; }
.eh-model-description { display:grid; grid-template-columns:1fr 1.4fr auto; gap:30px; align-items:start; padding:30px 6px 45px; }
.eh-model-description h3 { font-size:29px; line-height:1.3; }
.eh-model-description p { color:var(--eh-muted); font-size:16px; max-width:430px; }
.eh-model-description>span { color:#c5b7ac; font-size:12px; padding-top:7px; display:flex; align-items:center; gap:9px; }
.eh-model-description i { width:7px; height:7px; background:#b19b89; border-radius:50%; }
.eh-family-lineup { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; border-top:1px solid var(--eh-line); padding-top:36px; }
.eh-family-lineup a { position:relative; min-width:0; padding-bottom:12px; }
.eh-family-lineup img { aspect-ratio:3/2; object-fit:cover; border-radius:14px; margin-bottom:16px; transition:filter .3s; }
.eh-family-lineup a:hover img { filter:brightness(1.13); }
.eh-family-lineup span { display:block; font-size:22px; font-family:var(--display); letter-spacing:-.7px; }
.eh-family-lineup small { display:block; font-size:13px; color:#a6a1b0; margin-top:6px; }
.eh-family-lineup b { position:absolute; right:2px; bottom:35px; font-size:23px; font-weight:400; color:#9b8fa8; }
.eh-detach { padding:120px 0; background:#111216; }
.eh-detach-visual { border-radius:28px; }
.eh-detach-button { position:absolute; left:50%; bottom:26px; transform:translateX(-50%); background:#191920ce; }
.eh-detach-button:hover { transform:translateX(-50%) translateY(-2px); }
.eh-mount-story { display:grid; grid-template-columns:1.3fr 1fr; gap:65px; align-items:center; margin-top:90px; }
.eh-mount-story>img { border-radius:24px; }
.eh-mount-story h3 { font-size:clamp(32px,3vw,45px); line-height:1.15; margin-top:22px; }
.eh-mount-story p { color:#b0aab7; font-size:18px; margin-top:23px; max-width:390px; }
.eh-mount-tags { display:flex; gap:10px; margin-top:25px; flex-wrap:wrap; }
.eh-mount-tags span { border-top:1px solid #ffffff35; padding-top:13px; font-size:12px; color:#d1bfab; }
.eh-finishes { padding:130px 0; }
.eh-finish-layout { display:grid; grid-template-columns:1.5fr 1fr; gap:80px; align-items:center; }
.eh-finish-image { position:relative; aspect-ratio:1/1; border-radius:26px; overflow:hidden; background:#222026; }
.eh-finish-image img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transition:opacity .5s; }
.eh-finish-image img.is-current { opacity:1; }
.eh-finish-image img[data-finish-image="0"] { object-position:52% 70%; }
.eh-finish-image img[data-finish-image="1"] { object-position:64% 60%; }
.eh-finish-image img[data-finish-image="2"] { object-position:50% 70%; }
.eh-swatches { display:flex; gap:9px; margin-bottom:30px; }
.eh-swatches button { width:52px; height:52px; padding:7px; border-radius:50%; border:1px solid transparent; background:transparent; }
.eh-swatches button[aria-pressed=true] { border-color:#d9d0c5; }
.eh-swatches i { display:block; width:100%; height:100%; border-radius:50%; box-shadow:inset 0 1px 2px #fff9,0 4px 10px #0004; }
.eh-swatch-graphite { background:linear-gradient(130deg,#808083,#25252a 60%,#a2a0a1); }
.eh-swatch-pearl { background:linear-gradient(130deg,#fff7e9,#aaa396 70%,#f8f0df); }
.eh-swatch-champagne { background:linear-gradient(130deg,#ead7b6,#96765c 70%,#e5ceb0); }
.eh-finish-copy h3 { font-size:42px; line-height:1.14; margin-bottom:22px; }
.eh-finish-copy p { font-size:17px; color:#a9a4b2; }
.eh-finish-copy [data-finish-copy]>span { display:block; margin-top:20px; font-size:12px; color:#d0c4b6; }
.eh-finish-copy .eh-finish-footnote { font-size:12px; color:#827e8a; margin-top:40px; }
.eh-living { position:relative; isolation:isolate; border-radius:28px; overflow:hidden; }
.eh-living>img { min-height:600px; object-fit:cover; }
.eh-living:after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,#171513b0,transparent 70%); z-index:1; }
.eh-living>div { position:absolute; top:15%; left:6%; z-index:2; }
.eh-living h2 { font-size:clamp(36px,4vw,60px); line-height:1.13; margin:24px 0; }
.eh-living p { font-size:18px; color:#ebe5dc; }
.eh-compare { padding:130px 0 100px; }
.eh-compare-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:30px; }
.eh-compare-grid article { border-top:1px solid var(--eh-line); padding-top:28px; }
.eh-compare-grid .eh-kicker { color:#8f899a; font-size:10px; }
.eh-compare-grid h3 { font-size:34px; margin:12px 0; }
.eh-compare-grid p { font-size:14px; color:#c4b8cb; }
.eh-compare-grid ul { list-style:none; margin:28px 0; padding:0; color:#a29cae; font-size:14px; line-height:2.2; }
.eh-compare-grid a { display:inline-flex; gap:35px; min-height:44px; align-items:center; font-size:14px; color:#d3c1df; }
.eh-closing { text-align:center; padding:70px 0 110px; border-top:1px solid var(--eh-line); }
.eh-closing>img { width:92px; height:46px; object-fit:contain; margin:0 auto 25px; }
.eh-closing h2 { font-size:clamp(34px,4.2vw,60px); max-width:12em; margin:22px auto; line-height:1.15; }
.eh-closing .eh-concept-note { color:#8c8798; font-size:13px; max-width:520px; margin:25px auto; }
.eh-closing .text-link { color:#cfc4df; font-size:14px; }
.eh-note { font-size:14px; color:var(--eh-muted); }
.eh-motion-ready .eh-reveal { opacity:0; transform:translateY(32px); transition:opacity .8s,transform .9s cubic-bezier(.2,.7,.2,1); }
.eh-motion-ready .eh-reveal.is-visible { opacity:1; transform:none; }
.motion-paused .eh-reveal { opacity:1; transform:none; }
.motion-paused .eh-hero-product { transform:none; }
@media(min-width:1800px) { .eh-hero-product { margin-right:-170px; } }
@media(max-width:1050px) {
  .eh-wrap { width:calc(100% - 64px); }
  .eh-hero h1 { font-size:59px; }
  .eh-hero-product { margin-right:-40px; margin-left:-95px; }
  .eh-model-description { grid-template-columns:1fr 1.3fr; }
  .eh-model-description>span { display:none; }
  .eh-finish-layout { gap:40px; }
  .eh-mount-story { gap:32px; }
}
@media(max-width:760px) {
  .eh-wrap { width:calc(100% - 40px); }
  .eh-nav { height:58px; padding:0 20px; gap:12px; }
  .eh-wordmark { font-size:19px; }
  .eh-nav>div { margin-left:auto; gap:15px; }
  .eh-nav>div a { font-size:12px; }
  .eh-nav>div a:nth-child(3),.eh-nav>div a:nth-child(4) { display:none; }
  .eh-concept { font-size:9px; padding:5px 8px; }
  .eh-hero-inner { display:flex; flex-direction:column; min-height:0; max-height:none; text-align:center; }
  .eh-hero-copy { padding:45px 0 0; }
  .eh-hero-copy .eh-kicker { font-size:11px; margin-bottom:18px; }
  .eh-hero h1 { font-size:48px; max-width:7.5em; line-height:1.08; margin:auto; }
  .eh-hero p { font-size:16px; max-width:310px; margin:20px auto 0; }
  .eh-hero .eh-glass { margin-top:24px; min-height:48px; }
  .eh-hero-product { width:calc(100% + 40px); margin:-4px -20px 45px; transform:none; }
  .eh-hero-product img { width:100%; height:auto; min-height:300px; object-fit:cover; }
  .eh-hero-foot { bottom:0; padding-top:15px; text-align:left; font-size:11px; gap:10px; }
  .eh-hero-foot>span { font-size:8px; letter-spacing:.08em; max-width:130px; }
  .eh-hero-foot a { gap:8px; }
  .eh-intro { padding:95px 0; }
  .eh-kicker { font-size:10px; letter-spacing:.13em; }
  .eh-intro h2 { font-size:36px; margin:20px auto; }
  .eh-intro p { font-size:17px; }
  .eh-desktop { display:none; }
  .eh-design { min-height:0; height:190svh; scroll-margin-top:0; }
  .eh-design-sticky { top:72px; height:calc(100svh - 72px); min-height:530px; }
  .eh-detail-photos img { object-position:58% center; }
  .eh-detail-photos [data-detail-image="1"] { height:90%; object-position:42% center; transform:none; }
  html:has(body[data-page="face"]) { scroll-padding-top:73px; }
  .eh-detail-shade { background:linear-gradient(0deg,#050609f5 4%,#050609b0 35%,transparent 75%); }
  .eh-detail-copy { padding-bottom:27px; }
  .eh-detail-copy h2 { font-size:36px; }
  .eh-detail-copy p { font-size:16px; line-height:1.6; }
  .eh-detail-controls { gap:7px; margin-top:24px; }
  .eh-detail-controls button { font-size:12px; padding:0 12px; min-height:45px; }
  .eh-detail-controls a { width:42px; height:42px; }
  .eh-family { padding:85px 0; }
  .eh-section-head { margin-bottom:32px; }
  .eh-section-head h2 { font-size:36px; line-height:1.16; }
  .eh-section-head p { font-size:17px; margin-top:20px; }
  .eh-size-tabs { top:85px; width:100%; justify-content:space-between; padding:5px; gap:0; border-radius:17px; margin-bottom:20px; }
  .eh-size-tabs button { flex:1; justify-content:center; padding:12px 7px; font-size:13px; min-height:49px; border-radius:13px; gap:0; }
  .eh-size-symbol { display:none; }
  .eh-model-stage { aspect-ratio:auto; overflow:visible; background:transparent; }
  .eh-model-photo { position:relative; inset:auto; aspect-ratio:4/5; border-radius:20px; overflow:hidden; }
  .eh-model-stage img { object-position:50% center; }
  .eh-model-label { font-size:12px; top:16px; left:16px; }
  .eh-mode-tabs { position:relative; bottom:auto; left:auto; transform:none; margin:16px auto 0; width:max-content; }
  .eh-mode-tabs button { font-size:12px; padding:0 16px; min-height:40px; }
  .eh-model-description { display:block; padding:24px 0 32px; }
  .eh-model-description h3 { font-size:27px; }
  .eh-model-description p { margin-top:13px; font-size:16px; }
  .eh-family-lineup { grid-template-columns:repeat(2,1fr); gap:22px 14px; padding-top:25px; }
  .eh-family-lineup span { font-size:21px; }
  .eh-family-lineup small { font-size:12px; }
  .eh-detach { padding:80px 0; }
  .eh-detach-visual { aspect-ratio:4/5; border-radius:20px; }
  .eh-detach-visual img { object-position:54% center; }
  .eh-detach-button { bottom:20px; font-size:13px; min-height:47px; }
  .eh-mount-story { grid-template-columns:1fr; margin-top:60px; gap:30px; }
  .eh-mount-story h3 { font-size:35px; }
  .eh-mount-story p { font-size:17px; }
  .eh-finishes { padding:85px 0; }
  .eh-finish-layout { grid-template-columns:1fr; gap:25px; }
  .eh-finish-image { aspect-ratio:1/1; border-radius:20px; }
  .eh-swatches { margin-bottom:20px; }
  .eh-finish-copy h3 { font-size:34px; margin-bottom:15px; }
  .eh-finish-copy .eh-finish-footnote { margin-top:22px; }
  .eh-living { width:100%; border-radius:0; }
  .eh-living>img { min-height:650px; height:85svh; object-position:62% center; }
  .eh-living:after { background:linear-gradient(0deg,#0a090ade,transparent 75%); }
  .eh-living>div { top:auto; bottom:40px; left:25px; }
  .eh-living h2 { font-size:39px; }
  .eh-living p { font-size:16px; }
  .eh-compare { padding:80px 0 65px; }
  .eh-compare-grid { grid-template-columns:repeat(2,1fr); gap:32px 20px; }
  .eh-compare-grid h3 { font-size:28px; }
  .eh-compare-grid p,.eh-compare-grid ul,.eh-compare-grid a { font-size:12px; }
  .eh-compare-grid ul { margin:20px 0; line-height:2; }
  .eh-compare-grid a { gap:20px; }
  .eh-closing { padding:65px 0 75px; }
  .eh-closing h2 { font-size:36px; }
}
@media(max-width:360px) {
  .eh-concept { display:none; }
  .eh-hero h1 { font-size:42px; }
  .eh-section-head h2 { font-size:32px; }
  .eh-detail-controls button { padding:0 9px; font-size:11px; }
}
@media(prefers-reduced-motion:reduce) {
  .eh-page *, .eh-page *:before { transition:none!important; }
  .eh-hero-product,.eh-motion-ready .eh-reveal { transform:none; opacity:1; }
  .eh-design { height:auto; min-height:0; }
  .eh-design-sticky { position:relative; top:0; height:750px; }
}

