/* Lụa Trắng - template wed-01 (thietkeweb.dev). Mobile-first, no framework */
:root{--bg:#f6f1ea;--paper:#fffdf9;--ink:#1f1b18;--muted:#6f655b;--gold:#a88b5c;--gold-l:#e9dcc3;--line:#ddd2c2;--dark:#1a1613;--font:"Be Vietnam Pro",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;--head:"Playfair Display",Georgia,serif;--hh:68px}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--hh) + 8px);-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--font);font-weight:300;font-size:16px;line-height:1.7;color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased;overflow-x:clip}
body.lb-open{overflow:hidden}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3{margin:0;font-family:var(--head);font-weight:400;line-height:1.1;text-wrap:balance}
h2{font-size:clamp(32px,5vw,52px)}h3{font-size:22px}
em{font-style:italic;color:var(--gold)}
p{margin:0 0 1em}
ul,ol{margin:0;padding:0;list-style:none}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
[hidden]{display:none!important}
.container{width:100%;max-width:1220px;margin:0 auto;padding:0 20px}
.skip{position:absolute;left:-999px;top:0;z-index:999;background:var(--ink);color:#fff;padding:10px 16px}.skip:focus{left:10px;top:10px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:12px 30px;border:1px solid transparent;font-weight:500;font-size:13px;letter-spacing:.14em;text-transform:uppercase;cursor:pointer;transition:background .25s,color .25s,border-color .25s;line-height:1.2;text-align:center}
.btn--ink{background:var(--ink);color:#fff}.btn--ink:hover{background:var(--gold)}
.btn--line{border-color:var(--ink);color:var(--ink);background:transparent}.btn--line:hover{background:var(--ink);color:#fff}
.btn--gold{background:var(--gold);color:#fff}.btn--gold:hover{background:#fff;color:var(--ink)}
.btn--block{width:100%}
.eyebrow{display:block;font-size:12px;font-weight:500;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);margin:0 0 14px}
.header{position:sticky;top:0;z-index:50;background:rgba(246,241,234,.96);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.header__inner{display:flex;align-items:center;justify-content:space-between;height:var(--hh);gap:12px}
.logo{display:flex;flex-direction:column;align-items:flex-start;line-height:1;min-width:0}
.logo__t{font-family:var(--head);font-size:28px;font-style:italic;letter-spacing:.01em;color:var(--ink)}
.logo small{font-size:9.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--muted);margin-top:5px;white-space:nowrap}
.header__r{display:flex;align-items:center;gap:6px}.hdr-tel{display:none}
.burger{width:44px;height:44px;border:0;background:transparent;display:grid;place-content:center;gap:5px;cursor:pointer}
.burger span{display:block;width:22px;height:1.5px;background:var(--ink);transition:transform .3s,opacity .3s}
.menu-open .burger span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}.menu-open .burger span:nth-child(2){opacity:0}.menu-open .burger span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
.nav{position:absolute;top:100%;left:0;right:0;background:var(--bg);padding:6px 20px 24px;border-bottom:1px solid var(--line);opacity:0;transform:translateY(-8px);visibility:hidden;transition:opacity .25s,transform .25s,visibility .25s}
.menu-open .nav{opacity:1;transform:none;visibility:visible}
.nav li a{display:block;padding:15px 0;border-bottom:1px solid var(--line);font-size:13px;letter-spacing:.16em;text-transform:uppercase;font-weight:500}
.nav__cta{display:block;margin-top:16px;background:var(--ink);color:#fff;text-align:center;padding:14px;font-size:13px;letter-spacing:.14em;text-transform:uppercase}
@media(max-width:520px){.logo small{display:none}}
@media(min-width:980px){.header__inner{display:grid;grid-template-columns:1fr auto 1fr}.logo{align-items:center;grid-column:2;grid-row:1}.nav{grid-column:1;grid-row:1;position:static;opacity:1;transform:none;visibility:visible;background:none;border:0;padding:0;display:flex}.nav ul{display:flex;gap:30px}.nav li a{border:0;padding:6px 0;font-size:12px;position:relative}.nav li a::after{content:"";position:absolute;left:0;bottom:0;width:0;height:1px;background:var(--gold);transition:width .3s}.nav li a:hover::after{width:100%}.nav__cta{display:none}.header__r{grid-column:3;justify-self:end;gap:20px}.hdr-tel{display:inline-block;font-size:14px;letter-spacing:.06em;font-weight:500;border-bottom:1px solid var(--gold);padding-bottom:2px}.burger{display:none}}
.section{padding:76px 0}.section--dark{background:var(--dark);color:#f1e9dc}.section--ivory{background:var(--paper)}
.head{display:flex;flex-direction:column;gap:18px;margin-bottom:34px}
@media(min-width:800px){.head{flex-direction:row;justify-content:space-between;align-items:end}}
.head--c,.head.head--c{flex-direction:column;align-items:center;text-align:center}.head--c h2{max-width:720px}.head__p{color:#c9bca8;margin:0}
.more{font-size:12px;letter-spacing:.18em;text-transform:uppercase;font-weight:500;border-bottom:1px solid var(--gold);padding-bottom:3px;align-self:flex-start}
@media(min-width:800px){.more{align-self:auto}}
/* hero */
.hero{padding:28px 0 56px}
.hero__grid{display:grid;gap:22px}
.hero h1{font-size:clamp(52px,12vw,112px);line-height:.98;letter-spacing:-.01em;margin-bottom:20px}.hero h1 em{display:block}
.hero__lead{font-size:17px;color:var(--muted);max-width:440px}
.hero__btns{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0}
.hero__n{display:flex;flex-wrap:wrap;gap:12px 30px;border-top:1px solid var(--line);padding-top:18px;font-size:13px;color:var(--muted)}.hero__n b{display:block;font-family:var(--head);font-size:30px;color:var(--ink);font-weight:400;line-height:1.1}
figure{margin:0}
.hero__main{position:relative}.hero__main img{width:100%;aspect-ratio:4/5;object-fit:cover}
.hero figcaption{font-size:12px;letter-spacing:.1em;color:var(--muted);margin-top:8px}
.hero__side{display:grid;grid-template-columns:1fr 1fr;gap:14px}.hero__side img{width:100%;aspect-ratio:3/4;object-fit:cover}
@media(min-width:900px){.hero{padding:44px 0 80px}.hero__grid{grid-template-columns:1.05fr 1.1fr .7fr;gap:28px;align-items:start}.hero__txt{padding-top:30px;grid-column:1}.hero__main{grid-column:2}.hero__side{grid-column:3;grid-template-columns:1fr;margin-top:90px}.hero h1{font-size:clamp(56px,6vw,96px)}.hero__n{margin-top:40px}}
/* album */
.chips{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;flex-wrap:wrap}
.chips button{border:1px solid var(--line);background:transparent;padding:9px 20px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;cursor:pointer;font-weight:500;transition:all .2s}.chips button.is-on,.chips button:hover{background:var(--ink);color:#fff;border-color:var(--ink)}
.mason{columns:2;column-gap:12px}
.tile{break-inside:avoid;margin:0 0 12px;position:relative;overflow:hidden}
.tile__b{display:block;width:100%;padding:0;border:0;background:var(--line);cursor:zoom-in}
.tile img{width:100%;height:auto;transition:transform .6s}.tile:hover img{transform:scale(1.04)}
.tile figcaption{position:absolute;left:0;right:0;bottom:0;padding:26px 12px 10px;background:linear-gradient(transparent,rgba(20,15,10,.7));color:#fff;font-size:12.5px;display:flex;flex-direction:column;opacity:0;transition:opacity .3s;pointer-events:none}.tile:hover figcaption,.tile:focus-within figcaption{opacity:1}.tile figcaption em{font-size:11px;color:var(--gold-l);letter-spacing:.14em;text-transform:uppercase;font-style:normal}
@media(hover:none){.tile figcaption{opacity:1;padding:18px 8px 6px;font-size:11px}.tile figcaption em{display:none}}
@media(min-width:800px){.mason{columns:3;column-gap:16px}.tile{margin-bottom:16px}}
/* packages */
.pks{border-top:1px solid #3a322b}
.pk{display:grid;grid-template-columns:78px 1fr;gap:6px 16px;padding:22px 0;border-bottom:1px solid #3a322b;align-items:center;transition:background .3s,padding .3s}
.pk:hover{background:rgba(255,255,255,.04)}
.pk__n{display:none;font-family:var(--head);font-size:34px;color:var(--gold)}
.pk__img{grid-row:1/3}.pk__img img{width:78px;height:98px;object-fit:cover}
.pk__t b{display:block;font-family:var(--head);font-size:24px;font-weight:400;line-height:1.15}.pk__t small{display:block;color:#c9bca8;font-size:14px}.pk__t em{display:none;color:#a79a87;font-size:13.5px;margin-top:6px;font-style:normal}
.pk__p{font-family:var(--head);font-size:22px;color:var(--gold-l);display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}.pk__p small{font-family:var(--font);font-size:12px;color:#a79a87}.pk__p i{font-family:var(--font);font-style:normal;font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;margin-left:auto;border-bottom:1px solid var(--gold);padding-bottom:2px}
@media(min-width:800px){.pk{grid-template-columns:56px 110px 1fr auto;gap:28px;padding:26px 8px}.pk:hover{padding-left:18px}.pk__n{display:block}.pk__img{grid-row:auto}.pk__img img{width:110px;height:138px}.pk__t b{font-size:32px}.pk__t em{display:block}.pk__p{flex-direction:column;align-items:flex-end;gap:2px;font-size:26px}.pk__p i{margin:8px 0 0}}
/* gowns */
.hs{overflow-x:auto;scroll-snap-type:x mandatory;padding:0 20px 14px;scrollbar-width:thin}
.hs__in{display:flex;gap:14px;width:max-content;margin:0 auto}
.gw{flex:none;width:min(66vw,280px);scroll-snap-align:start;display:block}.gw img{width:100%;aspect-ratio:3/4;object-fit:cover;transition:opacity .3s}.gw:hover img{opacity:.88}.gw span{display:block;font-family:var(--head);font-size:20px;margin-top:10px;line-height:1.2}.gw small{display:block;font-family:var(--font);font-size:13px;color:var(--muted);margin-top:2px}
@media(min-width:1100px){.hs{overflow:visible;padding:0}.hs__in{width:auto;max-width:1220px;padding:0 20px;gap:16px}.gw{width:auto;flex:1}}
/* flow */
.flow{display:grid;gap:30px;align-items:center}
@media(min-width:900px){.flow{grid-template-columns:1fr 1fr;gap:70px}}
.flow__ph img{width:100%;aspect-ratio:10/7;object-fit:cover}.flow figcaption{font-size:12px;letter-spacing:.1em;color:var(--muted);margin-top:8px}
.steps{margin-top:26px;counter-reset:n}.steps li{display:grid;grid-template-columns:62px 1fr;gap:12px;padding:16px 0;border-top:1px solid var(--line)}.steps b{font-family:var(--head);font-weight:400;font-size:36px;color:var(--gold);line-height:1}.steps h3{margin-bottom:2px}.steps p{margin:0;color:var(--muted);font-size:15px}
/* team */
.team__g{display:grid;gap:30px;align-items:center}
@media(min-width:900px){.team__g{grid-template-columns:1.1fr .9fr;gap:70px}}
.team blockquote{margin:22px 0;padding-left:20px;border-left:2px solid var(--gold);font-family:var(--head);font-style:italic;font-size:clamp(22px,3vw,30px);line-height:1.3}.team cite{display:block;font-family:var(--font);font-style:normal;font-size:13px;color:var(--muted);margin-top:10px;letter-spacing:.04em}
.team figure img{width:100%;max-width:440px;aspect-ratio:3/4;object-fit:cover;margin-left:auto}
/* book */
.book{position:relative;color:#fff;background:var(--dark);overflow:hidden}
.book__bg{position:absolute;inset:0}.book__bg img{width:100%;height:100%;object-fit:cover;opacity:.35}
.book__in{position:relative;display:grid;gap:28px;padding-top:76px;padding-bottom:76px;align-items:center}
@media(min-width:900px){.book__in{grid-template-columns:1fr 1fr;gap:70px}}
.book h2{margin-bottom:14px}.book__txt p{color:#e4d8c6}
.book .form{background:rgba(255,253,249,.96);color:var(--ink);padding:24px;display:grid;gap:12px}
.field label{display:block;font-weight:500;font-size:12px;margin-bottom:4px;color:var(--muted);letter-spacing:.1em;text-transform:uppercase}
.field input,.field select,.field textarea{width:100%;border:1px solid var(--line);padding:12px 14px;background:#fff;font-size:16px;border-radius:0}
.field input[aria-invalid=true]{border-color:#b3392b}.err{display:block;color:#b3392b;font-size:12.5px}
.row2{display:grid;gap:12px}@media(min-width:520px){.row2{grid-template-columns:1fr 1fr}}
.seg2{display:flex;gap:8px}.seg2 label{flex:1;cursor:pointer}.seg2 input{position:absolute;opacity:0}.seg2 span{display:block;text-align:center;border:1px solid var(--line);padding:11px;font-size:14px}.seg2 input:checked+span{background:var(--ink);color:#fff;border-color:var(--ink)}.seg2 input:focus-visible+span{outline:2px solid var(--gold);outline-offset:2px}
.form__ok{background:#ece4d2;color:#4a3d22;padding:12px 14px;font-size:14.5px}
/* faq */
.faq{display:grid;gap:26px}@media(min-width:900px){.faq{grid-template-columns:.8fr 1.2fr;gap:70px}}
.faq details{border-top:1px solid var(--line)}.faq details:last-child,.acc details:last-child{border-bottom:1px solid var(--line)}
summary{list-style:none;cursor:pointer;padding:18px 36px 18px 0;font-family:var(--head);font-size:20px;position:relative}summary::-webkit-details-marker{display:none}
summary::after{content:"+";position:absolute;right:4px;top:50%;transform:translateY(-50%);font-family:var(--font);font-size:24px;color:var(--gold);font-weight:300}details[open] summary::after{content:"\2212"}
details p,details ul,details ol{padding:0 0 18px;color:var(--muted);margin:0}details ul,details ol{padding-left:20px}details ul{list-style:disc}details ol{list-style:decimal}details li{margin-bottom:4px}
/* footer */
.footer{background:var(--dark);color:#d8ccb9;padding:60px 0 26px}
.footer__big{font-family:var(--head);font-style:italic;font-size:clamp(38px,7vw,76px);line-height:1.05;margin:0 0 38px;color:#f1e9dc}
.footer__grid{display:grid;gap:26px}@media(min-width:800px){.footer__grid{grid-template-columns:1.4fr 1fr 1.2fr}}
.footer h3{font-family:var(--font);font-size:12px;letter-spacing:.2em;text-transform:uppercase;margin-bottom:12px;color:var(--gold);font-weight:500}.footer li{margin-bottom:8px;font-size:15px}.footer p{font-size:15px}.footer a:hover{color:var(--gold-l)}
.footer .logo__t--ft{font-family:var(--head);font-size:28px;font-style:italic;color:#f1e9dc;margin-bottom:8px}
.footer__bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px;border-top:1px solid #3a322b;margin-top:34px;padding-top:18px;font-size:13px;color:#a79a87}.footer__bottom p{margin:0}
/* lightbox */
.lb{position:fixed;inset:0;z-index:90;background:rgba(15,11,8,.94);display:flex;align-items:center;justify-content:center;padding:56px 12px 24px}
.lb figure{max-width:min(92vw,900px);text-align:center;color:#f1e9dc}.lb img{max-height:78vh;width:auto;max-width:100%;margin:0 auto}.lb figcaption{margin-top:10px;font-size:14px}
.lb button{position:absolute;border:0;background:transparent;color:#fff;font-size:44px;line-height:1;cursor:pointer;width:52px;height:52px}
.lb__x{top:8px;right:8px}.lb__p{left:4px;top:50%}.lb__n{right:4px;top:50%}
/* detail */
.sp{padding:22px 0 56px}
.bc{font-size:12.5px;color:var(--muted);margin:0 0 20px;display:flex;flex-wrap:wrap;gap:8px;letter-spacing:.04em}.bc a{color:var(--ink);border-bottom:1px solid var(--gold)}
.sp__grid{display:grid;gap:30px}.sp__grid>*{min-width:0}@media(min-width:900px){.sp__grid{grid-template-columns:1fr 1fr;gap:64px;align-items:start}.gal{position:sticky;top:calc(var(--hh) + 20px)}}
.gal__main{aspect-ratio:3/4;overflow:hidden;background:var(--line);max-width:560px}.gal__main img{width:100%;height:100%;object-fit:cover}
.gal__th{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:8px;max-width:560px}.gal__th button{padding:0;border:1px solid transparent;background:none;aspect-ratio:1/1;cursor:pointer;overflow:hidden;opacity:.6}.gal__th button.is-on{border-color:var(--ink);opacity:1}.gal__th img{width:100%;height:100%;object-fit:cover}
.sp h1{font-size:clamp(40px,6vw,64px);margin-bottom:6px}.sp__code{font-size:13px;color:var(--muted);margin:0 0 6px}
.sp__price{margin:10px 0 14px;display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}.sp__price b{font-family:var(--head);font-weight:400;font-size:42px;line-height:1.1}.sp__price small{color:var(--muted);font-size:13px}
.sp__lead{color:var(--muted)}
.opt{border:0;padding:0;margin:0 0 16px;min-width:0}.opt legend{font-size:12px;letter-spacing:.16em;text-transform:uppercase;font-weight:500;color:var(--muted);padding:0;margin-bottom:8px}
.seg{display:flex;flex-wrap:wrap;gap:8px}.seg label{cursor:pointer}.seg input{position:absolute;opacity:0}.seg span{display:flex;flex-direction:column;border:1px solid var(--line);padding:9px 16px;font-size:14.5px;font-weight:500;background:#fff;line-height:1.3}.seg small{font-size:11.5px;color:var(--muted);font-weight:300}.seg input:checked+span{background:var(--ink);color:#fff;border-color:var(--ink)}.seg input:checked+span small{color:var(--gold-l)}.seg input:focus-visible+span{outline:2px solid var(--gold);outline-offset:2px}
.order{display:grid;gap:12px;margin:22px 0 12px;background:var(--paper);border:1px solid var(--line);padding:20px}.order h2{font-size:26px}
.sp__btns{display:flex;flex-wrap:wrap;gap:8px}.sp__btns .btn{flex:1 1 140px}
.acc{margin-top:48px;max-width:820px}.acc details{border-top:1px solid var(--line)}
.h2s{font-size:36px;margin:48px 0 18px}
.rel{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}@media(min-width:900px){.rel{grid-template-columns:repeat(4,1fr)}}.rel a{display:block}.rel img{width:100%;aspect-ratio:4/5;object-fit:cover}.rel span{display:block;font-family:var(--head);font-size:19px;margin-top:8px;line-height:1.2}.rel small{display:block;font-family:var(--font);font-size:13px;color:var(--muted)}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}}