﻿/* ============================================================
   RYGLEVA STUDIO - Make it yours. Make it uncommon.
   Brand palette: Deep base #17121A - Warm paper #F4E1C4
   Dragon emerald #0B8A6E - Burnt gold #B8893F
   Ember coral #D7654B - Deep brown #33231B
   ============================================================ */

:root{
  --ink:#17121A;
  --ink-2:#1d1721;
  --ink-3:#241c29;
  --paper:#F4E1C4;
  --paper-soft:#efe3d0;
  --emerald:#0B8A6E;
  --emerald-deep:#0e372d;
  --emerald-card:#12433a;
  --gold:#B8893F;
  --gold-soft:#d3a960;
  --gold-btn:#d9a95f;
  --coral:#D7654B;
  --coral-card:#c2604a;
  --brown:#33231B;
  --line:rgba(244,225,196,.14);
  --line-gold:rgba(184,137,63,.45);
  --serif:"Playfair Display", Georgia, serif;
  --brandserif:"Cinzel", "Playfair Display", serif;
  --sans:"Montserrat", "Segoe UI", sans-serif;
  --img-rez: url("../img/head1.webp");
  --img-landing: url("../img/lan_1.webp");
  --img-lan-1: url("../img/lan_1.webp");
  --img-head-1: url("../img/head1.webp");
  --img-shop: url("../img/shop-header.webp");
  --img-mock-mug: url("../img/puodelis_1.webp");
  --img-mock-hoodie: url("../img/h1.webp");
  --img-logo: url("../img/logo.svg");
  --img-work-1: url("../img/work_1.webp");
  --img-puodelis-1: url("../img/puodelis_1.webp");
  --img-h1: url("../img/h1.webp");
  --img-p1: url("../img/p1.webp");
  --img-t1: url("../img/t1.webp");
  --img-pt1: url("../img/pt1.webp");
  --img-f1: url("../img/f1.webp");
  --img-group-apparel: url("../img/prod-groups/apparel-workwear.webp");
  --img-group-drinkware: url("../img/prod-groups/drinkware.webp");
  --img-group-bags: url("../img/prod-groups/bags-carry.webp");
  --img-group-prints: url("../img/prod-groups/wall-desk-prints.webp");
  --img-group-business: url("../img/prod-groups/business-branding.webp");
  --img-group-personal: url("../img/prod-groups/personal-gifts.webp");
  --img-group-sets: url("../img/prod-groups/gift-boxes.webp");
  --img-group-small: url("../img/prod-groups/small-custom.webp");
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:var(--sans);
  background:var(--ink);
  color:var(--paper);
  font-size:15px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font-family:var(--sans);cursor:pointer}
.wrap{max-width:1280px;margin:0 auto;padding:0 40px}
.hp-field{
  position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;
  overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap!important;
}
.skip-link{
  position:fixed;left:18px;top:12px;z-index:999;
  background:var(--paper);color:var(--ink);padding:10px 14px;border-radius:4px;
  font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  transform:translateY(-140%);transition:transform .2s ease;
}
.skip-link:focus{transform:translateY(0);outline:2px solid var(--gold)}

/* ------------------------------------------------ header */
.site-header{
  position:sticky;top:0;z-index:50;
  background:rgba(23,18,26,.94);
  backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(244,225,196,.06);
}
.header-in{
  max-width:1360px;margin:0 auto;padding:14px 40px;
  display:flex;align-items:center;justify-content:space-between;gap:24px;
}
.logo{display:flex;align-items:center;gap:14px}
.logo-mark{
  width:52px;height:52px;flex:0 0 52px;
  background-image:url("../img/logo.svg");
  background-size:contain;
  background-position:center;
  background-repeat:no-repeat;
}
.logo-text{display:flex;flex-direction:column;line-height:1.1}
.logo-name{
  font-family:var(--brandserif);
  font-size:21px;letter-spacing:.28em;color:var(--paper);
}
.logo-sub{
  font-family:var(--sans);font-size:9px;letter-spacing:.55em;
  color:var(--gold-soft);text-transform:uppercase;margin-top:4px;
  display:flex;align-items:center;gap:8px;
}
.logo-sub::before,.logo-sub::after{
  content:"";height:1px;width:16px;background:var(--gold);opacity:.7;
}
.main-nav{display:flex;gap:38px;align-items:center}
.main-nav a{
  font-size:12.5px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;
  color:var(--paper);opacity:.85;padding:6px 0;position:relative;
  transition:opacity .2s;
}
.main-nav a:hover{opacity:1}
.main-nav a.active{opacity:1}
.main-nav a.active::after{
  content:"";position:absolute;left:0;right:0;bottom:-4px;height:2px;
  background:var(--gold);
}
.header-icons{display:flex;align-items:center;gap:20px}
.hicon{
  background:none;border:none;color:var(--paper);opacity:.85;
  display:flex;align-items:center;gap:7px;position:relative;
  font-size:12px;letter-spacing:.1em;
}
.hicon:hover{opacity:1;color:var(--gold-soft)}
.hicon svg{width:21px;height:21px;stroke:currentColor;fill:none;stroke-width:1.5}
.cart-badge{
  position:absolute;top:-7px;right:-9px;min-width:16px;height:16px;
  background:var(--gold);color:var(--ink);border-radius:50%;
  font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center;
  padding:0 4px;
}
.cart-badge.empty{display:none}

/* search bar */
.search-bar{
  display:none;border-top:1px solid var(--line);
  background:var(--ink-2);
}
.search-bar.open{display:block}
.search-bar .wrap{display:flex;gap:12px;padding-top:14px;padding-bottom:14px;align-items:flex-start}
.search-shell{position:relative;flex:1;min-width:0}
.search-bar input{
  width:100%;background:transparent;border:1px solid var(--line-gold);
  color:var(--paper);padding:10px 16px;font-family:var(--sans);font-size:14px;
  border-radius:3px;outline:none;
}
.search-bar input::placeholder{color:rgba(244,225,196,.4)}
.search-suggestions{
  position:absolute;left:0;right:0;top:calc(100% + 8px);z-index:40;
  display:none;background:#17110f;border:1px solid rgba(211,169,96,.42);
  border-radius:8px;box-shadow:0 18px 48px rgba(0,0,0,.42);overflow:hidden;
}
.search-suggestions.open{display:block}
.search-result{
  display:grid;gap:2px;width:100%;padding:11px 13px;border:0;border-bottom:1px solid rgba(244,225,196,.08);
  background:transparent;color:var(--paper);text-align:left;
}
.search-result:last-child{border-bottom:0}
.search-result:hover,.search-result:focus,.search-result.active{background:rgba(184,137,63,.14);outline:none}
.search-result b{font-size:12px;line-height:1.3;color:var(--gold-soft)}
.search-result span{font-size:11px;line-height:1.4;color:rgba(244,225,196,.68)}

/* mobile nav */
.mobile-nav{
  display:none;flex-direction:column;background:var(--ink-2);
  border-top:1px solid var(--line);padding:10px 40px 20px;
}
.mobile-nav.open{display:flex}
.mobile-nav a{
  padding:12px 0;font-size:13px;letter-spacing:.18em;text-transform:uppercase;
  border-bottom:1px solid rgba(244,225,196,.07);
}

/* ------------------------------------------------ buttons */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  font-size:11.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;
  padding:14px 28px;border-radius:3px;border:1px solid transparent;
  transition:background-color .25s,color .25s,border-color .25s,transform .25s;white-space:nowrap;
}
.btn-gold{background:var(--gold-btn);color:#241a10;border-color:var(--gold-btn)}
.btn-gold:hover{background:var(--gold-soft);box-shadow:0 6px 24px rgba(184,137,63,.35)}
.btn-outline{background:transparent;color:var(--paper);border-color:rgba(244,225,196,.5)}
.btn-outline:hover{border-color:var(--paper);background:rgba(244,225,196,.06)}
.btn-outline-gold{background:transparent;color:var(--gold-soft);border-color:var(--line-gold)}
.btn-outline-gold:hover{border-color:var(--gold-soft);background:rgba(184,137,63,.1)}
.btn-dark{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.btn-dark:hover{background:#2a2130}
.link-arrow{
  font-size:11px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;
  display:inline-flex;align-items:center;gap:8px;transition:gap .2s;
}
.link-arrow:hover{gap:13px}

/* ------------------------------------------------ hero (home) */
.hero{
  display:grid;grid-template-columns:.96fr 1.14fr;min-height:680px;
  background:
    radial-gradient(ellipse at 52% 48%,rgba(184,137,63,.24),transparent 58%),
    linear-gradient(105deg,#17110f 0%,#24170f 46%,#543817 100%);
  overflow:hidden;
}
.hero-copy{
  padding:90px 60px 70px 40px;max-width:640px;margin-left:auto;width:100%;
  display:flex;flex-direction:column;justify-content:center;
  position:relative;z-index:2;
}
.hero h1{
  font-family:var(--serif);font-weight:500;font-size:52px;line-height:1.18;
  color:var(--paper);
}
.hero h1 .gold{color:var(--gold-soft)}
.hero p{
  margin:26px 0 34px;max-width:340px;font-size:14.5px;font-weight:300;
  color:rgba(244,225,196,.85);
}
.hero-actions{display:flex;gap:16px;flex-wrap:wrap}
.hero-feats{
  display:flex;gap:34px;margin-top:64px;flex-wrap:wrap;
}
.feat{display:flex;align-items:center;gap:10px;font-size:12px;font-weight:500;color:var(--paper)}
.feat svg{width:22px;height:22px;stroke:var(--gold-soft);fill:none;stroke-width:1.5}
.hero-img{
  background-image:var(--img-lan-1),
    linear-gradient(160deg,#5b3d1e,#1f140c);
  background-size:cover,cover;
  background-position:center 52%,center;
  background-repeat:no-repeat;
  position:relative;
  margin-left:-48vw;
}
.hero-img::after{
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(90deg,#17110f 0%,rgba(23,17,15,.98) 22%,rgba(36,23,15,.76) 45%,transparent 72%),
    linear-gradient(180deg,rgba(23,17,15,.05),rgba(23,17,15,.24));
}

/* ------------------------------------------------ paper sections */
.paper-section{background:var(--paper);color:var(--ink);padding:64px 0 74px}
.section-head{
  display:flex;align-items:center;justify-content:center;gap:40px;margin-bottom:42px;
}
.section-head h2{
  font-family:var(--serif);font-weight:600;font-size:32px;color:var(--ink);
  text-align:center;
}
.arrow-btn{
  background:none;border:none;color:var(--gold);font-size:26px;line-height:1;
  padding:6px 10px;transition:transform .2s;
}
.arrow-btn:hover{transform:scale(1.25)}

/* two sides cards */
.duo{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.duo-card{
  border-radius:14px;overflow:hidden;display:grid;grid-template-columns:1.1fr 1fr;
  min-height:360px;color:var(--paper);
  box-shadow:0 18px 40px rgba(23,18,26,.18);
  transition:transform .3s,box-shadow .3s;
}
.duo-card:hover{transform:translateY(-5px);box-shadow:0 26px 54px rgba(23,18,26,.28)}
.duo-card.works{
  grid-template-columns:minmax(0,1fr);
  background-image:
    linear-gradient(90deg,rgba(5,28,24,.92) 0%,rgba(5,28,24,.72) 38%,rgba(5,28,24,.18) 65%,transparent 100%),
    var(--img-work-1);
  background-size:cover;
  background-position:center;
}
.duo-card.made{background:linear-gradient(120deg,#c4634c,#b25a45)}
.duo-card.works .duo-body{max-width:310px}
.duo-card.works .duo-img{display:none}
.duo-body{padding:40px 10px 34px 34px;display:flex;flex-direction:column}
.duo-kicker{font-family:var(--serif);font-style:italic;font-size:15px;opacity:.85}
.duo-title{
  font-family:var(--sans);font-weight:600;font-size:22px;letter-spacing:.14em;
  margin:8px 0 14px;
}
.duo-text{font-size:12.5px;font-weight:300;opacity:.9;max-width:230px;flex:1}
.duo-body .link-arrow{margin-top:20px;color:var(--paper)}
.duo-img{background-repeat:no-repeat;position:relative}
.duo-card.works .duo-img{
  background-image:url("../img/hoodie.svg"),
    radial-gradient(ellipse at 50% 60%,rgba(0,0,0,.35),transparent 70%);
  background-size:auto 88%,cover;
  background-position:center 62%,center;
  background-repeat:no-repeat;
}
.duo-card.made .duo-img{
  background-image:var(--img-puodelis-1);
  background-size:auto 145%;
  background-position:63% 54%;
  background-repeat:no-repeat;
}
.duo-img::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(0,0,0,.28),transparent 45%);
}

/* popular creations */
.pop-title{
  font-family:var(--serif);font-weight:600;font-size:28px;text-align:center;
  margin:70px 0 36px;color:var(--ink);
}
.prod-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:22px}
.prod-card{cursor:pointer}
.prod-thumb{
  aspect-ratio:1/1.15;border-radius:10px;overflow:hidden;
  background-color:#e7d8bf;background-repeat:no-repeat;
  box-shadow:0 10px 26px rgba(23,18,26,.14);
  transition:transform .3s,box-shadow .3s;
}
.prod-card:hover .prod-thumb{transform:translateY(-6px);box-shadow:0 18px 36px rgba(23,18,26,.22)}
.prod-name{font-size:13px;font-weight:600;color:var(--ink);margin-top:14px}
.prod-price{font-size:12px;color:#6d5b45;margin-top:2px}

/* product illustrations (SVG, correct brand text) */
.crop-hoodie,.crop-mug,.crop-tote,.crop-polo,.crop-print,.crop-bottle,.crop-gift,.crop-card,
.crop-group-apparel,.crop-group-drinkware,.crop-group-bags,.crop-group-prints,
.crop-group-business,.crop-group-personal,.crop-group-sets,.crop-group-small{
  background-repeat:no-repeat;background-position:center 55%;
}
.crop-hoodie{background-image:var(--img-h1);background-size:cover;background-position:center}
.crop-mug{background-image:var(--img-p1);background-size:cover;background-position:center}
.crop-tote{background-image:var(--img-t1);background-size:cover;background-position:center}
.crop-polo{background-image:var(--img-pt1);background-size:cover;background-position:center}
.crop-print{background-image:var(--img-f1);background-size:cover;background-position:center}
.crop-bottle{background-image:url("../img/bottle.svg");background-size:auto 84%}
.crop-gift{background-image:url("../img/gift.svg");background-size:auto 76%}
.crop-card{background-image:url("../img/card.svg");background-size:88% auto;background-position:center}
.crop-group-apparel{background-image:var(--img-group-apparel);background-size:cover;background-position:center}
.crop-group-drinkware{background-image:var(--img-group-drinkware);background-size:cover;background-position:center}
.crop-group-bags{background-image:var(--img-group-bags);background-size:cover;background-position:center}
.crop-group-prints{background-image:var(--img-group-prints);background-size:cover;background-position:center}
.crop-group-business{background-image:var(--img-group-business);background-size:cover;background-position:center}
.crop-group-personal{background-image:var(--img-group-personal);background-size:cover;background-position:center}
.crop-group-sets{background-image:var(--img-group-sets);background-size:cover;background-position:center}
.crop-group-small{background-image:var(--img-group-small);background-size:cover;background-position:center}

/* ------------------------------------------------ trust strip (emerald) */
.trust{background:var(--emerald-deep);padding:34px 0}
.trust-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.trust-item{display:flex;align-items:center;gap:14px}
.trust-item svg{width:30px;height:30px;stroke:var(--gold-soft);fill:none;stroke-width:1.4;flex:0 0 30px}
.trust-item b{display:block;font-size:13px;font-weight:600;color:var(--paper)}
.trust-item span{font-size:11.5px;font-weight:300;color:rgba(244,225,196,.75)}

/* trust strip paper variant (shop) */
.trust.paper-trust{background:var(--paper-soft)}
.trust.paper-trust svg{stroke:var(--brown)}
.trust.paper-trust b{color:var(--ink)}
.trust.paper-trust span{color:#6d5b45}

/* ------------------------------------------------ CTA band */
.cta-band{
  position:relative;overflow:hidden;background:var(--ink);
  padding:96px 0 100px;text-align:center;
}
.cta-band .r-watermark{
  position:absolute;left:-40px;bottom:-70px;width:380px;height:380px;
  background-image:url("../img/logo.svg");background-size:contain;
  background-position:center;background-repeat:no-repeat;
  opacity:.16;pointer-events:none;
}
.cta-band .sparkle{
  position:absolute;right:0;top:0;bottom:0;width:34%;
  background:radial-gradient(ellipse at 80% 60%,rgba(184,137,63,.28),transparent 60%),
             radial-gradient(ellipse at 65% 30%,rgba(211,169,96,.16),transparent 55%);
  pointer-events:none;
}
.cta-band h2{
  font-family:var(--serif);font-weight:500;font-size:36px;color:var(--gold-soft);
}
.cta-band p{
  margin:16px auto 34px;max-width:360px;font-size:13.5px;font-weight:300;
  color:rgba(244,225,196,.8);
}

/* ------------------------------------------------ footer */
.site-footer{
  background-image:
    linear-gradient(90deg,rgba(18,14,21,.96),rgba(18,14,21,.9) 42%,rgba(18,14,21,.72)),
    var(--img-head-1);
  background-color:#120e15;
  background-size:cover;
  background-position:center;
  border-top:1px solid rgba(244,225,196,.05);padding:64px 0 30px;position:relative;overflow:hidden
}
.footer-grid{display:grid;grid-template-columns:90px minmax(280px,520px);gap:44px;align-items:start;justify-content:center}
.footer-r{
  width:88px;height:110px;background-image:url("../img/logo.svg");
  background-size:contain;background-position:top center;
  background-repeat:no-repeat;opacity:.9;
}
.footer-news h4{font-family:var(--serif);font-size:17px;margin-bottom:10px}
.footer-news p{font-size:12.5px;font-weight:300;color:rgba(244,225,196,.75);margin-bottom:18px;max-width:320px}
.news-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;max-width:520px}
.news-form input{
  flex:1;background:transparent;border:1px solid rgba(244,225,196,.35);
  color:var(--paper);padding:11px 14px;font-size:13px;border-radius:3px;outline:none;
}
.news-form input::placeholder{color:rgba(244,225,196,.4)}
.news-form input:focus{border-color:var(--gold)}
.newsletter-consent{
  grid-column:1/-1;margin-top:2px;color:rgba(244,225,196,.72);
  font-size:11.5px;line-height:1.45;
}
.newsletter-consent input{padding:0;flex:none}
.newsletter-consent span{color:rgba(244,225,196,.72)}
.socials{display:flex;gap:12px;margin-top:22px}
.socials a{
  width:34px;height:34px;border:1px solid rgba(244,225,196,.3);border-radius:50%;
  display:flex;align-items:center;justify-content:center;transition:border-color .2s,color .2s;
}
.socials a:hover{border-color:var(--gold-soft);color:var(--gold-soft)}
.socials svg{width:15px;height:15px;fill:currentColor}
.footer-tree{
  margin-top:50px;padding-top:30px;border-top:1px solid rgba(244,225,196,.08);
}
.footer-tree-head{
  display:flex;justify-content:space-between;align-items:center;gap:18px;
  font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-soft);
}
.footer-tree-toggle{
  border:0;background:transparent;color:rgba(244,225,196,.62);cursor:pointer;
  font:inherit;text-transform:inherit;letter-spacing:inherit;padding:4px 0;
}
.footer-tree-toggle:hover{color:var(--gold-soft)}
.footer-tree-toggle:focus-visible{outline:1px solid var(--gold-soft);outline-offset:5px}
.footer-tree-grid{
  display:none;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px 34px;margin-top:24px;
}
.footer-tree.is-open .footer-tree-grid{display:grid}
.footer-tree-group{min-width:0}
.footer-tree-title{
  display:inline-block;font-size:11px;font-weight:700;letter-spacing:.16em;
  text-transform:uppercase;color:var(--gold-soft);margin-bottom:12px;
}
.footer-tree ul{list-style:none;display:grid;gap:7px}
.footer-tree li{font-size:11.5px;line-height:1.35;color:rgba(244,225,196,.6)}
.footer-tree a{transition:color .2s}
.footer-tree a:hover{color:var(--gold-soft)}
.footer-bottom{
  margin-top:34px;padding-top:22px;border-top:1px solid rgba(244,225,196,.08);
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px;
  font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:rgba(244,225,196,.55);
}
.footer-bottom nav{display:flex;gap:12px 26px;flex-wrap:wrap}
.footer-bottom a:hover{color:var(--gold-soft)}
.footer-link-button{
  background:none;border:0;color:inherit;font:inherit;letter-spacing:inherit;
  text-transform:inherit;padding:0;cursor:pointer;
}
.footer-link-button:hover{color:var(--gold-soft)}

/* ------------------------------------------------ legal + consent */
.legal-page{
  background:
    radial-gradient(ellipse at 76% 0%,rgba(184,137,63,.18),transparent 42%),
    linear-gradient(115deg,#17110f,#120e15 74%);
}
.legal-main{max-width:980px;margin:0 auto;padding:72px 40px 90px}
.legal-main h1{
  font-family:var(--serif);font-size:44px;line-height:1.12;font-weight:500;color:var(--paper);
  margin-bottom:18px;
}
.legal-main .updated{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-soft);margin-bottom:32px}
.legal-main section{border-top:1px solid rgba(244,225,196,.1);padding:26px 0}
.legal-main h2{font-size:15px;letter-spacing:.14em;text-transform:uppercase;margin-bottom:12px;color:var(--gold-soft)}
.legal-main h3{font-size:14px;margin:18px 0 8px}
.legal-main p,.legal-main li{font-size:14px;color:rgba(244,225,196,.78);line-height:1.75}
.legal-main ul{padding-left:20px;display:grid;gap:7px}
.legal-main a{color:var(--gold-soft);text-decoration:underline;text-underline-offset:3px}
.legal-note{
  border:1px solid var(--line-gold);border-radius:8px;padding:16px 18px;
  color:rgba(244,225,196,.86);background:rgba(184,137,63,.08);
}
.legal-strip{
  display:flex;justify-content:center;gap:18px;flex-wrap:wrap;padding:22px 24px;
  border-top:1px solid rgba(244,225,196,.08);font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  color:rgba(244,225,196,.62);
}
.legal-strip a,.legal-strip button{color:inherit}

/* ------------------------------------------------ admin shell */
.admin-page{min-height:100svh;background:#14100f;color:var(--paper)}
.admin-shell{
  min-height:100svh;display:grid;grid-template-columns:260px minmax(0,1fr);
  background:
    radial-gradient(ellipse at 74% 0%,rgba(184,137,63,.16),transparent 36%),
    linear-gradient(115deg,#17110f 0%,#14100f 62%,#0d332b 100%);
}
.admin-sidebar{
  position:sticky;top:0;height:100svh;padding:22px 18px;display:flex;flex-direction:column;gap:18px;
  border-right:1px solid rgba(244,225,196,.1);background:rgba(18,14,13,.88);backdrop-filter:blur(10px);
}
.admin-brand{display:flex;align-items:center;gap:13px;text-decoration:none;color:var(--paper)}
.admin-brand .logo-mark{width:44px;height:44px;flex:0 0 44px}
.admin-brand b{display:block;font-family:var(--serif);font-weight:500;font-size:20px;letter-spacing:.22em;line-height:1}
.admin-brand small{display:block;margin-top:5px;font-size:9px;letter-spacing:.4em;text-transform:uppercase;color:var(--gold-soft)}
.admin-lock{border:1px solid rgba(184,137,63,.34);border-radius:8px;padding:13px;background:rgba(184,137,63,.08)}
.admin-lock b{display:block;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-soft);margin-bottom:5px}
.admin-lock span{font-size:11.5px;line-height:1.45;color:rgba(244,225,196,.7)}
.admin-login-preview{
  border:1px solid rgba(244,225,196,.1);border-radius:8px;padding:12px;background:rgba(51,35,27,.3);
  display:grid;gap:9px;
}
.admin-login-preview label{display:grid;gap:6px}
.admin-login-preview label span{
  font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:rgba(244,225,196,.58);
}
.admin-login-preview input{
  width:100%;border:1px solid rgba(244,225,196,.16);border-radius:6px;background:rgba(244,225,196,.05);
  color:var(--paper);font-family:var(--sans);font-size:12px;padding:9px 10px;outline:none;
}
.admin-login-preview input:focus{border-color:var(--gold-soft)}
.admin-login-preview .btn{padding:9px 10px;font-size:9.5px;width:100%;justify-content:center}
.admin-login-preview small{font-size:10.5px;line-height:1.4;color:rgba(244,225,196,.62)}
.admin-nav{display:grid;gap:7px}
.admin-nav button{
  width:100%;border:1px solid transparent;background:transparent;color:rgba(244,225,196,.72);
  border-radius:7px;padding:11px 12px;text-align:left;font-family:var(--sans);font-size:12px;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase;cursor:pointer;transition:background-color .2s,border-color .2s,color .2s;
}
.admin-nav button:hover{border-color:rgba(184,137,63,.38);color:var(--paper);background:rgba(51,35,27,.38)}
.admin-nav button.active{border-color:var(--line-gold);color:#241a10;background:var(--gold-btn)}
.admin-sidebar-foot{margin-top:auto;padding-top:16px;border-top:1px solid rgba(244,225,196,.08);display:grid;gap:8px;font-size:11px;color:rgba(244,225,196,.58)}
.admin-sidebar-foot span{letter-spacing:.14em;text-transform:uppercase;color:var(--gold-soft)}
.admin-sidebar-foot a{color:rgba(244,225,196,.78)}
.admin-workspace{min-width:0;padding:28px clamp(20px,3vw,44px) 54px}
.admin-topbar{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:24px}
.admin-eyebrow{display:block;font-size:11px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-soft);margin-bottom:8px}
.admin-topbar h1{font-family:var(--serif);font-size:clamp(32px,3.4vw,52px);font-weight:500;line-height:1.08}
.admin-top-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.admin-link{
  border:1px solid rgba(244,225,196,.18);border-radius:5px;padding:12px 14px;font-size:10.5px;
  font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-soft);
}
.admin-panel{display:none}
.admin-panel.active{display:block}
.admin-section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:18px}
.admin-section-head h2{font-family:var(--serif);font-size:28px;font-weight:500;line-height:1.18}
.admin-section-head p{margin-top:5px;font-size:13px;color:rgba(244,225,196,.68)}
.admin-status-pill,.state{
  display:inline-flex;align-items:center;width:max-content;border:1px solid rgba(211,169,96,.38);
  border-radius:999px;padding:5px 9px;font-size:9.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;
}
.admin-status-pill,.state.next{color:var(--gold-soft);background:rgba(184,137,63,.1)}
.state.wait{color:#f4e1c4;background:rgba(244,225,196,.07);border-color:rgba(244,225,196,.2)}
.state.queued{color:rgba(244,225,196,.72);background:rgba(51,35,27,.36);border-color:rgba(244,225,196,.12)}
.admin-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:18px}
.admin-stat{border:1px solid rgba(244,225,196,.1);border-radius:8px;background:rgba(51,35,27,.4);padding:16px;min-width:0}
.admin-stat span{display:block;font-size:10.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:rgba(244,225,196,.58)}
.admin-stat b{display:block;margin:9px 0 4px;font-family:var(--serif);font-size:30px;font-weight:500;color:var(--paper)}
.admin-stat small{font-size:11.5px;color:rgba(244,225,196,.62)}
.admin-grid{display:grid;gap:18px}
.admin-grid-main{grid-template-columns:minmax(0,1.1fr) minmax(320px,.9fr)}
.admin-surface{border:1px solid rgba(244,225,196,.1);border-radius:8px;background:rgba(18,14,13,.54);padding:18px;min-width:0;box-shadow:0 18px 48px rgba(0,0,0,.22)}
.admin-surface h3{font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-soft);margin-bottom:14px}
.admin-table{width:100%;border-collapse:collapse;font-size:12.5px}
.admin-table th{text-align:left;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:rgba(244,225,196,.54);padding:0 10px 10px 0;font-weight:800}
.admin-table td{border-top:1px solid rgba(244,225,196,.08);padding:12px 10px 12px 0;color:rgba(244,225,196,.78);vertical-align:middle}
.admin-table tr[data-enquiry-id]{cursor:pointer}
.admin-table tr[data-enquiry-id]:hover td{background:rgba(184,137,63,.05)}
.admin-table tr.active td{color:var(--paper);background:rgba(184,137,63,.08)}
.admin-checklist{list-style:none;display:grid;gap:11px}
.admin-checklist li{display:grid;grid-template-columns:auto 1fr;gap:10px;font-size:12.5px;line-height:1.5;color:rgba(244,225,196,.76)}
.admin-checklist span{width:9px;height:9px;border-radius:50%;background:var(--gold-soft);margin-top:5px}
.admin-kanban{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.admin-kanban div,.template-sides div{border:1px solid rgba(184,137,63,.22);border-radius:8px;padding:14px;background:rgba(184,137,63,.06)}
.admin-kanban b,.template-sides b{display:block;font-size:12px;color:var(--paper);margin-bottom:6px}
.admin-kanban span,.template-sides span{font-size:11.5px;line-height:1.45;color:rgba(244,225,196,.66)}
.crm-pipeline-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-bottom:18px}
.crm-pipeline-tabs button{
  position:relative;border:1px solid rgba(244,225,196,.12);border-radius:7px;background:rgba(51,35,27,.36);
  color:rgba(244,225,196,.74);padding:10px 34px 10px 10px;text-align:left;cursor:pointer;min-height:58px;
}
.crm-pipeline-tabs button:hover{border-color:rgba(184,137,63,.34);background:rgba(184,137,63,.08)}
.crm-pipeline-tabs button.active{border-color:var(--line-gold);background:rgba(184,137,63,.16);color:var(--paper)}
.crm-pipeline-tabs span{display:block;font-size:10.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase}
.crm-pipeline-tabs small{display:block;margin-top:4px;font-size:10.5px;color:rgba(244,225,196,.56);line-height:1.25}
.crm-tab-count{
  position:absolute;right:8px;top:8px;min-width:20px;height:20px;border-radius:999px;background:rgba(211,169,96,.18);
  border:1px solid rgba(211,169,96,.3);display:grid;place-items:center;font-size:10px;color:var(--gold-soft);
}
.admin-editor{display:grid;gap:12px}
.admin-editor label{display:grid;gap:6px}
.admin-editor label span{font-size:10.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:rgba(244,225,196,.58)}
.admin-editor input,.admin-editor textarea,.admin-editor select{
  width:100%;border:1px solid rgba(244,225,196,.16);border-radius:6px;background:rgba(244,225,196,.05);
  color:rgba(244,225,196,.82);font-family:var(--sans);font-size:12.5px;padding:10px 11px;resize:vertical;
}
.admin-editor textarea{min-height:96px}
.admin-field-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.template-sides{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.cookie-panel{
  position:fixed;inset:auto 18px 18px;z-index:300;display:flex;justify-content:center;pointer-events:none;
}
.cookie-card{
  width:min(980px,100%);background:#17110f;color:var(--paper);border:1px solid var(--line-gold);
  border-radius:8px;box-shadow:0 28px 80px rgba(0,0,0,.52);padding:22px;
  display:grid;grid-template-columns:1fr auto;gap:18px 28px;pointer-events:auto;
}
.cookie-kicker{
  font-size:10px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-soft);margin-bottom:4px;
}
.cookie-copy h2{font-family:var(--serif);font-size:24px;font-weight:500;margin-bottom:8px}
.cookie-copy p{font-size:13px;color:rgba(244,225,196,.78);max-width:560px}
.cookie-copy a{display:inline-block;margin-top:10px;font-size:12px;color:var(--gold-soft)}
.cookie-settings{display:none;grid-column:1/-1;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.cookie-settings.is-open{display:grid}
.cookie-toggle{
  border:1px solid rgba(244,225,196,.14);border-radius:8px;padding:13px;background:rgba(51,35,27,.46);
  display:grid;grid-template-columns:auto 1fr;gap:6px 10px;align-items:start;
}
.cookie-toggle span{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.cookie-toggle small{grid-column:2;font-size:11px;line-height:1.45;color:rgba(244,225,196,.64)}
.cookie-toggle input{margin-top:2px}
.cookie-toggle.is-locked{opacity:.82}
.cookie-actions{display:flex;justify-content:flex-end;align-items:center;gap:10px;flex-wrap:wrap}
.cookie-actions .btn{padding:12px 16px;font-size:10.5px}
.cookie-save{display:none}
.cookie-settings.is-open + .cookie-actions .cookie-save{display:inline-flex}

/* ------------------------------------------------ Ideas page */
.eyebrow{
  display:inline-block;font-size:12px;font-weight:700;letter-spacing:.26em;
  color:var(--gold-soft);text-transform:uppercase;margin-bottom:14px;
}
.shop-hero{
  display:grid;grid-template-columns:1fr 1fr;min-height:340px;background:var(--ink);
}
.shop-hero-copy{
  padding:70px 40px 60px;max-width:620px;margin-left:auto;width:100%;
  display:flex;flex-direction:column;justify-content:center;align-items:flex-start;
}
.shop-hero h1{font-family:var(--serif);font-weight:500;font-size:52px;line-height:1.18;color:var(--paper)}
.shop-hero p{margin:14px 0 30px;font-size:14.5px;font-weight:300;color:rgba(244,225,196,.85)}
.shop-hero-img{
  background-image:var(--img-shop),
    linear-gradient(160deg,#211a26,#140f19);
  background-size:cover,cover;
  background-position:center,center;
  background-repeat:no-repeat;position:relative;
}
.shop-hero-img::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,var(--ink),rgba(23,18,26,.64) 34%,transparent 68%);
}

/* category strip */
.cat-strip{background:#141017;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:26px 0}
.cat-row{display:flex;align-items:center;gap:18px}
.cat-scroll{display:flex;gap:34px;overflow-x:auto;scrollbar-width:none;flex:1;justify-content:space-between;padding:4px}
.cat-scroll::-webkit-scrollbar{display:none}
.cat{background:none;border:none;color:var(--paper);text-align:center;flex:0 0 132px}
.cat-circle{
  width:88px;height:88px;border-radius:50%;overflow:hidden;margin:0 auto;
  border:2px solid transparent;background-repeat:no-repeat;
  background-color:#241c29;
  transition:border-color .2s,transform .2s;
  box-shadow:0 6px 18px rgba(0,0,0,.5);
}
.cat:hover .cat-circle{transform:scale(1.06)}
.cat.active .cat-circle{border-color:var(--gold)}
.cat span{display:block;margin-top:10px;font-size:11.5px;letter-spacing:.04em;line-height:1.25}
.cat.active span{color:var(--gold-soft)}

/* featured stories */
.stories{background:var(--ink);padding:56px 0 72px}
.stories h2{
  font-family:var(--serif);font-weight:600;font-size:28px;text-align:center;margin-bottom:40px;
}
.story-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.story-card{
  background:var(--ink-3);border:1px solid rgba(244,225,196,.07);border-radius:8px;
  overflow:hidden;display:flex;flex-direction:column;
  transition:transform .3s,border-color .3s;
}
.story-card:hover{transform:translateY(-5px);border-color:var(--line-gold)}
.story-img-link{display:block;color:inherit}
.story-img{display:block;aspect-ratio:1/1;background-repeat:no-repeat;background-color:#1b151f}
.story-body{padding:20px 22px 22px}
.story-body h3{font-family:var(--serif);font-weight:500;font-size:18px;line-height:1.35;margin-bottom:12px}
.story-meta{font-size:11.5px;color:rgba(244,225,196,.6);margin-bottom:4px}
.story-price{font-size:11.5px;color:rgba(244,225,196,.6);margin-bottom:14px}
.story-body .link-arrow{color:var(--gold-soft)}
.story-card.hidden{display:none}
.category-card .story-meta{min-height:72px;color:rgba(244,225,196,.72)}
.category-card .story-price{min-height:30px;color:rgba(211,169,96,.8)}

/* ------------------------------------------------ E-Shop page */
.eshop-hero{
  background:
    radial-gradient(ellipse at 74% 30%,rgba(184,137,63,.22),transparent 50%),
    linear-gradient(115deg,#17110f 0%,#24170f 58%,#0e372d 100%);
  padding:76px 0 82px;overflow:hidden;
}
.eshop-hero-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:56px;align-items:center}
.eshop-hero h1{
  font-family:var(--serif);font-weight:500;font-size:clamp(42px,5vw,74px);
  line-height:1.02;max-width:720px;
}
.eshop-hero p{margin:22px 0 32px;max-width:470px;color:rgba(244,225,196,.82)}
.eshop-hero-art{
  min-height:460px;border-radius:8px;background-image:
    linear-gradient(90deg,rgba(23,17,15,.2),rgba(23,17,15,.05)),
    var(--img-head-1);
  background-size:cover;background-position:center;box-shadow:0 28px 80px rgba(0,0,0,.38);
}
.eshop-proof{background:var(--emerald-deep);padding:24px 0}
.proof-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.proof-grid div{border-left:1px solid rgba(211,169,96,.45);padding-left:18px}
.proof-grid b{display:block;color:var(--paper);font-size:13px}
.proof-grid span{font-size:12px;color:rgba(244,225,196,.72)}
.eshop-section{background:var(--paper);color:var(--ink);padding:70px 0}
.split-head{justify-content:space-between;margin-bottom:34px}
.split-head h2{margin:0}
.eshop-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.eshop-card{
  background:#f7ead5;border:1px solid rgba(51,35,27,.12);border-radius:8px;overflow:hidden;
  display:flex;flex-direction:column;min-height:100%;box-shadow:0 16px 34px rgba(23,18,26,.12);
}
.eshop-img{display:block;aspect-ratio:1.18/1;background-color:#ead9bd}
.eshop-card div{padding:20px 20px 22px;display:flex;flex-direction:column;flex:1}
.eshop-card span{font-size:10.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}
.eshop-card h3{font-family:var(--serif);font-size:22px;line-height:1.22;margin:8px 0 10px;color:var(--ink)}
.eshop-card p{font-size:12.5px;color:#67543c;margin-bottom:18px;flex:1}
.eshop-card .link-arrow{color:var(--brown)}
.testimonials{background:#17110f;padding:68px 0}
.testimonials h2{font-family:var(--serif);font-size:30px;text-align:center;margin-bottom:32px}
.quote-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.quote-grid blockquote{border:1px solid rgba(184,137,63,.35);border-radius:8px;padding:24px;background:rgba(51,35,27,.34)}
.quote-grid p{font-family:var(--serif);font-size:20px;line-height:1.35;color:var(--paper)}
.quote-grid cite{display:block;margin-top:14px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-soft);font-style:normal}
.sales-cta{background:var(--paper);color:var(--ink);padding:54px 0}
.sales-cta-grid{display:grid;grid-template-columns:1fr auto;gap:28px;align-items:center}
.sales-cta h2{font-family:var(--serif);font-size:34px;line-height:1.18;max-width:650px}
.sales-cta p{margin-top:10px;max-width:560px;color:#67543c}
.contact-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.contact-grid a{display:grid;gap:5px;border:1px solid rgba(184,137,63,.28);border-radius:8px;padding:16px;text-decoration:none!important}
.contact-grid b{color:var(--gold-soft)}
.contact-grid span{color:rgba(244,225,196,.7);font-size:12.5px}
.enquiry-form{display:grid;gap:14px}
.contact-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.enquiry-form label{display:grid;gap:7px}
.enquiry-form label span{
  font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:rgba(244,225,196,.62);
}
.enquiry-form input,.enquiry-form select,.enquiry-form textarea{
  width:100%;border:1px solid rgba(244,225,196,.18);border-radius:6px;background:rgba(51,35,27,.42);
  color:var(--paper);font-family:var(--sans);font-size:13px;padding:11px 12px;outline:none;
}
.enquiry-form input:focus,.enquiry-form select:focus,.enquiry-form textarea:focus{border-color:var(--gold-soft)}
.enquiry-form textarea{resize:vertical;min-height:132px}
.enquiry-form .btn{width:max-content}
.hp-field{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;opacity:0!important}
.contact-consent{max-width:680px}

/* ------------------------------------------------ MOCKUP STUDIO */
.studio{
  display:grid;grid-template-columns:clamp(220px,17vw,300px) minmax(430px,1.12fr) minmax(500px,.98fr);gap:30px;
  max-width:1660px;margin:0 auto;padding:34px clamp(28px,3vw,52px) 54px;
  align-items:start;
}
body[data-page="mockup"]{background:#17110f}
body[data-page="mockup"] .site-header{background:rgba(23,17,15,.96)}
.studio-left,.viewer,.panel{min-width:0}
.studio-left .eyebrow{
  font-size:12px;font-weight:600;letter-spacing:.3em;color:var(--gold-soft);
  text-transform:uppercase;
}
.studio-left h1{
  font-family:var(--serif);font-weight:500;font-size:clamp(34px,2.55vw,44px);line-height:1.16;margin:14px 0 20px;
}
.studio-left h1 .gold{color:var(--gold-soft)}
.studio-left>p{font-size:13.5px;font-weight:300;color:rgba(244,225,196,.85);max-width:280px}
.mockup-access{
  display:grid;gap:7px;margin-top:18px;max-width:310px;
  border:1px solid rgba(184,137,63,.34);border-radius:8px;padding:14px 15px;
  background:rgba(51,35,27,.42);
}
.mockup-access b{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--gold-soft)}
.mockup-access span{font-size:12px;line-height:1.55;color:rgba(244,225,196,.76)}
.mockup-access .link-arrow{color:var(--gold-soft)}
.mockup-access.warn{border-color:rgba(211,169,96,.7);background:rgba(184,137,63,.12)}
.mockup-access.danger{border-color:rgba(224,112,91,.72);background:rgba(224,112,91,.1)}
.studio-left .rule{width:44px;height:2px;background:var(--gold);margin:26px 0 34px}
.step{display:flex;gap:16px;margin-bottom:26px}
.step-icon{
  width:52px;height:52px;flex:0 0 52px;border-radius:8px;
  background:rgba(51,35,27,.72);border:1px solid rgba(244,225,196,.1);
  display:flex;align-items:center;justify-content:center;
}
.step-icon svg{width:24px;height:24px;stroke:var(--paper);fill:none;stroke-width:1.4}
.step b{font-size:14px;display:block;margin-bottom:3px}
.step span{font-size:12px;font-weight:300;color:rgba(244,225,196,.7)}
.promo-box{
  border:1px solid var(--line-gold);border-radius:8px;padding:22px;
  display:flex;gap:14px;margin-top:12px;
}
.promo-box svg{width:26px;height:26px;stroke:var(--gold-soft);fill:none;stroke-width:1.4;flex:0 0 26px}
.promo-box b{font-size:13.5px;display:block;margin-bottom:4px}
.promo-box p{font-size:12px;font-weight:300;color:rgba(244,225,196,.75);margin-bottom:12px}
.promo-box .link-arrow{color:var(--gold-soft)}

/* viewer */
.viewer{
  position:sticky;top:98px;display:flex;flex-direction:column;align-items:center;justify-content:center;
  min-height:calc(100svh - 130px);
}
.view-tabs{
  position:absolute;top:26px;z-index:5;display:flex;background:rgba(23,17,15,.86);
  border:1px solid rgba(244,225,196,.15);border-radius:30px;padding:4px;backdrop-filter:blur(6px);
}
.view-tabs button{
  background:none;border:none;color:var(--paper);font-size:12px;padding:7px 20px;
  border-radius:22px;letter-spacing:.04em;
}
.view-tabs button.active{background:var(--gold-btn);color:#241a10;font-weight:600}
.arch{
  width:min(100%,600px,41vw);max-width:600px;aspect-ratio:10/13;position:relative;
  border-radius:50% 50% 0 0 / 38% 38% 0 0;
  overflow:hidden;
  border:3px solid rgba(184,137,63,.55);
  box-shadow:0 0 0 14px #1d1512, 0 40px 80px rgba(0,0,0,.55);
  background-color:#140f0e;
}
.arch-stage{
  position:absolute;inset:0;background-repeat:no-repeat;
  transition:transform .35s ease, background-position .35s ease;
  transform-origin:center 60%;
}
.arch-stage{
  background-color:#140f0e;
}
.stage-mug,.stage-hoodie,.stage-tote,.stage-print,.stage-bottle,.stage-gift{
  background-position:center 58%,center;
}
.stage-mug{background-image:url("../img/mug-cream.svg"),radial-gradient(circle at 50% 44%,#33231B,#140f0e 72%);background-size:auto 66%,cover}
.stage-hoodie{background-image:url("../img/hoodie.svg"),radial-gradient(circle at 50% 44%,#33231B,#140f0e 72%);background-size:auto 76%,cover}
.stage-tote{background-image:url("../img/tote.svg"),radial-gradient(circle at 50% 44%,#33231B,#140f0e 72%);background-size:auto 72%,cover}
.stage-print{background-image:url("../img/print.svg"),radial-gradient(circle at 50% 44%,#33231B,#140f0e 72%);background-size:auto 76%,cover}
.stage-bottle{background-image:url("../img/bottle.svg"),radial-gradient(circle at 50% 44%,#33231B,#140f0e 72%);background-size:auto 72%,cover}
.stage-gift{background-image:url("../img/gift.svg"),radial-gradient(circle at 50% 44%,#33231B,#140f0e 72%);background-size:auto 64%,cover}
.tint{
  position:absolute;inset:0;mix-blend-mode:color;opacity:0;transition:opacity .3s;
  pointer-events:none;
}
.design-layer{position:absolute;inset:0;overflow:hidden}
.design-item{
  position:absolute;left:50%;top:52%;width:34%;transform:translate(-50%,-50%);
  cursor:grab;user-select:none;touch-action:none;
}
.design-item:active{cursor:grabbing}
.design-item img{width:100%;pointer-events:none;filter:drop-shadow(0 2px 6px rgba(0,0,0,.35))}
.design-item.blend img{mix-blend-mode:multiply}
.design-item .txt{
  font-family:var(--serif);color:var(--paper);text-align:center;font-size:30px;
  line-height:1.2;text-shadow:0 2px 8px rgba(0,0,0,.5);white-space:pre-wrap;
}
.design-item.selected{outline:1.5px dashed rgba(211,169,96,.9);outline-offset:6px}
.design-hint{
  position:absolute;bottom:74px;left:50%;transform:translateX(-50%);
  font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;
  color:rgba(244,225,196,.55);background:rgba(23,18,26,.7);padding:6px 14px;border-radius:20px;
  pointer-events:none;opacity:0;transition:opacity .3s;
}
.design-hint.show{opacity:1}
.zoom-bar{
  position:absolute;bottom:18px;z-index:5;display:flex;align-items:center;gap:4px;
  background:rgba(23,17,15,.86);border:1px solid rgba(244,225,196,.15);
  border-radius:26px;padding:4px 8px;backdrop-filter:blur(6px);
}
.zoom-bar button{
  background:none;border:none;color:var(--paper);font-size:17px;width:36px;height:32px;
  display:flex;align-items:center;justify-content:center;border-radius:18px;
}
.zoom-bar button:hover{background:rgba(244,225,196,.1)}
.zoom-bar svg{width:16px;height:16px;stroke:var(--paper);fill:none;stroke-width:1.6}

/* right panel */
.panel h2{
  font-size:13.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  margin-bottom:12px;display:flex;justify-content:space-between;align-items:baseline;
}
.panel h2 .side-link{
  font-size:11px;font-weight:500;letter-spacing:.05em;text-transform:none;
  color:var(--gold-soft);cursor:pointer;background:none;border:none;font-family:var(--sans);
}
.panel{align-self:start}
.panel-section{margin-bottom:20px}
.enhancement-card{
  border:1px solid rgba(184,137,63,.26);border-radius:8px;padding:16px;
  background:linear-gradient(135deg,rgba(184,137,63,.12),rgba(51,35,27,.48));
  display:grid;grid-template-columns:1fr auto;gap:16px;align-items:center;
}
.enhancement-card h2{margin:8px 0 6px;display:block}
.enhancement-card p{font-size:12px;line-height:1.55;color:rgba(244,225,196,.74)}
.paid-pill{
  display:inline-flex;align-items:center;width:max-content;border:1px solid rgba(211,169,96,.38);
  border-radius:999px;padding:4px 9px;font-size:9.5px;font-weight:700;letter-spacing:.16em;
  text-transform:uppercase;color:var(--gold-soft);background:rgba(184,137,63,.1);
}
.prod-picker{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.selected-product{
  border:1px solid rgba(184,137,63,.28);background:rgba(184,137,63,.08);
  color:var(--gold-soft);border-radius:8px;padding:9px 12px;margin-bottom:12px;
  font-family:var(--serif);font-size:16px;line-height:1.22;
}
.mockup-label{
  font-size:10.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  color:rgba(244,225,196,.58);margin:10px 0 7px;
}
.group-picker{grid-template-columns:repeat(2,minmax(0,1fr))}
.item-picker{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.pick{
  background:rgba(51,35,27,.62);border:1px solid rgba(244,225,196,.12);border-radius:7px;
  min-height:38px;padding:8px 9px;color:var(--paper);display:flex;
  align-items:center;justify-content:center;text-align:center;transition:border-color .2s,color .2s,background-color .2s;
}
.pick svg{display:none}
.pick span{font-size:10px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;line-height:1.22}
.item-picker .pick{min-height:36px;padding:7px 8px}
.pick:hover{border-color:var(--line-gold)}
.pick.active{border-color:var(--gold);color:var(--gold-soft);background:#241b12}
.sub-picker{margin-top:12px;display:none}
.sub-picker.open{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.sub-picker .pick.active{background:var(--gold-btn);color:#241a10;border-color:var(--gold-btn)}

.upload-zone{
  border:1.5px dashed var(--line-gold);border-radius:8px;padding:18px 18px;
  text-align:center;transition:background-color .2s,border-color .2s;
}
.upload-zone.drag{background:rgba(184,137,63,.08);border-color:var(--gold-soft)}
.upload-zone svg{display:none}
.upload-zone b{display:block;font-size:14.5px;margin-bottom:4px}
.upload-zone p{font-size:11.5px;color:rgba(244,225,196,.6);margin-bottom:12px}
.or-design{font-size:12px;color:rgba(244,225,196,.65);margin:12px 0 10px}
.tool-row{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.tool{
  background:rgba(51,35,27,.62);border:1px solid rgba(244,225,196,.12);border-radius:7px;
  padding:10px 4px;color:var(--paper);display:flex;flex-direction:column;
  align-items:center;gap:8px;transition:border-color .2s,color .2s,background-color .2s;
}
.tool svg{display:none}
.tool span{font-size:10px;font-weight:700;letter-spacing:.09em;text-transform:uppercase}
.tool:hover{border-color:var(--line-gold)}

.opt-label{font-size:12px;color:rgba(244,225,196,.75);margin:12px 0 8px}
.swatches{display:flex;gap:14px;flex-wrap:wrap}
.swatch{
  width:34px;height:34px;border-radius:50%;border:2px solid rgba(244,225,196,.25);
  cursor:pointer;transition:transform .2s,border-color .2s,box-shadow .2s;position:relative;
}
.swatch:hover{transform:scale(1.12)}
.swatch.active{border-color:var(--gold-soft);box-shadow:0 0 0 3px rgba(184,137,63,.3)}
.chips{display:flex;gap:10px;flex-wrap:wrap}
.chip{
  background:transparent;border:1px solid rgba(244,225,196,.3);color:var(--paper);
  border-radius:5px;padding:8px 16px;font-size:12px;transition:background-color .2s,color .2s,border-color .2s;
  display:inline-flex;align-items:center;gap:8px;
}
.chip:hover{border-color:var(--line-gold)}
.chip.active{background:var(--gold-btn);color:#241a10;border-color:var(--gold-btn);font-weight:600}
.chip svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:1.6}

.cta-row{display:flex;gap:12px;margin-top:4px}
.cta-row .btn{flex:1;padding:14px 18px;font-size:12.5px}
.fav-btn{
  width:56px;flex:0 0 56px;background:transparent;border:1px solid rgba(244,225,196,.3);
  border-radius:5px;color:var(--paper);display:flex;align-items:center;justify-content:center;
  transition:color .2s,border-color .2s,background-color .2s;
}
.fav-btn svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.5}
.fav-btn.on{color:var(--coral);border-color:var(--coral)}
.fav-btn.on svg{fill:var(--coral)}

/* studio footer strip */
.studio-strip{
  background:#120e15;border-top:1px solid rgba(244,225,196,.06);
  display:grid;grid-template-columns:1fr 1fr 1fr 1fr 1.4fr;gap:10px;
  max-width:1440px;margin:0 auto;padding:34px 40px 40px;align-items:center;
}
.sfeat{display:flex;gap:13px;align-items:flex-start;padding-right:16px}
.sfeat svg{width:26px;height:26px;stroke:var(--gold-soft);fill:none;stroke-width:1.4;flex:0 0 26px;margin-top:2px}
.sfeat b{font-size:12.5px;display:block;margin-bottom:2px}
.sfeat span{font-size:11px;font-weight:300;color:rgba(244,225,196,.65)}
.help-card{
  background:var(--paper);color:var(--ink);border-radius:10px;padding:22px 26px;
}
.help-card h3{font-family:var(--serif);font-size:17px;margin-bottom:6px}
.help-card p{font-size:12px;color:#5c4b38;margin-bottom:14px}

/* modal */
.modal-backdrop{
  position:fixed;inset:0;z-index:420;background:rgba(10,7,7,.72);
  display:grid;place-items:center;padding:24px;backdrop-filter:blur(8px);
}
body.modal-open{overflow:hidden}
.modal-backdrop[hidden]{display:none}
.modal-card{
  width:min(560px,100%);max-height:min(760px,calc(100svh - 48px));overflow:auto;
  background:#17110f;color:var(--paper);border:1px solid var(--line-gold);
  border-radius:10px;padding:26px;box-shadow:0 30px 90px rgba(0,0,0,.58);position:relative;
}
.modal-card h2{font-family:var(--serif);font-size:30px;font-weight:500;margin:10px 0 8px;color:var(--gold-soft)}
.modal-card p{font-size:13px;color:rgba(244,225,196,.78);margin-bottom:18px}
.modal-close{
  position:absolute;right:14px;top:12px;width:34px;height:34px;border:1px solid rgba(244,225,196,.2);
  background:transparent;color:var(--paper);border-radius:50%;font-size:22px;line-height:1;
}
.enhancement-form{display:grid;gap:12px}
.enhancement-form label{display:grid;gap:6px}
.enhancement-form label span{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:rgba(244,225,196,.68)}
.enhancement-form input,.enhancement-form textarea{
  width:100%;background:rgba(51,35,27,.48);border:1px solid rgba(244,225,196,.2);
  border-radius:6px;color:var(--paper);padding:11px 12px;font-family:var(--sans);font-size:13px;outline:none;
}
.enhancement-form input:focus,.enhancement-form textarea:focus{border-color:var(--gold-soft)}
.enhancement-image-line input[type="file"]{padding:10px;background:rgba(184,137,63,.08);cursor:pointer}
.enhancement-image-line small{font-size:11.5px;line-height:1.45;color:rgba(244,225,196,.62)}
.enhancement-image-line.has-file small{color:var(--gold-soft)}
.consent-line{display:grid!important;grid-template-columns:auto 1fr;align-items:flex-start;gap:10px!important}
.consent-line input{width:16px;height:16px;margin-top:2px}
.consent-line span{text-transform:none!important;letter-spacing:0!important;font-weight:400!important;line-height:1.5}

/* ------------------------------------------------ toast */
.toast{
  position:fixed;bottom:30px;left:50%;transform:translate(-50%,20px);
  background:var(--paper);color:var(--ink);padding:14px 26px;border-radius:6px;
  font-size:13px;font-weight:500;box-shadow:0 14px 40px rgba(0,0,0,.5);
  opacity:0;pointer-events:none;transition:opacity .35s,transform .35s;z-index:200;
}
.toast.show{opacity:1;transform:translate(-50%,0)}

/* reveal on scroll */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease}
.reveal.in{opacity:1;transform:none}

/* ------------------------------------------------ responsive */
@media (max-width:1380px){
  .studio{
    grid-template-columns:minmax(410px,1fr) minmax(460px,1fr);
    max-width:1180px;
  }
  .studio-left{
    grid-column:1/-1;max-width:none;display:grid;grid-template-columns:minmax(260px,.9fr) repeat(3,minmax(0,1fr));
    gap:18px 24px;align-items:start;
  }
  .studio-left .eyebrow,.studio-left h1,.studio-left>p,.studio-left .rule{grid-column:1}
  .studio-left .step{margin-bottom:0}
  .promo-box{display:none}
  .arch{width:min(100%,520px)}
}
@media (max-width:1180px){
  .studio{grid-template-columns:1fr 1fr;gap:40px}
  .studio-left{grid-column:1/-1;max-width:640px;display:block}
  .studio-strip{grid-template-columns:1fr 1fr;row-gap:24px}
  .help-card{grid-column:1/-1}
  .prod-grid{grid-template-columns:repeat(3,1fr)}
  .story-grid{grid-template-columns:repeat(2,1fr)}
  .eshop-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:860px){
  .main-nav{display:none}
  .menu-toggle{display:flex}
  .hero,.shop-hero{grid-template-columns:1fr}
  .hero{min-height:auto}
  .hero-img,.shop-hero-img{min-height:340px}
  .hero-img{background-position:62% center;margin-left:0}
  .hero-img::after{
    background:
      linear-gradient(0deg,rgba(23,17,15,.12) 0%,rgba(36,23,15,.84) 100%),
      linear-gradient(90deg,rgba(36,23,15,.42),transparent 45%);
  }
  .shop-hero-img::after{background:linear-gradient(0deg,transparent,var(--ink) 96%)}
  .duo{grid-template-columns:1fr}
  .prod-grid{grid-template-columns:repeat(2,1fr)}
  .trust-grid{grid-template-columns:1fr 1fr}
  .footer-grid{grid-template-columns:1fr}
  .footer-tree-grid{grid-template-columns:1fr 1fr;gap:26px 22px}
  .studio{grid-template-columns:1fr;padding:24px 16px 42px;gap:24px}
  .viewer{position:relative;top:auto;min-height:auto}
  .arch{width:min(100%,520px);box-shadow:0 0 0 8px #1d1512,0 28px 60px rgba(0,0,0,.48)}
  .panel{display:grid;gap:14px}
  .panel-section{margin-bottom:0}
  .group-picker{grid-template-columns:repeat(2,minmax(0,1fr))}
  .item-picker{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pick{min-height:34px;padding:7px 8px}
  .pick span{font-size:9.5px}
  .upload-zone{padding:14px}
  .tool-row{grid-template-columns:repeat(4,1fr);gap:8px}
  .tool{padding:9px 3px}
  .enhancement-card{grid-template-columns:1fr}
  .story-grid{grid-template-columns:1fr}
  .eshop-hero-grid,.proof-grid,.quote-grid,.sales-cta-grid{grid-template-columns:1fr}
  .eshop-hero-art{min-height:320px}
  .eshop-grid{grid-template-columns:1fr}
  .split-head{align-items:flex-start;flex-direction:column;gap:12px}
  .contact-grid{grid-template-columns:1fr}
  .wrap{padding:0 22px}
  .header-in{padding:12px 22px}
  .hero-copy{padding:56px 22px 40px}
  .hero h1{font-size:38px}
  .cookie-card{grid-template-columns:1fr}
  .cookie-actions{justify-content:flex-start}
  .cookie-settings{grid-template-columns:1fr}
  .search-bar .wrap{display:grid;grid-template-columns:1fr;gap:10px}
  .search-suggestions{position:static;margin-top:8px}
  .admin-shell{grid-template-columns:1fr}
  .admin-sidebar{
    position:relative;height:auto;padding:16px;border-right:0;border-bottom:1px solid rgba(244,225,196,.1);
  }
  .admin-nav{grid-template-columns:repeat(3,minmax(0,1fr))}
  .admin-nav button{text-align:center;padding:10px 6px;font-size:10px}
  .admin-sidebar-foot{display:none}
  .admin-workspace{padding:22px 16px 42px}
  .admin-topbar,.admin-section-head{align-items:flex-start;flex-direction:column}
  .admin-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .admin-grid-main{grid-template-columns:1fr}
  .admin-kanban{grid-template-columns:repeat(2,minmax(0,1fr))}
  .crm-pipeline-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (min-width:861px){.menu-toggle{display:none}}
@media (max-width:520px){
  .header-in{padding:10px 14px;gap:12px}
  .logo-name{font-size:18px;letter-spacing:.22em}
  .logo-sub{font-size:8px;letter-spacing:.42em}
  .header-icons{gap:10px;flex:0 0 auto}
  .hicon{font-size:0;gap:0;padding:4px}
  .hicon svg{width:20px;height:20px}
  .cart-badge{top:-5px;right:-6px}
  .footer-tree-head{align-items:flex-start;flex-direction:column}
  .footer-tree-grid{grid-template-columns:1fr}
  .group-picker,.item-picker{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tool-row{grid-template-columns:repeat(4,1fr)}
  .studio-left .step{display:none}
  .studio-left .rule{margin:20px 0}
  .viewer{order:1}
  .panel{order:2}
  .studio-left{order:3}
  .studio-strip{padding:28px 18px;grid-template-columns:1fr}
  .modal-backdrop{padding:14px}
  .modal-card{padding:22px 18px}
  .admin-brand b{font-size:17px}
  .admin-nav{grid-template-columns:repeat(2,minmax(0,1fr))}
  .admin-stats,.settings-stats{grid-template-columns:1fr}
  .admin-kanban,.template-sides,.admin-field-row{grid-template-columns:1fr}
  .crm-pipeline-tabs{grid-template-columns:1fr}
  .admin-table{font-size:11.5px}
  .admin-table td{padding-right:6px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    scroll-behavior:auto!important;
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
  }
}

