@font-face{font-family:Inter;src:url(/fonts/inter-var-latin.woff2) format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"Playfair Display";src:url(/fonts/playfair-var-latin.woff2) format("woff2");font-weight:400 900;font-display:swap}
:root{--bg:#fbfaf8;--card:#fff;--ink:#16203a;--muted:#5b6478;--navy:#0e1830;--navy2:#1b2a4f;--acc:#b5122e;--acc2:#d62a44;--accd:#7f0b20;--gold:#d8a64a;--line:#e7e4de;
--sh1:0 1px 2px rgba(14,24,48,.06),0 2px 6px rgba(14,24,48,.06);--sh2:0 2px 4px rgba(14,24,48,.06),0 10px 24px rgba(14,24,48,.10),0 22px 48px rgba(14,24,48,.08);--r:14px}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;overflow-x:hidden;background:var(--bg);color:var(--ink);font:400 16.5px/1.65 Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}a{color:var(--acc);text-underline-offset:3px}a:hover{color:var(--accd)}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px;border-radius:6px}
.skip{position:absolute;left:-999px;top:0;background:#fff;color:var(--ink);padding:.5rem 1rem;z-index:99}.skip:focus{left:1rem;top:.5rem}
h1,h2{font-family:"Playfair Display",Georgia,serif;font-weight:700;line-height:1.15;letter-spacing:-.01em;color:var(--navy);text-shadow:0 1px 0 #fff,0 2px 6px rgba(14,24,48,.12)}
h1{font-size:clamp(1.9rem,4.6vw,3rem);margin:.2em 0 .4em}h2{font-size:clamp(1.35rem,2.6vw,1.9rem);margin:2.2rem 0 1rem}
h2::after{content:"";display:block;width:56px;height:3px;margin-top:.55rem;border-radius:3px;background:linear-gradient(90deg,var(--acc),var(--gold));box-shadow:0 1px 2px rgba(181,18,46,.35)}
.center h2::after,.center h1::after{margin-left:auto;margin-right:auto}
/* header */
.top{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.7rem clamp(1rem,3vw,2rem);background:rgba(14,24,48,.97);backdrop-filter:saturate(140%) blur(8px);transition:box-shadow .25s}
.top.scrolled{box-shadow:0 6px 24px rgba(0,0,0,.25)}
.brand{display:flex;align-items:center;gap:.6rem;color:#fff;text-decoration:none;font:700 1.2rem/1 "Playfair Display",Georgia,serif;letter-spacing:.01em;text-shadow:0 1px 2px rgba(0,0,0,.4)}.brand:hover{color:#fff}
.brand img{border-radius:50%;box-shadow:0 0 0 2px var(--gold),0 2px 6px rgba(0,0,0,.4)}
nav a{color:#e9ecf5;text-decoration:none;font-weight:500;font-size:.9rem;padding:.4rem .6rem;border-radius:8px;transition:background .2s,color .2s}nav a:hover{background:rgba(255,255,255,.1);color:#fff}
.wide{display:none}.menu{position:relative}.menu summary{list-style:none;cursor:pointer;color:#fff;font-weight:600;padding:.45rem .9rem;border-radius:999px;border:1px solid rgba(255,255,255,.3);background:linear-gradient(#24365f,#16223f);box-shadow:inset 0 1px 0 rgba(255,255,255,.15),0 2px 6px rgba(0,0,0,.3)}
.menu summary::-webkit-details-marker{display:none}.menu summary::before{content:"☰ "}.menu[open] summary::before{content:"✕ "}
.menu nav{position:absolute;right:0;top:calc(100% + .6rem);display:flex;flex-direction:column;min-width:230px;padding:.5rem;background:var(--navy);border-radius:12px;box-shadow:var(--sh2);animation:drop .18s ease-out}
.menu nav a{padding:.65rem .8rem}
@keyframes drop{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@media(min-width:1150px){.menu{display:none}.wide{display:flex;flex-wrap:wrap;gap:.1rem}}
main{max-width:1200px;margin:0 auto;padding:0 clamp(1rem,3vw,2rem) 2rem}
/* buttons */
.btn{position:relative;display:inline-block;margin:.25rem .3rem .25rem 0;padding:.8rem 1.5rem;border-radius:999px;font-weight:700;font-size:1rem;letter-spacing:.01em;text-decoration:none;color:#fff;
background:linear-gradient(180deg,var(--acc2) 0%,var(--acc) 55%,var(--accd) 100%);border:1px solid var(--accd);
box-shadow:inset 0 1px 0 rgba(255,255,255,.35),inset 0 -2px 0 rgba(0,0,0,.18),0 4px 0 #5e0817,0 8px 18px rgba(181,18,46,.30);text-shadow:0 1px 1px rgba(0,0,0,.35);transition:transform .12s,box-shadow .12s,filter .2s}
.btn:hover{color:#fff;filter:brightness(1.07);transform:translateY(-1px);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),inset 0 -2px 0 rgba(0,0,0,.18),0 5px 0 #5e0817,0 12px 24px rgba(181,18,46,.34)}
.btn:active{transform:translateY(3px);box-shadow:inset 0 2px 4px rgba(0,0,0,.25),0 1px 0 #5e0817,0 3px 8px rgba(181,18,46,.25)}
.btn.ghost{color:var(--navy);background:linear-gradient(180deg,#fff,#eef0f5);border:1px solid #cfd4df;text-shadow:none;box-shadow:inset 0 1px 0 #fff,0 4px 0 #c3c9d6,0 8px 16px rgba(14,24,48,.12)}
.btn.ghost:hover{color:var(--navy)}.btn.ghost:active{box-shadow:inset 0 2px 4px rgba(14,24,48,.15),0 1px 0 #c3c9d6}
/* hero */
.hero{margin:0 calc(50% - 50vw);padding:clamp(1.5rem,4vw,3rem) clamp(1rem,3vw,2rem) clamp(2rem,5vw,3.5rem);text-align:center;color:#e9ecf5;
background:radial-gradient(1200px 500px at 50% 0%,#2a3e6e 0%,rgba(42,62,110,0) 60%),linear-gradient(180deg,#0e1830,#14224a 70%,#0e1830);position:relative;overflow:hidden}
.hero::after{content:"";position:absolute;inset:auto 0 0 0;height:4px;background:linear-gradient(90deg,transparent,var(--gold),var(--acc),var(--gold),transparent)}
.hero-art{max-width:1040px;margin:0 auto}.hero-art img{border-radius:18px;box-shadow:0 0 0 1px rgba(216,166,74,.5),0 20px 50px rgba(0,0,0,.55),0 0 80px rgba(214,42,68,.18);animation:rise .8s ease-out both}
.hero-copy{max-width:760px;margin:1.6rem auto 0}.hero h1{color:#fff;text-shadow:0 2px 0 rgba(0,0,0,.25),0 6px 20px rgba(0,0,0,.45)}.hero .lede{font-size:1.08rem;color:#cfd5e4;margin:0 auto 1.3rem}
.hero .btn.ghost{color:#fff;background:linear-gradient(180deg,rgba(255,255,255,.16),rgba(255,255,255,.05));border-color:rgba(255,255,255,.4);box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 4px 0 rgba(0,0,0,.35),0 8px 18px rgba(0,0,0,.3)}
@keyframes rise{from{opacity:0;transform:translateY(14px) scale(.985)}to{opacity:1;transform:none}}
/* cards */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:1.1rem;margin:1rem 0 1.5rem}
.card{display:flex;flex-direction:column;background:var(--card);border-radius:var(--r);overflow:hidden;text-decoration:none;color:var(--ink);box-shadow:var(--sh1);border:1px solid var(--line);transition:transform .25s cubic-bezier(.2,.7,.3,1),box-shadow .25s}
.card picture{overflow:hidden;background:#f2f1ee}.card img{transition:transform .5s cubic-bezier(.2,.7,.3,1)}
.card span{padding:.7rem .85rem .85rem;font-weight:600;font-size:.92rem;line-height:1.35}
.card:hover,.card:focus-visible{transform:translateY(-5px);box-shadow:var(--sh2);color:var(--ink)}.card:hover img{transform:scale(1.06)}
.rail{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(200px,1fr);gap:1.1rem;overflow-x:auto;scroll-snap-type:x mandatory;padding:.4rem .2rem 1.2rem;scrollbar-width:thin}
.rail .card{scroll-snap-align:start}
@media(max-width:700px){.rail{grid-auto-columns:68%}}
/* tiles */
.itiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(42%,255px),1fr));gap:clamp(.7rem,2vw,1.1rem)}@media(max-width:600px){.itile strong{font-size:.98rem}.itile span{padding:.6rem .7rem .7rem}}
.itile{position:relative;display:flex;flex-direction:column;border-radius:var(--r);overflow:hidden;box-shadow:var(--sh2);text-decoration:none;transition:transform .25s,box-shadow .25s;background:#eee}
.itile img{width:100%;height:100%;object-fit:cover;transform:scale(1.18);transition:transform .6s cubic-bezier(.2,.7,.3,1)}
.itile span{display:block;flex:1;padding:.8rem 1rem .9rem;background:linear-gradient(180deg,#1b2a4f,#0e1830);color:#fff;border-top:3px solid var(--acc)}
.itile strong{display:block;font:700 1.12rem/1.2 "Playfair Display",Georgia,serif;text-shadow:0 2px 6px rgba(0,0,0,.5)}.itile em{font-style:normal;font-size:.82rem;color:#f2d79e;font-weight:600}
.itile:hover,.itile:focus-visible{transform:translateY(-5px)}.itile:hover img{transform:scale(1.28)}.itile picture{display:block;aspect-ratio:1/1;overflow:hidden;background:#f2f1ee}
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:1.1rem}
.tile{display:flex;flex-direction:column;gap:.35rem;padding:1.3rem 1.3rem 1.2rem;border-radius:var(--r);text-decoration:none;color:var(--ink);background:linear-gradient(160deg,#fff,#f6f3ee);border:1px solid var(--line);box-shadow:var(--sh1),inset 0 1px 0 #fff;transition:transform .25s,box-shadow .25s}
.tile strong{font:700 1.15rem/1.25 "Playfair Display",Georgia,serif;color:var(--navy)}.tile span{font-size:.9rem;color:var(--muted)}
.tile.gift{border-top:4px solid var(--acc)}.tile.gift span{color:var(--acc);font-weight:600}
.tile:hover,.tile:focus-visible{transform:translateY(-4px);box-shadow:var(--sh2);color:var(--ink)}
/* content */
.intro{max-width:780px;padding-top:1.5rem}.intro p{color:#2b3550}
.about{margin:2.6rem 0;padding:1.6rem clamp(1.2rem,3vw,2.2rem);border-radius:18px;background:linear-gradient(160deg,#fff 0%,#f7f3ec 100%);box-shadow:var(--sh2);border:1px solid var(--line);position:relative}
.about::before{content:"";position:absolute;left:0;top:18px;bottom:18px;width:4px;border-radius:4px;background:linear-gradient(var(--acc),var(--gold))}
.about h2{margin-top:.2rem}
.product{display:grid;gap:clamp(1.2rem,3vw,2.5rem);padding-top:1.6rem;align-items:start}@media(min-width:820px){.product{grid-template-columns:1.05fr 1fr}}
.pimg{border-radius:18px;overflow:hidden;box-shadow:var(--sh2);background:#fff;position:sticky;top:5rem}
.ptext{background:#fff;border-radius:18px;padding:clamp(1.1rem,3vw,1.8rem);box-shadow:var(--sh1);border:1px solid var(--line)}
.ptext h1{font-size:clamp(1.7rem,3.6vw,2.4rem)}.sub{font-style:italic;color:var(--muted);margin-top:-.4rem}.meta{font-size:.92rem;color:var(--muted);padding:.7rem .9rem;background:#f6f5f2;border-radius:10px}
@media(max-width:819px){.pimg{position:static}}
.post{max-width:720px;margin:0 auto;padding-top:1.5rem}.post p{font-size:1.04rem}
.posts{list-style:none;padding:0;display:grid;gap:.7rem}.posts li{background:#fff;border:1px solid var(--line);border-radius:12px;padding:.9rem 1.1rem;box-shadow:var(--sh1);transition:transform .2s,box-shadow .2s}.posts li:hover{transform:translateY(-3px);box-shadow:var(--sh2)}
.posts a{font-weight:700;text-decoration:none}
.faq{max-width:820px;display:grid;gap:.9rem}.faq h2{font-family:Inter,system-ui,sans-serif;font-size:1.06rem;font-weight:700;margin:0;text-shadow:none;color:var(--navy)}.faq h2::after{display:none}
.faq>h2+p{margin:-.2rem 0 0}
.faq-item{background:#fff;border:1px solid var(--line);border-radius:14px;padding:1rem 1.2rem;box-shadow:var(--sh1)}.faq-item p{margin:.4rem 0 0;color:#2b3550}
.small{font-size:.87rem;color:var(--muted)}.center{text-align:center}
footer{margin-top:3rem;padding:2.2rem 1rem;text-align:center;background:linear-gradient(180deg,#0e1830,#0a1226);color:#c9cfdd}
footer a{color:#fff;font-weight:600}footer a:hover{color:var(--gold)}footer .small{color:#97a0b5}
/* reveal */
.js .reveal{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.3,1)}.js .reveal.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.js .reveal{opacity:1;transform:none}}
