@font-face{font-family:TT Norms;src:url('tt-norms-regular.otf') format('opentype');font-display:swap;font-weight:400}
@font-face{font-family:TT Norms;src:url('tt-norms-bold.otf') format('opentype');font-display:swap;font-weight:700}
:root{--ink:#26392f;--paper:#f6f3eb;--gold:#9b7842;--line:#dcded1}
body{font-family:'TT Norms',sans-serif;background:var(--paper);color:var(--ink)}
html{scroll-padding-top:110px}section{scroll-margin-top:25px;padding:110px max(6vw,24px)}
a,button{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible{outline:3px solid var(--gold);outline-offset:6px}
.skip-link{position:fixed;top:12px;left:12px;transform:translateY(-180%);z-index:110;background:var(--paper);padding:15px;color:var(--ink)}.skip-link:focus{transform:none}
nav{padding:20px 5vw;background:rgba(246,243,235,.96);border-color:var(--line);gap:22px;backdrop-filter:blur(16px)}
.nav-logo{font-size:17px;letter-spacing:1px}.nav-logo img{border-radius:50%;width:40px;height:40px}.nav-links{margin-left:auto;gap:26px}.nav-links a{color:var(--ink)}.nav-links a[aria-current]{text-decoration:underline;text-underline-offset:7px}
.btn-buy,.btn-primary{background:var(--ink);border-radius:2px;padding:15px 24px}.btn-secondary{border-color:var(--ink);border-width:1px;color:var(--ink);border-radius:2px}.btn-primary,.btn-secondary,.btn-buy,.btn-shopee{display:inline-block;transition:transform .2s,background .2s}.btn-primary:hover,.btn-buy:hover{background:#435847;transform:translateY(-3px)}.btn-secondary:hover,.btn-shopee:hover{transform:translateY(-3px)}
.motion-toggle{font:inherit;font-size:11px;letter-spacing:.04em;color:var(--ink);background:none;border:1px solid #c4cbbf;border-radius:30px;padding:9px 12px;cursor:pointer;white-space:nowrap}
.scroll-progress{position:fixed;top:0;left:0;height:3px;width:100%;background:var(--gold);transform:scaleX(0);transform-origin:left;z-index:101}
#hero{position:relative;min-height:calc(100svh - 82px);grid-template-columns:1.05fr 1fr;gap:5vw;padding:70px 6vw 95px;background:radial-gradient(ellipse at 85% 50%,#dfe4d4 0,transparent 56%),var(--paper);overflow:clip}
#hero h1{font-size:clamp(40px,4.6vw,76px);font-weight:500;line-height:1.1;letter-spacing:-2.5px;margin:22px 0}#hero h1 em{font-weight:500;color:var(--gold)}
#hero p{font-size:16px;max-width:490px;color:#5b655b}#hero .breadcrumb{font-size:10px;letter-spacing:1.7px;color:#65705f;margin-bottom:36px}.breadcrumb::before{content:'';display:inline-block;width:6px;height:6px;background:var(--gold);border-radius:50%;margin-right:10px}.hero-kicker{font-size:11px;text-transform:uppercase;letter-spacing:2.5px;color:var(--gold)}
.hero-image-wrap{perspective:1100px;min-width:0}.product-scene{position:relative;width:min(100%,530px);aspect-ratio:1;transform-style:preserve-3d;transform:rotateX(var(--scene-x,0deg)) rotateY(var(--scene-y,-9deg)) rotateZ(var(--scene-z,-3deg));will-change:transform}
.product-frame{position:absolute;inset:5% 9%;border:8px solid #eee9dd;box-shadow:20px 28px 50px #27382725;transform:translateZ(25px);background:#eee9dd;backface-visibility:hidden}.hero-product-img{max-width:none;width:100%;height:100%;border-radius:0;object-fit:cover}.image-caption{position:absolute;bottom:0;left:0;right:0;display:flex;justify-content:space-between;gap:8px;background:#eee9dd;padding:14px 7px 5px;font-size:8px;letter-spacing:1.5px}
.orbit{position:absolute;inset:-2%;border:1px solid #9b784255;border-radius:50%;transform:translateZ(-35px) rotateZ(-22deg) rotateY(30deg)}.orbit-two{inset:6% -10%;transform:translateZ(-60px) rotateZ(35deg) rotateX(50deg)}
.floating-label{position:absolute;background:#f9f7eff5;padding:16px 22px;box-shadow:0 12px 35px #26392f18;transform:translateZ(85px);border:1px solid #d7d7c4;display:flex;flex-direction:column;gap:5px}.floating-label>span{font-size:10px;letter-spacing:1px;color:#666d5c}.label-top{top:12%;left:-2%}.label-top strong{font-family:'Playfair Display',serif;font-weight:500;font-size:20px}.label-bottom{bottom:10%;right:0}.label-bottom strong{font-size:38px;font-weight:400}.label-bottom strong span{font-size:15px;margin-left:3px}.scene-index{position:absolute;bottom:-4%;left:12%;font-size:9px;letter-spacing:2px;color:#65705f;transform:translateZ(20px)}
.scroll-cue{position:absolute;bottom:30px;left:6vw;display:flex;align-items:center;gap:14px;color:var(--ink);font-size:10px;text-transform:uppercase;letter-spacing:2px;text-decoration:none}.scroll-cue>span:first-child{font-size:22px}.cue-line{width:80px;height:1px;background:#a9b09d}
#about{background:var(--paper);gap:12vw;border-top:1px solid var(--line)}#about h2{font-weight:500;font-size:clamp(30px,3.4vw,48px);letter-spacing:-1px}#about .eyebrow,.benefit-tag,#traffic .section-eyebrow,#testimonials .section-eyebrow{color:var(--gold);letter-spacing:2px}#about p{color:#5b655b}.feature-badge{border:0;border-top:1px solid var(--line);border-radius:0;padding:20px 0}.badge-icon{background:#e9eadf;color:var(--gold);border-radius:50%;font-size:23px}
#benefits{background:#e8ebdf;padding-bottom:130px}#benefits h2{text-align:left;color:var(--gold);margin-bottom:55px;letter-spacing:2px}.benefits-grid{grid-template-columns:1.2fr 1fr 1fr;gap:36px;align-items:start;perspective:1200px}.benefit-card{transform-style:preserve-3d;transform:translateY(var(--card-offset,0px)) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg));transition:transform .25s ease-out}.benefit-card:nth-child(2){margin-top:75px}.benefit-card:nth-child(3){margin-top:150px}.benefit-card img{height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:120px 120px 3px 3px;box-shadow:0 16px 28px #26392f14}.benefit-tag{margin-top:24px}.benefit-card h3{font-family:'Playfair Display',serif;font-size:23px;font-weight:500;margin-top:3px}.benefit-card p{font-size:15px;color:#5b655b}
#traffic{background:var(--paper)}#traffic h2,#testimonials h2{font-weight:500;font-size:clamp(30px,3.5vw,46px);letter-spacing:-1px}.traffic-grid{max-width:900px;margin:auto;gap:30px}.traffic-card{background:#fdfbf5;border:1px solid var(--line);border-radius:2px;padding:32px;transform:perspective(1000px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg));transition:transform .25s ease-out}.traffic-card .card-tag{color:var(--gold)}.brand-logo{border-radius:8px}
#testimonials{background:#e8ebdf}.testi-grid{gap:6vw}.testi-card{border:0;border-top:1px solid #bfc8b6;border-radius:0;padding:30px 0}.testi-card blockquote{font-family:'Playfair Display',serif;font-size:18px;color:#435443}.testi-avatar{background:#d6decd;color:var(--ink);font-size:28px}
#cta{background:var(--ink);padding:85px 6vw}#cta h2{font-weight:500}.btn-shopee{border-radius:2px;background:#ba5636}footer{background:#203027;padding:65px 6vw}footer ul a,footer p{color:#c0c9bc}.footer-bottom{background:#1c2922;color:#adb8a7}
#faq{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.65fr);gap:8vw;background:var(--paper);border-top:1px solid var(--line)}
#faq .section-eyebrow{font-size:11px;font-weight:700;letter-spacing:2px;color:var(--gold);margin-bottom:10px}
#faq h2{font-family:'Playfair Display',serif;font-weight:500;font-size:clamp(30px,3.5vw,46px);letter-spacing:-1px;margin-bottom:20px}
.faq-intro>p:last-child{max-width:310px;font-size:16px;line-height:1.7;color:#5b655b}
.faq-list{min-width:0;border-top:1px solid var(--line)}
.faq-list details{border-bottom:1px solid var(--line)}
.faq-list summary{position:relative;list-style:none;padding:24px 40px 24px 0;font-size:18px;font-weight:700;line-height:1.5;cursor:pointer}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary::before,.faq-list summary::after{content:'';position:absolute;right:4px;top:37px;width:14px;height:2px;background:currentColor}
.faq-list summary::after{transform:rotate(90deg)}
.faq-list details[open] summary::after{transform:rotate(0deg)}
.faq-list summary:hover{color:#6e532c}
.faq-list summary:focus-visible{outline:3px solid var(--gold);outline-offset:4px}
.faq-list details p{padding:0 40px 24px 0;font-size:16px;line-height:1.8;color:#5b655b}
.faq-list a{color:var(--ink);text-underline-offset:4px}
@media(max-width:900px){#faq{grid-template-columns:1fr;gap:32px}.faq-intro>p:last-child{max-width:480px}}
@media(min-width:901px) and (min-height:650px){.motion-enabled .hero-scroll{height:145svh}.motion-enabled #hero{position:sticky;top:80px}}
@media(max-width:1100px){.nav-links{gap:16px}.motion-toggle{margin-left:auto}#hero h1{letter-spacing:-1.5px}.hero-actions{gap:10px}.hero-actions a{padding:13px 18px}}
@media(max-width:900px){nav{padding:12px 20px;gap:12px}.nav-logo{font-size:14px;letter-spacing:0}.nav-logo img{width:30px;height:30px}.btn-buy{font-size:12px;padding:11px 13px}.motion-toggle{font-size:10px;padding:8px}.nav-links{display:none}#hero{grid-template-columns:1fr;padding:45px 24px 80px;gap:35px;min-height:auto}#hero h1{font-size:clamp(40px,7.5vw,65px)}#hero p{max-width:620px}#hero .breadcrumb{margin-bottom:24px}.hero-image-wrap{padding:15px 10px 25px}.product-scene{width:min(80%,470px)}.scroll-cue{left:24px;bottom:20px}section{padding:65px 24px}#about{gap:28px}.benefits-grid{grid-template-columns:1fr;gap:45px;max-width:540px;margin:auto}.benefit-card:nth-child(n){margin-top:0}.benefit-card img{max-height:500px;aspect-ratio:1;object-position:center}.traffic-grid,.testi-grid{grid-template-columns:1fr}#benefits{padding-bottom:65px}#cta{padding:60px 24px}footer{padding:45px 24px}}
@media(max-width:420px){.nav-logo span{max-width:65px;font-size:12px}.motion-toggle{padding:7px;font-size:9px}.floating-label{padding:11px 13px}.label-top strong{font-size:16px}.label-bottom strong{font-size:28px}.product-scene{width:90%}.image-caption{font-size:6px;letter-spacing:1px}}
.motion-paused *, .motion-paused *::before,.motion-paused *::after{scroll-behavior:auto!important}.motion-paused .product-scene{transform:rotateY(-5deg) rotateZ(-2deg);will-change:auto}.motion-paused .benefit-card,.motion-paused .traffic-card{transform:none;transition:none}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.product-scene{will-change:auto}}