
/* Atelier: image-led, layered and page-specific Leafhub art direction. */
:root{--forest:#062e22;--jade:#24583d;--brass:#c5a368;--cream:#f4f0e5}
body{background:var(--cream)}#header{background:#fffdf8f7;backdrop-filter:blur(18px)}#announcement{background:#052b20}
.atelier-hero{display:grid;grid-template-columns:46% 54%;min-height:710px;height:calc(100svh - 139px);max-height:950px;padding:55px 6% 80px;background:radial-gradient(ellipse at 78% 16%,#3d654145 0,transparent 50%),linear-gradient(120deg,#062b21 0%,#0a3727 50%,#142f20 100%);isolation:isolate;overflow:hidden}
.atelier-hero:before{content:"";position:absolute;inset:24px;border:1px solid #c9af7524;pointer-events:none;z-index:-1}
.hero-haze{position:absolute;inset:-30%;z-index:-1;background:radial-gradient(ellipse at 72% 33%,#8a985832 0,transparent 36%),radial-gradient(ellipse at 32% 70%,#48765d45 0,transparent 40%);animation:ambient-shift 18s ease-in-out infinite alternate;pointer-events:none}
.atelier-hero .hero-content{padding:0 20px 0 0;margin:0;text-align:left;max-width:620px;z-index:3}
.atelier-hero .hero-content:before{display:none}
.atelier-hero .hero-content .eyebrow{color:#d2bc85;letter-spacing:.25em;margin-bottom:30px;font-size:.75rem}
.atelier-hero h1{font-size:clamp(2.7rem,4.9vw,5.4rem);font-weight:400;line-height:1.3;letter-spacing:.025em;max-width:620px;margin:0 0 27px;color:#f7f1e4;text-shadow:none}
html[lang=zh] .atelier-hero h1{max-width:500px;line-height:1.5;letter-spacing:.12em}html[lang=th] .atelier-hero h1{font-size:clamp(2.3rem,4vw,4.2rem);line-height:1.55;letter-spacing:0}
.atelier-hero p{color:#becbbb;font-size:1rem;letter-spacing:.025em;line-height:1.9;max-width:430px;margin-bottom:32px}
.hero-links{display:flex;gap:24px;align-items:center;flex-wrap:wrap}.hero-links .button{background:#c5a368;color:#112f23;border-color:#c5a368;padding:15px 30px}.hero-links .button:hover{background:#dfc58b}
.hero-film-link{font-size:.875rem;color:#ebe5d4;display:inline-flex;gap:10px;align-items:center}.hero-film-link span{display:grid;place-items:center;border:1px solid #b7bda34a;border-radius:50%;width:36px;height:36px;font-size:1.25rem}
.hero-baseline{display:flex;align-items:center;gap:16px;margin-top:65px;color:#adbda5;font-size:.7rem;letter-spacing:.2em}.hero-baseline i{width:60px;height:1px;background:#99a18460}
.hero-collage{height:570px;position:relative;max-width:650px;width:100%;margin:auto;perspective:1000px}
.collage-keyline{position:absolute;inset:7% 0 13% 13%;border:1px solid #cfb48045;transform:rotate(7deg);pointer-events:none}
.hero-frame{position:absolute;display:block;background:#e6e0c9;padding:9px;box-shadow:0 35px 65px #0006;transition:transform .65s}
.hero-frame img{width:100%;height:calc(100% - 41px);object-fit:contain;background:#222918}
.hero-frame>div{height:41px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:6px 5px;font-size:.75rem;color:#294331;line-height:1.3}
.hero-frame b{font-weight:400;white-space:nowrap}.frame-main{right:0;top:0;width:76%;height:86%;transform:rotate(4deg);z-index:1}.frame-main:hover{transform:rotate(1deg) translateY(-6px)}
.frame-secondary{left:-3%;bottom:0;width:39%;height:64%;transform:rotate(-9deg);z-index:2}.frame-secondary:hover{transform:rotate(-5deg) translateY(-6px)}
.collage-caption{position:absolute;right:4%;bottom:0;color:#bcc6ae;font-size:.65rem;letter-spacing:.18em;line-height:2.1;text-align:right}
.collage-caption b{font-family:var(--serif);font-size:1.15rem;letter-spacing:.2em;font-weight:400;color:#decea9}
.atelier-hero .hero-dots{bottom:30px;left:7%;transform:none}.atelier-hero .hero-dots button{width:28px;height:3px;background:#b5b9a240}.atelier-hero .hero-dots .active{background:#cfb375}
.hero-edition{position:absolute;bottom:26px;right:7%;font-size:.65rem;letter-spacing:.2em;color:#a2b197}
.brand-ribbon{display:flex;justify-content:center;gap:40px;align-items:center;background:#e4e6d7;color:#37523d;padding:19px 6%;font-size:.75rem;letter-spacing:.16em;border-bottom:1px solid #cbd1ba}.brand-ribbon i{height:3px;width:3px;background:#998252;transform:rotate(45deg)}
body[data-page=home] main>.section:not(.reference-collection):not(.film-section):not(.faq-section){background:transparent}
body[data-page=home] main>.section:first-of-type{padding-top:80px}
.reference-collection{background:linear-gradient(140deg,#143b2b,#284f34);position:relative;color:#f2eedc;margin-top:20px;padding-block:85px}
.reference-collection:before{content:"";position:absolute;inset:18px;border:1px solid #c1b48825;pointer-events:none}
.reference-collection .section-title p{color:#c1cbb5}.reference-collection .eyebrow{color:#c9b07a}.reference-collection .product{color:#294131;border-color:transparent;background:#f3f0e3}.reference-collection .button.outline{color:#e1d2ac;border-color:#c5b47b7a}
.occasion-section{padding-block:100px}.occasion-section .tile:first-child{transform:translateY(-12px)}.occasion-section .tile:last-child{transform:translateY(20px)}
.occasion-section .tile{min-height:490px;box-shadow:15px 20px 0 #e4e3d4;border:8px solid #fffcf1}.tile .eyebrow{color:#e0c893}.tile img{filter:brightness(.57)}
body[data-page=home] .split{max-width:1390px;margin:25px auto 50px;background:#dfe5d5;position:relative}.split>img{min-height:520px}.split-copy{position:relative}.split-copy:before{content:"";display:block;width:48px;height:1px;background:#a98d51;margin-bottom:35px}
.film-section{background:radial-gradient(ellipse at top left,#304b34,transparent 60%),#0f2b24;color:#f5efdc;max-width:none;padding-inline:max(6%,calc((100% - 1300px)/2));position:relative}
.film-section .section-title p{color:#bdc7b8}.film-section .eyebrow{color:#d0b57d}.film-section .video-note{color:#d8c798}.film-section .video{max-width:1050px;margin:auto;box-shadow:0 25px 60px #0004;border-color:#aa97644a}
.journal-section .article-grid{gap:0;border:1px solid #cbd0bd}.journal-section .article-grid article{border:0;border-right:1px solid #cbd0bd;background:#eceee2;padding:35px}.journal-section .article-grid article:last-child{border-right:0}
.steps-section{background:#f1ecdf}.steps-section .step-number{color:#9d854e}.faq-section{background:#dce4d4}
.page-title{min-height:350px;padding:55px 8%;display:flex;align-items:center;text-align:left;overflow:hidden;isolation:isolate;background:#103d2f}
.page-title-inner{position:relative;z-index:2;max-width:66%}.page-title .breadcrumb{margin-bottom:25px;font-size:.75rem;letter-spacing:.06em}.page-title .eyebrow{color:#c6b582;font-size:.7rem;margin-bottom:15px}
.page-title h1{font-size:clamp(2.5rem,4.5vw,4.6rem);line-height:1.35;letter-spacing:.04em}.page-title:after{display:none}.title-rule{width:60px;height:1px;background:#cdb377;display:block;margin-top:24px}
.page-mood{position:absolute;inset:0;z-index:-1;background-image:linear-gradient(90deg,#103d2f 0%,#103d2fe8 35%,#103d2f22 100%),url("./media-v23/product-wild-premium.jpg");background-size:cover,55% auto;background-position:center,right 45%;background-repeat:no-repeat;opacity:.85}
body[data-page=shop]{background:#e8eddf}body[data-page=shop] .page-title{min-height:410px}.catalog-intro{padding-top:35px}.catalog-grid .product{box-shadow:0 4px 18px #102b2010}
body[data-page=search]{background:#f0f0e5}body[data-page=search] .page-mood{background-image:linear-gradient(90deg,#163c30 20%,#163c3077),url("./media-v23/reference-9392994681137-0.jpg")}
body[data-page=story]{background:#e2e5d6}body[data-page=story] .page-title{min-height:460px;background:#20362a}
body[data-page=story] .page-mood{background-image:linear-gradient(90deg,#1d3529 10%,#1d352985 60%,#1d352920),url("./media-v23/product-wild-premium.jpg");background-size:cover,65% auto;background-position:center,right 58%}
body[data-page=story] main>.split{max-width:1360px;margin:-30px auto 0;position:relative;border:12px solid #f1f0e3;box-shadow:0 22px 45px #153e3015}
.story-columns>div:first-child{padding:30px;border-left:1px solid #b4ac87}.story-columns>div:last-child{padding:30px;background:#cfd9c4}
body[data-page=brew]{background:#122d29}body[data-page=brew] .page-title{background:#122d29;min-height:370px}
body[data-page=brew] .page-mood{background-image:linear-gradient(90deg,#122d29 25%,#122d2960),url("./media-v23/reference-6863748595763-0.jpg");background-size:cover,60% auto;filter:saturate(.6)}
body[data-page=brew] main>.prose{max-width:1250px;padding-top:45px;padding-bottom:45px;color:#e6decb}
body[data-page=brew] main>.prose p{color:#c7d0c0}body[data-page=brew] .steps-section{background:#eeeadd}body[data-page=brew] .service-section{background:#e4e7d9}
body[data-page=culture]{background:#ede5d5}body[data-page=culture] .page-title{background:#4c4634}
body[data-page=culture] .page-mood{background-image:linear-gradient(90deg,#393e2b 15%,#393e2b66),url("./media-v23/reference-10351011627313-0.jpg");background-size:cover,60% auto}
body[data-page=culture] .article-grid article{background:#f8f3e8}body[data-page=culture] .steps-section{background:#d9ddca}
body[data-page=membership]{background:#0d2c22}body[data-page=membership] .page-title{min-height:390px;background:radial-gradient(ellipse at 80% 30%,#77683b70,transparent 60%),#0d2c22}
body[data-page=membership] .page-mood{background-image:linear-gradient(90deg,#0d2c22 15%,#0d2c2288),url("./media-v23/product-tuocha-premium.jpg");background-size:cover,42% auto;opacity:.5}
body[data-page=membership] main>.section>.note{background:#ffffff0c;color:#d2d6c5;border-color:#b5a275}
body[data-page=membership] .cards{gap:25px}body[data-page=membership] .info-card{box-shadow:0 22px 40px #0002;position:relative;min-height:390px}
body[data-page=membership] .info-card:nth-child(2){transform:translateY(-15px);background:#e8d9b5}body[data-page=membership] .info-card:nth-child(3){border-color:#819172;background:linear-gradient(145deg,#365741,#132f25)}
body[data-page=membership] .service-section{background:#eef0e4}
body[data-page=credentials]{background:#e9ece1}body[data-page=credentials] .page-title{background:#2d4338}
body[data-page=credentials] .page-mood{background-image:linear-gradient(90deg,#243f30 20%,#243f30b0),url("./media-v23/product-wild-premium.jpg");background-size:cover,50% auto;opacity:.55}
.certs button{padding:18px;background:#f9f8f0;box-shadow:0 14px 28px #102e2012;border-color:#c9c6b1}.certs img{border:1px solid #dddccf}.certs h3{text-align:center}
body[data-page=contact],body[data-page=join]{background:#e4e9dc}body[data-page=contact] .page-title,body[data-page=join] .page-title{background:#234735}
body[data-page=contact] .page-mood,body[data-page=join] .page-mood{background-image:linear-gradient(90deg,#234735 15%,#23473577),url("./media-v23/reference-9199082340657-1.jpg");background-size:cover,60% auto}
body[data-page=contact] main>.prose,body[data-page=join] main>.prose{padding:45px;background:#fcfaf1;max-width:900px;position:relative;margin:45px auto;border-top:3px solid #b6a16d;box-shadow:0 20px 45px #18382412}
body[data-page=shipping],body[data-page=privacy]{background:#f0ede2}body[data-page=shipping] .page-title,body[data-page=privacy] .page-title{min-height:280px;background:#3c5040}
body[data-page=shipping] .page-mood,body[data-page=privacy] .page-mood{opacity:.25}
body[data-page=cart],body[data-page=checkout]{background:#edf0e6}body[data-page=cart] .page-title,body[data-page=checkout] .page-title{min-height:240px;background:#1c4332}
body[data-page=cart] .page-mood,body[data-page=checkout] .page-mood{background-size:cover,30% auto;opacity:.4}
body[data-page=product]{background:radial-gradient(ellipse at 15% 25%,#dce5d0 0,transparent 45%),#f3f0e5}
body[data-page=product] main>.section:first-child{padding-top:40px}.detail-photo{background:#e6e6d8;border:9px solid #fffcf3;box-shadow:0 20px 40px #172f2018}.thumbnails button{background:#fcfaf0}
body[data-page=product] .detail-info{background:#faf8efb8;padding:28px;border:1px solid #d3d6c5}.detail-info details p{font-size:.9rem}.related{background:#dfe6d4}
#footer{background:radial-gradient(ellipse at 15% 20%,#37523970,transparent 60%),#08291f}#footer .footer-grid>div:first-child>h3{font-family:var(--serif);font-size:2.3rem;text-transform:lowercase;letter-spacing:.01em;margin-bottom:20px}
@keyframes ambient-shift{from{transform:translate(-2%,-1%) scale(1)}to{transform:translate(3%,2%) scale(1.05)}}
@media(min-width:1450px){.hero-collage{height:640px}.atelier-hero{padding-inline:max(6%,calc((100% - 1450px)/2))}}
@media(max-width:1100px){.atelier-hero{min-height:650px;padding-inline:5%;grid-template-columns:46% 54%}.hero-collage{height:470px}.atelier-hero h1{font-size:3rem}.hero-links{gap:18px}.hero-baseline{margin-top:38px}.hero-frame>div{font-size:.65rem}.page-title-inner{max-width:75%}.hero-edition{font-size:.6rem}}
@media(max-width:780px){.atelier-hero{height:auto;max-height:none;min-height:900px;grid-template-columns:1fr;padding:55px 7% 80px;gap:35px}.atelier-hero:before{inset:13px}.atelier-hero .hero-content{text-align:left;max-width:none;padding:0}.atelier-hero h1,html[lang=th] .atelier-hero h1{font-size:2.65rem;max-width:100%;margin-bottom:20px}html[lang=zh] .atelier-hero h1{max-width:100%;font-size:2.6rem;line-height:1.45}.atelier-hero .hero-content .eyebrow{margin-bottom:18px;font-size:.7rem}.atelier-hero p{font-size:.95rem;margin-bottom:25px;max-width:100%}.hero-baseline{display:none}.hero-collage{height:420px;max-width:490px}.frame-main{width:75%;height:90%;right:0}.frame-secondary{width:37%;height:68%;left:0;bottom:0}.collage-caption{font-size:.6rem;right:0;bottom:-22px}.collage-caption b{font-size:.85rem}.hero-frame{padding:6px}.hero-frame>div{font-size:.65rem;padding:5px 2px}.hero-edition{display:none}.atelier-hero .hero-dots{left:8%;bottom:27px}.brand-ribbon{gap:15px;padding:16px 5%;font-size:.6rem;letter-spacing:.06em;flex-wrap:wrap}.brand-ribbon i{width:2px;height:2px}.occasion-section{padding-block:65px!important}.occasion-section .tile{min-height:300px;border-width:5px;box-shadow:7px 10px 0 #dedeca}.occasion-section .tile>div{padding:18px}.occasion-section .tile h3{font-size:1.4rem}.reference-collection:before{inset:9px}.page-title{min-height:285px;padding:40px 7%}.page-title-inner{max-width:90%}.page-title h1{font-size:2.45rem}.page-mood{background-size:cover,90% auto;opacity:.6}.page-title .eyebrow{font-size:.6rem;letter-spacing:.14em}
body[data-page=shop] .page-title{min-height:320px}body[data-page=story] .page-title{min-height:350px}
body[data-page=story] main>.split{margin:-15px 5% 0;border-width:7px}.split>img{min-height:0}.story-columns>div:first-child,.story-columns>div:last-child{padding:25px}.journal-section .article-grid article{border-right:0;border-bottom:1px solid #cbd0bd}
body[data-page=membership] .page-title{min-height:330px}body[data-page=membership] .cards{gap:25px}body[data-page=membership] .info-card:nth-child(2){transform:none}
body[data-page=contact] main>.prose,body[data-page=join] main>.prose{margin:25px 5%;padding:25px}
body[data-page=product] .detail-info{padding:23px}.detail-info{margin-top:10px}.detail-photo{border-width:6px}
body[data-page=brew] .page-mood,body[data-page=culture] .page-mood,body[data-page=contact] .page-mood,body[data-page=join] .page-mood{background-size:cover,90% auto}
body[data-page=home] .split{margin:15px 0 0}body[data-page=membership] .page-mood{background-size:cover,75% auto}
}
@media(max-width:390px){.hero-collage{height:360px}.atelier-hero{min-height:850px}.hero-links{gap:12px}.hero-links .button{padding:12px 19px}.hero-film-link{font-size:.8rem}}
@media(prefers-reduced-motion:reduce){.hero-haze{animation:none}.hero-frame{transition:none}}
