:root{
  --accent:#24678d; --accent-soft:#3c85ad; --gold:#c9a24b;
  --bg:#faf9f6; --surface:#ffffff; --surface-2:#f1efe9;
  --ink:#26282b; --ink-soft:#5c6166; --line:#e4e1d8;
  --nav-bg:rgba(250,249,246,.92);
  --shadow:0 14px 40px -18px rgba(38,40,43,.25);
}
[data-theme="dark"]{
  --accent:#6db3d6; --accent-soft:#8ec7e4; --gold:#d9b866;
  --bg:#101315; --surface:#181c1f; --surface-2:#1f2428;
  --ink:#e9e7e2; --ink-soft:#a3a8ad; --line:#2a3034;
  --nav-bg:rgba(16,19,21,.92);
  --shadow:0 14px 40px -18px rgba(0,0,0,.7);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Josefin Slab',Georgia,serif;background:var(--bg);color:var(--ink);
  font-size:19px;line-height:1.65;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:var(--accent);text-decoration:none}
a:hover{color:var(--accent-soft)}
h1,h2,h3{font-family:'Quicksand',sans-serif;font-weight:600;line-height:1.2}

/* header */
.site-head{position:sticky;top:0;z-index:50;background:var(--nav-bg);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line)}
.head-in{max-width:1100px;margin:0 auto;padding:14px 20px;display:flex;align-items:center;gap:18px}
.brand{font-family:'Josefin Slab',serif;font-weight:700;font-size:1.7rem;letter-spacing:.04em;color:var(--ink)}
.brand:hover{color:var(--accent)}
nav.main{margin-left:auto;display:flex;align-items:center;gap:4px}
nav.main > div, nav.main > a{position:relative}
nav.main a.top{display:block;padding:8px 12px;font-family:'Quicksand',sans-serif;font-size:.92rem;
  letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft);border-radius:8px}
nav.main a.top:hover{color:var(--accent);background:var(--surface-2)}
nav.main a.top.active{color:var(--accent);font-weight:700}
.dd{position:relative}
.dd-menu{position:absolute;top:100%;left:0;min-width:250px;background:var(--surface);
  border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);padding:8px;
  display:none;z-index:60}
.dd:hover .dd-menu,.dd:focus-within .dd-menu{display:block}
.dd-menu a{display:block;padding:8px 12px;border-radius:8px;font-family:'Quicksand',sans-serif;
  font-size:.9rem;color:var(--ink-soft)}
.dd-menu a:hover{background:var(--surface-2);color:var(--accent)}
.head-icons{display:flex;align-items:center;gap:8px}
.head-icons a,.theme-toggle{display:flex;align-items:center;justify-content:center;width:38px;height:38px;
  border-radius:50%;border:1px solid var(--line);background:var(--surface);color:var(--ink-soft);
  cursor:pointer;font-size:1rem}
.head-icons a:hover,.theme-toggle:hover{color:var(--accent);border-color:var(--accent)}
.burger{display:none}
@media(max-width:920px){
  nav.main{display:none;position:absolute;top:100%;left:0;right:0;background:var(--nav-bg);
    backdrop-filter:blur(10px);border-bottom:1px solid var(--line);flex-direction:column;
    align-items:stretch;padding:10px 16px 18px;gap:0}
  nav.main.open{display:flex}
  .dd-menu{position:static;display:block;border:0;box-shadow:none;background:transparent;padding:0 0 0 18px}
  .burger{display:flex}
}

/* layout */
main{max-width:1100px;margin:0 auto;padding:40px 20px 70px}
.page-title{font-size:clamp(1.7rem,4vw,2.5rem);margin-bottom:6px}
.page-sub{color:var(--ink-soft);font-size:1.05rem;margin-bottom:28px}
.rule{width:64px;height:3px;background:var(--gold);border-radius:2px;margin:14px 0 30px}

/* hero (home) */
.hero{text-align:center;padding:34px 0 10px}
.hero h1{font-family:'Josefin Slab',serif;font-weight:700;font-size:clamp(2.4rem,7vw,4.2rem);letter-spacing:.05em}
.hero p{color:var(--ink-soft);font-family:'Quicksand',sans-serif;letter-spacing:.14em;
  text-transform:uppercase;font-size:.95rem;margin-top:10px}
.hero .rule{margin:26px auto 36px}

/* gallery */
.gallery{columns:3 280px;column-gap:16px}
.g-item{break-inside:avoid;margin-bottom:16px;background:var(--surface);border:1px solid var(--line);
  border-radius:12px;overflow:hidden;box-shadow:var(--shadow);cursor:zoom-in;
  transition:transform .18s ease}
.g-item:hover{transform:translateY(-3px)}
.g-item img{width:100%;height:auto}
.g-item figcaption{padding:9px 13px;font-size:.9rem;color:var(--ink-soft);
  font-family:'Quicksand',sans-serif}
/* lightbox */
.lb{position:fixed;inset:0;background:rgba(8,10,12,.93);display:none;z-index:100;
  align-items:center;justify-content:center;flex-direction:column;padding:30px}
.lb.open{display:flex}
.lb img{max-width:92vw;max-height:82vh;width:auto;box-shadow:0 30px 90px rgba(0,0,0,.6);border-radius:6px}
.lb .lb-cap{color:#cfd4d8;margin-top:14px;font-family:'Quicksand',sans-serif;font-size:.95rem;text-align:center}
.lb button{position:absolute;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.2);
  color:#fff;border-radius:50%;width:46px;height:46px;font-size:1.2rem;cursor:pointer}
.lb button:hover{background:rgba(255,255,255,.2)}
.lb .lb-close{top:18px;right:18px}
.lb .lb-prev{left:14px;top:50%;transform:translateY(-50%)}
.lb .lb-next{right:14px;top:50%;transform:translateY(-50%)}

/* collections index */
.col-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:18px}
.col-card{background:var(--surface);border:1px solid var(--line);border-radius:14px;overflow:hidden;
  box-shadow:var(--shadow);transition:transform .18s ease;display:flex;flex-direction:column}
.col-card:hover{transform:translateY(-4px)}
.col-card .thumb{aspect-ratio:4/3;overflow:hidden}
.col-card .thumb img{width:100%;height:100%;object-fit:cover}
.col-card h3{padding:14px 16px;font-size:1.02rem;color:var(--ink)}
.col-card:hover h3{color:var(--accent)}

/* gallery page layout with side list */
.g-wrap{display:grid;grid-template-columns:210px 1fr;gap:36px}
@media(max-width:820px){.g-wrap{grid-template-columns:1fr}}
.side-list{font-family:'Quicksand',sans-serif;font-size:.95rem;position:sticky;top:90px;align-self:start}
.side-list h3{font-size:.85rem;text-transform:uppercase;letter-spacing:.12em;color:var(--ink-soft);margin-bottom:12px}
.side-list a{display:block;padding:6px 0;color:var(--ink-soft);border-bottom:1px solid var(--line)}
.side-list a:hover,.side-list a.here{color:var(--accent)}
@media(max-width:820px){.side-list{position:static;margin-bottom:8px}}

/* prose */
.prose p{margin-bottom:1.1em}
.prose ol,.prose ul{margin:0 0 1.1em 1.4em}
.prose li{margin-bottom:.5em}
.about-grid{display:grid;grid-template-columns:minmax(260px,420px) 1fr;gap:36px;align-items:start}
@media(max-width:820px){.about-grid{grid-template-columns:1fr}}
.about-grid img{border-radius:14px;box-shadow:var(--shadow);border:1px solid var(--line)}

/* banner */
.banner{max-height:340px;overflow:hidden;border-radius:16px;margin-bottom:36px;
  border:1px solid var(--line);box-shadow:var(--shadow)}
.banner img{width:100%;height:100%;object-fit:cover}

/* store / contact cards */
.card{background:var(--surface);border:1px solid var(--line);border-radius:16px;
  box-shadow:var(--shadow);padding:34px}
.btn{display:inline-block;font-family:'Quicksand',sans-serif;font-weight:700;letter-spacing:.05em;
  background:var(--accent);color:#fff !important;padding:13px 26px;border-radius:999px;margin-top:8px}
.btn:hover{background:var(--accent-soft)}
[data-theme="dark"] .btn{color:#0e1315 !important}

/* blog */
.blog-wrap{display:grid;grid-template-columns:1fr 240px;gap:44px}
@media(max-width:860px){.blog-wrap{grid-template-columns:1fr}}
article.post{border-bottom:1px solid var(--line);padding-bottom:38px;margin-bottom:38px}
article.post:last-of-type{border-bottom:0}
article.post h2{font-size:1.55rem;margin-bottom:4px}
article.post h2 a{color:var(--ink)}
article.post h2 a:hover{color:var(--accent)}
.post-date{font-family:'Quicksand',sans-serif;font-size:.85rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--ink-soft);margin-bottom:18px}
article.post img{border-radius:12px;border:1px solid var(--line);box-shadow:var(--shadow);
  margin:18px auto}
.blog-side h3{font-size:1.2rem}
.blog-side p{color:var(--ink-soft);font-size:.98rem}
.blog-side .blk{margin-bottom:26px}
.blog-side h4{font-family:'Quicksand',sans-serif;font-size:.82rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--ink-soft);margin-bottom:8px}

/* footer */
footer{border-top:1px solid var(--line);background:var(--surface)}
.foot-in{max-width:1100px;margin:0 auto;padding:34px 20px;display:flex;flex-wrap:wrap;
  gap:18px;align-items:center;justify-content:space-between;color:var(--ink-soft);
  font-family:'Quicksand',sans-serif;font-size:.9rem}
.foot-in .fbrand{font-family:'Josefin Slab',serif;font-weight:700;font-size:1.2rem;color:var(--ink)}
.foot-links{display:flex;gap:16px;flex-wrap:wrap}
.foot-links a{color:var(--ink-soft)}
.foot-links a:hover{color:var(--accent)}