:root{--bg:#f9f7f4;--ink:#1a1814;--body:#57524b;--muted:#7a7570;--accent:#c8a96e;
--accent-dk:#a8874a;--accent-lt:#f3ecdd;--white:#fff;--border:#e6e0d8;--warn:#c0392b;--warn-bg:#fdf1ef;
--max:1240px;--r:2px}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--body);font:400 17px/1.65 'DM Sans',system-ui,sans-serif;
-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:var(--accent-dk)}
h1,h2,h3,h4{font-family:'Playfair Display',Georgia,serif;font-weight:400;color:var(--ink);line-height:1.15}
.wrap{max-width:var(--max);margin:0 auto;padding:0 clamp(1.1rem,4vw,2.5rem)}
.skip{position:absolute;left:-9999px}
.skip:focus{left:1rem;top:1rem;z-index:200;background:var(--ink);color:#fff;padding:.7rem 1rem}

/* nav */
.nav{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.94);
backdrop-filter:saturate(160%) blur(10px);border-bottom:1px solid var(--border)}
.nav-in{display:flex;align-items:center;gap:1.5rem;padding:.55rem 0;max-width:var(--max);
margin:0 auto;padding-left:clamp(1.1rem,4vw,2.5rem);padding-right:clamp(1.1rem,4vw,2.5rem)}
.nav-logo{flex:0 0 auto}.nav-logo img{height:42px;width:auto}
.nav-links{display:flex;gap:1.6rem;list-style:none;margin-left:auto;align-items:center}
.nav-links a{font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);
text-decoration:none;padding:.4rem 0;border-bottom:1px solid transparent}
.nav-links a:hover,.nav-links a[aria-current]{color:var(--ink);border-bottom-color:var(--accent)}
.nav-cta{background:var(--ink);color:#fff!important;padding:.62rem 1.1rem!important;border:0!important}
.nav-cta:hover{background:var(--accent-dk)}
.nav-tog{display:none;margin-left:auto;background:none;border:1px solid var(--border);
padding:.5rem .7rem;font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;color:var(--ink)}
@media(max-width:820px){.nav-tog{display:block}
.nav-links{display:none;position:absolute;left:0;right:0;top:100%;background:#fff;flex-direction:column;
gap:0;border-bottom:1px solid var(--border);padding:.4rem 0}
.nav-links.open{display:flex}
.nav-links li{width:100%}.nav-links a{display:block;padding:.85rem clamp(1.1rem,4vw,2.5rem)}
.nav-cta{margin:.5rem clamp(1.1rem,4vw,2.5rem) .7rem;text-align:center}}

/* hero */
.hero{padding:clamp(2.6rem,6vw,4.4rem) 0 clamp(2rem,4vw,3rem)}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
gap:clamp(2rem,5vw,4rem);align-items:center}
.eyebrow{font-size:.76rem;letter-spacing:.19em;text-transform:uppercase;color:var(--accent-dk);
font-weight:500;margin-bottom:1rem}
.hero h1{font-size:clamp(2.4rem,5.2vw,4.1rem);margin-bottom:1.1rem}
.hero h1 em{font-style:italic;color:var(--accent)}
.hero-sub{font-size:clamp(1rem,1.4vw,1.14rem);max-width:34em;margin-bottom:1.7rem}
.btns{display:flex;gap:.7rem;flex-wrap:wrap;margin-bottom:1.4rem}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:.92rem 1.6rem;
font:500 .8rem/1 'DM Sans',sans-serif;letter-spacing:.08em;text-transform:uppercase;
text-decoration:none;border:1px solid var(--ink);cursor:pointer;transition:.18s;border-radius:var(--r)}
.btn-p{background:var(--ink);color:#fff}
.btn-p:hover{background:var(--accent-dk);border-color:var(--accent-dk)}
.btn-s{background:transparent;color:var(--ink)}
.btn-s:hover{border-color:var(--accent);color:var(--accent-dk)}
.guarantee{display:inline-flex;align-items:center;gap:.4rem;flex-wrap:wrap;background:var(--accent-lt);
border:1px solid var(--accent);padding:.7rem 1.1rem;font-size:.88rem;color:var(--ink);border-radius:var(--r)}
.guarantee b{color:var(--accent-dk)}
.hero-art{display:grid;grid-template-columns:1fr 1fr;gap:.95rem}
.hero-art figure{margin:0;background:#fff;border:1px solid var(--border);overflow:hidden;
box-shadow:0 12px 40px rgba(26,24,20,.08);border-radius:var(--r)}
.hero-art figure:nth-child(1){transform:translateY(-14px)}
.hero-art figure:nth-child(4){transform:translateY(14px)}
.hero-art img{width:100%;height:auto;aspect-ratio:5/4;object-fit:contain;background:#faf8f5;padding:.35rem}
.hero-art figcaption{padding:.55rem .7rem;font-size:.67rem;letter-spacing:.07em;
text-transform:uppercase;color:var(--muted);border-top:1px solid var(--border)}
@media(max-width:900px){.hero-grid{grid-template-columns:1fr}
.hero-art figure:nth-child(n){transform:none}}

/* stats */
.stats{display:grid;grid-template-columns:repeat(4,1fr);background:#fff;
border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.stats div{padding:1.45rem 1.2rem;border-right:1px solid var(--border)}
.stats div:last-child{border-right:0}
.stats b{display:block;font:400 1.75rem/1 'Playfair Display',serif;color:var(--ink);margin-bottom:.3rem}
.stats span{font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
@media(max-width:760px){.stats{grid-template-columns:1fr 1fr}
.stats div:nth-child(2n){border-right:0}.stats div:nth-child(-n+2){border-bottom:1px solid var(--border)}}

/* sections */
.sec{padding:clamp(3rem,6vw,5rem) 0}
.sec-head{display:flex;align-items:baseline;gap:1.2rem;margin-bottom:2.2rem;flex-wrap:wrap}
.sec-num{font-size:.75rem;letter-spacing:.15em;text-transform:uppercase;color:var(--accent-dk);
white-space:nowrap;font-weight:500}
.sec-head h1,.sec-head h2{font-size:clamp(1.7rem,3vw,2.5rem)}
.sec-sub{max-width:60ch;margin:-1.4rem 0 2.2rem}

/* cards */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(268px,1fr));gap:1.4rem}
.card{background:#fff;border:1px solid var(--border);display:flex;flex-direction:column;
overflow:hidden;transition:.22s;border-radius:var(--r)}
.card:hover{box-shadow:0 12px 38px rgba(26,24,20,.10);transform:translateY(-3px);border-color:var(--accent)}
.card>a.card-img{display:block}
.card img{width:100%;height:auto;aspect-ratio:5/4;object-fit:contain;background:#faf8f5;padding:.5rem}
.card-body{padding:1.25rem;flex:1;display:flex;flex-direction:column}
.badge{display:inline-block;align-self:flex-start;font-size:.66rem;letter-spacing:.11em;
text-transform:uppercase;background:var(--accent-lt);color:var(--accent-dk);padding:.24rem .6rem;
margin-bottom:.8rem;border-radius:var(--r)}
.card h3{font-size:1.1rem;line-height:1.3;margin-bottom:.3rem}
.card h3 a{color:var(--ink);text-decoration:none}
.card h3 a:hover{color:var(--accent-dk)}
.card .tier{font-size:.82rem;color:var(--muted);margin-bottom:.9rem}
.chip{font-size:.72rem;color:var(--muted);background:#faf8f5;border:1px solid var(--border);
padding:.28rem .62rem;display:inline-block;margin-bottom:.9rem;border-radius:var(--r)}
.card-foot{margin-top:auto;padding-top:1rem;border-top:1px solid var(--border)}
.price-row{display:flex;align-items:baseline;gap:.45rem;margin-bottom:.85rem}
.price{font:400 1.95rem/1 'Playfair Display',serif;color:var(--ink)}
.price-lab{font-size:.7rem;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.card-btns{display:flex;gap:.55rem}
.card-btns .btn{flex:1;padding:.75rem .9rem;font-size:.74rem}
.note{font-size:.76rem;color:var(--warn);background:var(--warn-bg);border-left:3px solid var(--warn);
padding:.55rem .75rem;margin-bottom:.9rem;line-height:1.5}

/* article / detail */
.crumbs{font-size:.76rem;color:var(--muted);padding:1.1rem 0 0}
.crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:.4rem}
.crumbs li:not(:last-child)::after{content:"›";margin-left:.4rem;color:var(--border)}
.crumbs a{color:var(--muted);text-decoration:none}.crumbs a:hover{color:var(--accent-dk)}
.detail{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:clamp(2rem,4vw,3.4rem);
align-items:start;padding:1.6rem 0 clamp(3rem,6vw,5rem)}
@media(max-width:960px){.detail{grid-template-columns:1fr}}
.prose h1{font-size:clamp(2rem,4vw,3rem);margin-bottom:.9rem}
.prose h2{font-size:clamp(1.35rem,2.2vw,1.85rem);margin:2.4rem 0 .9rem}
.prose h3{font-size:1.12rem;margin:1.7rem 0 .5rem}
.prose p{margin-bottom:1.05rem}
.prose>p:first-of-type{font-size:1.1rem;color:var(--ink)}
.prose ul,.prose ol{margin:0 0 1.15rem 1.15rem}
.prose li{margin-bottom:.45rem}
.prose strong{color:var(--ink)}
.ladder{width:100%;border-collapse:collapse;margin:0 0 1.2rem;font-size:.95rem;background:#fff}
.ladder th,.ladder td{border:1px solid var(--border);padding:.7rem .85rem;text-align:left}
.ladder th{background:var(--accent-lt);color:var(--ink);font-weight:500;font-size:.8rem;
letter-spacing:.06em;text-transform:uppercase}
.callout{background:#fff;border:1px solid var(--border);border-left:3px solid var(--accent);
padding:1.1rem 1.25rem;margin:0 0 1.3rem;border-radius:var(--r)}
.callout p:last-child{margin-bottom:0}
details.faq{background:#fff;border:1px solid var(--border);margin-bottom:.6rem;border-radius:var(--r)}
details.faq summary{cursor:pointer;padding:.95rem 1.1rem;font-weight:500;color:var(--ink);
font-size:.98rem;list-style:none;display:flex;justify-content:space-between;gap:1rem;align-items:center}
details.faq summary::-webkit-details-marker{display:none}
details.faq summary::after{content:"+";color:var(--accent-dk);font-size:1.2rem;line-height:1}
details.faq[open] summary::after{content:"–"}
details.faq .faq-a{padding:0 1.1rem 1rem;font-size:.95rem}

/* buy box */
.buy{background:#fff;border:1px solid var(--border);padding:1.5rem;position:sticky;top:88px;border-radius:var(--r)}
.buy img{width:100%;height:auto;aspect-ratio:5/4;object-fit:contain;background:#faf8f5;border:1px solid var(--border);margin-bottom:1.1rem;padding:.5rem}
.buy .price{font-size:2.4rem;display:block;margin-bottom:.15rem}
.buy .price-lab{display:block;margin-bottom:1.1rem}
.buy .btn{width:100%;margin-bottom:.6rem}
.buy dl{margin-top:1.1rem;border-top:1px solid var(--border);padding-top:1rem;font-size:.85rem}
.buy dt{font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:.15rem}
.buy dd{margin-bottom:.75rem;color:var(--ink)}
.buy dd:last-child{margin-bottom:0}
@media(max-width:960px){.buy{position:static}}

/* blog */
.posts{display:grid;gap:1.3rem}
.post-item{background:#fff;border:1px solid var(--border);padding:1.5rem 1.6rem;border-radius:var(--r);transition:.2s}
.post-item:hover{border-color:var(--accent);box-shadow:0 10px 30px rgba(26,24,20,.07)}
.post-item h2{font-size:1.4rem;margin-bottom:.45rem}
.post-item h2 a{color:var(--ink);text-decoration:none}
.post-item h2 a:hover{color:var(--accent-dk)}
.meta{font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:.7rem}
.article{max-width:74ch;margin:0 auto;padding:1.4rem 0 clamp(3rem,6vw,5rem)}

/* misc */
.about-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.3rem;margin-top:2rem}
.about-card{background:#fff;border:1px solid var(--border);padding:1.4rem;border-radius:var(--r)}
.about-card b{display:block;font:400 1.5rem/1 'Playfair Display',serif;color:var(--accent);margin-bottom:.5rem}
.about-card h3{font-size:1rem;margin-bottom:.4rem}
.about-card p{font-size:.9rem;margin:0}
.band{background:var(--ink);color:#e8e3dc;text-align:center;padding:clamp(2.4rem,5vw,3.6rem) 0}
.band h2{color:#fff;font-size:clamp(1.5rem,2.6vw,2.1rem);margin-bottom:.7rem}
.band p{max-width:52ch;margin:0 auto 1.5rem;color:#c9c3ba}
.band .btn-p{background:var(--accent);border-color:var(--accent);color:var(--ink)}
.band .btn-p:hover{background:#fff;border-color:#fff}
.band .btn-s{color:#fff;border-color:#5c574f}
.band .btn-s:hover{border-color:#fff;color:#fff}
.contact-row{display:flex;gap:.7rem;justify-content:center;flex-wrap:wrap}
footer{background:#fff;border-top:1px solid var(--border);padding:2.6rem 0 2rem;font-size:.86rem}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:2rem;margin-bottom:2rem}
@media(max-width:720px){.foot-grid{grid-template-columns:1fr 1fr}}
.foot-grid h4{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);
margin-bottom:.8rem;font-family:'DM Sans',sans-serif;font-weight:500}
.foot-grid ul{list-style:none}.foot-grid li{margin-bottom:.5rem}
.foot-grid a{color:var(--body);text-decoration:none}.foot-grid a:hover{color:var(--accent-dk)}
.foot-logo img{height:38px;margin-bottom:.8rem}
.foot-bot{border-top:1px solid var(--border);padding-top:1.3rem;display:flex;
justify-content:space-between;gap:1rem;flex-wrap:wrap;color:var(--muted);font-size:.8rem}

@media(max-width:560px){.guarantee{display:block}.guarantee b{display:block;margin-bottom:.15rem}
.btns .btn{width:100%}}
.contact-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:2.2rem;align-items:start}
@media(max-width:860px){.contact-grid{grid-template-columns:1fr}}
.contact-card{background:#fff;border:1px solid var(--border);padding:1.6rem;border-radius:var(--r)}
.contact-card h3{font-size:1.25rem;margin-bottom:.7rem}
.contact-lines{display:flex;flex-direction:column;gap:.6rem;margin-top:1.2rem}
.contact-lines a{text-decoration:none;color:var(--ink);background:var(--accent-lt);
border:1px solid var(--accent);padding:.75rem 1rem;border-radius:var(--r);font-size:.95rem}
.contact-lines a:hover{background:var(--accent);color:#fff}
.pay-head{font-size:.72rem;letter-spacing:.13em;text-transform:uppercase;color:var(--muted);
font-family:'DM Sans',sans-serif;font-weight:500;margin-bottom:.9rem}
.pay-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem;align-items:start}
@media(max-width:520px){.pay-grid{grid-template-columns:1fr}}
.pay-card{background:#fff;border:1px solid var(--border);padding:1.2rem;border-radius:var(--r);font-size:.9rem}
.pay-card strong:first-child{display:block;font-size:1rem;color:var(--ink);margin-bottom:.6rem}
.pay-card p{margin-bottom:.6rem}
.pay-card img{width:100%;max-width:190px;height:auto;border:1px solid var(--border);margin-top:.5rem}
