/* ============ TOKENS ============ */
:root{
  --moss-900:#232b1e;
  --moss-700:#3f4a35;
  --moss-500:#6b7a4f;
  --lichen-400:#9fae7a;
  --lichen-200:#d8e0c3;
  --stone-100:#f3f0e7;
  --stone-50:#faf8f2;
  --gold:#c9a24b;
  --gold-deep:#a97f2c;
  --ink:#232b1e;
  --paper:#faf8f2;
  --danger:#8a3324;
  --font-display:"Rockwell","Georgia","Iowan Old Style",serif;
  --font-body:"Avenir Next","Segoe UI",system-ui,sans-serif;
  --font-mono:"Courier New",monospace;
  --radius:10px;
  --shadow-paper:0 10px 30px -12px rgba(35,43,30,.35);
  --maxw:1180px;
}
*{box-sizing:border-box}
html,body{overflow-x:clip}
html{scroll-behavior:smooth}
body{
  margin:0;font-family:var(--font-body);color:var(--ink);background:var(--stone-50);
  line-height:1.5;font-size:16px;
}
img{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3,h4{font-family:var(--font-display);line-height:1.1;margin:0 0 .5em}
.skip-link{position:absolute;left:-999px;top:0;background:var(--gold);color:var(--moss-900);padding:.5em 1em;z-index:999}
.skip-link:focus{left:0}
:focus-visible{outline:3px solid var(--gold-deep);outline-offset:2px}

/* ============ UTILITIES ============ */
.container{max-width:var(--maxw);margin:0 auto;padding:0 20px}
.section{padding:clamp(48px,8vw,96px) 0}
.grid{display:grid;gap:24px}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-4{grid-template-columns:repeat(4,1fr)}
@media (max-width:900px){.grid-3,.grid-4{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}}
.mt-0{margin-top:0}.mb-0{margin-bottom:0}
.flex{display:flex}.items-center{align-items:center}.justify-between{justify-content:space-between}
.gap-sm{gap:8px}.gap-md{gap:16px}.gap-lg{gap:32px}
.text-center{text-align:center}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
.hp-field{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}

/* ============ REVEAL ============ */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease, clip-path .7s ease}
.reveal.in-view{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.reveal{transition:none;opacity:1;transform:none}}
.reveal-delay-1{transition-delay:.08s}
.reveal-delay-2{transition-delay:.16s}
.reveal-delay-3{transition-delay:.24s}
.reveal-delay-4{transition-delay:.32s}

/* ============ HEADER ============ */
.header-stripe{height:6px;background:repeating-linear-gradient(45deg,var(--gold) 0 14px,var(--moss-700) 14px 28px)}
.site-header{position:sticky;top:0;z-index:50;background:var(--stone-50);border-bottom:3px solid var(--moss-900)}
.header-inner{max-width:var(--maxw);margin:0 auto;padding:14px 20px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none}
.logo-mark{flex:none;width:44px;height:44px}
.logo-word{font-family:var(--font-display);font-size:1.4rem;letter-spacing:.02em;color:var(--moss-900)}
.logo-word span{color:var(--gold-deep)}
.site-nav{display:flex;align-items:center;gap:22px}
.site-nav a{text-decoration:none;font-weight:600;color:var(--moss-900);position:relative;padding:4px 0}
.site-nav a:not(.nav-cart)::after{content:"";position:absolute;left:0;bottom:-2px;width:0;height:2px;background:var(--gold-deep);transition:width .25s ease}
.site-nav a:not(.nav-cart):hover::after,.site-nav a.is-active::after{width:100%}
.nav-cart{display:flex;align-items:center;gap:6px;background:var(--moss-900);color:var(--stone-50);padding:8px 14px;border-radius:999px}
.cart-count{background:var(--gold);color:var(--moss-900);border-radius:999px;min-width:22px;text-align:center;font-size:.8rem;padding:1px 6px;font-weight:700}
.cart-count.is-empty{background:var(--lichen-400)}
.cart-count.bump{animation:bump .35s ease}
@keyframes bump{0%{transform:scale(1)}40%{transform:scale(1.4)}100%{transform:scale(1)}}
.nav-toggle{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:8px;width:44px;height:44px;justify-content:center;align-items:center}
.nav-toggle span{width:24px;height:2px;background:var(--moss-900);display:block}
@media (max-width:860px){
  .nav-toggle{display:flex}
  .site-nav{position:fixed;top:0;right:0;height:100vh;width:min(320px,80vw);background:var(--moss-900);flex-direction:column;align-items:flex-start;padding:90px 28px;gap:22px;
    transform:translateX(100%);visibility:hidden;transition:transform .3s ease,visibility .3s ease;z-index:60}
  .site-nav.is-open{transform:translateX(0);visibility:visible}
  .site-nav a{color:var(--stone-50)}
  .nav-cart{background:var(--gold);color:var(--moss-900)}
}

/* ============ HERO ============ */
.hero{position:relative;overflow:hidden;background:var(--moss-900);color:var(--stone-50);padding:clamp(60px,10vw,120px) 0}
.hero-grain{position:absolute;inset:0;width:100%;height:100%;opacity:.25;pointer-events:none}
.hero-layers{position:relative;max-width:var(--maxw);margin:0 auto;padding:0 20px;display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center}
@media (max-width:860px){.hero-layers{grid-template-columns:1fr}}
.hero-eyebrow{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-mono);letter-spacing:.14em;text-transform:uppercase;font-size:.8rem;color:var(--gold);margin-bottom:14px}
.hero h1{font-size:clamp(2.6rem,6vw,4.6rem);color:var(--stone-50);margin-bottom:.3em}
.hero p.lead{font-size:1.15rem;max-width:40ch;color:var(--lichen-200)}
.hero-art{position:relative;aspect-ratio:1/1}
.hero-art svg{width:100%;height:100%}
.hero-cta{display:flex;gap:16px;margin-top:28px;flex-wrap:wrap}

/* ============ BUTTONS ============ */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font-family:var(--font-body);font-weight:700;font-size:.95rem;
  padding:13px 28px;border-radius:999px;border:2px solid var(--moss-900);
  background:var(--moss-900);color:var(--stone-50);text-decoration:none;cursor:pointer;
  position:relative;overflow:hidden;isolation:isolate;min-height:44px;
}
.btn::before{content:"";position:absolute;inset:0;left:-100%;width:100%;background:var(--gold);z-index:-1;transition:left .3s ease}
.btn:hover::before{left:0}
.btn:hover{color:var(--moss-900)}
.btn-gold{background:var(--gold);border-color:var(--gold);color:var(--moss-900)}
.btn-gold::before{background:var(--moss-900)}
.btn-gold:hover{color:var(--stone-50)}
.btn-ghost{background:transparent;color:var(--moss-900)}
.btn-ghost::before{background:var(--moss-900)}
.btn-ghost:hover{color:var(--stone-50)}
.btn-ghost-dark{background:transparent;color:var(--stone-50);border-color:var(--stone-50)}
.btn-ghost-dark::before{background:var(--stone-50)}
.btn-ghost-dark:hover{color:var(--moss-900)}
.btn-small{padding:9px 18px;font-size:.85rem}
.btn:disabled{opacity:.6;cursor:not-allowed}
.btn-block{width:100%}

/* ============ MARQUEE / TICKET DECOR ============ */
.marquee-strip{background:var(--gold);color:var(--moss-900);overflow:hidden;white-space:nowrap;padding:10px 0;font-family:var(--font-mono);letter-spacing:.08em;text-transform:uppercase;font-weight:700;font-size:.85rem}
.marquee-strip span{display:inline-block;padding-right:40px}
.ticket{position:relative;background:var(--stone-100);border:2px dashed var(--moss-700);border-radius:8px;padding:20px}
.ticket::before,.ticket::after{content:"";position:absolute;width:18px;height:18px;background:var(--stone-50);border-radius:50%;top:50%;transform:translateY(-50%)}
.ticket::before{left:-10px}
.ticket::after{right:-10px}
.starburst{filter:drop-shadow(0 4px 10px rgba(0,0,0,.25))}

/* ============ SECTION DIVIDERS ============ */
.divider-tear{color:var(--moss-900);width:100%;height:28px;display:block}

/* ============ SIGNATURE FEATURE: Kalkulator Gozbe ============ */
.feast{background:var(--lichen-200);position:relative;overflow:hidden}
.feast-inner{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start}
@media (max-width:860px){.feast-inner{grid-template-columns:1fr}}
.feast-card{background:var(--stone-50);border-radius:var(--radius);padding:32px;box-shadow:var(--shadow-paper);border:3px solid var(--moss-900)}
.feast-field{margin-bottom:18px}
.feast-field label{display:block;font-weight:700;margin-bottom:6px}
.feast-field input[type=range]{width:100%;accent-color:var(--gold-deep)}
.feast-field select{width:100%;padding:10px;border-radius:6px;border:2px solid var(--moss-700);font-size:1rem}
.feast-value{font-family:var(--font-mono);color:var(--gold-deep);font-weight:700}
.feast-result{background:var(--moss-900);color:var(--stone-50);border-radius:var(--radius);padding:28px;position:relative}
.feast-result .amount{font-family:var(--font-display);font-size:2.4rem;color:var(--gold)}
.feast-result ul{list-style:none;padding:0;margin:16px 0 0;display:grid;gap:10px}
.feast-result li{display:flex;justify-content:space-between;border-bottom:1px solid rgba(255,255,255,.2);padding-bottom:8px}

/* ============ PRODUCT CARDS / CATALOG ============ */
.product-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
@media (max-width:900px){
  .product-strip{grid-auto-flow:column;grid-auto-columns:78%;grid-template-columns:unset;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:12px}
  .product-strip .product-card{scroll-snap-align:start}
}
.product-card{background:var(--stone-50);border:1px solid var(--lichen-400);border-radius:var(--radius);overflow:hidden;transition:transform .25s ease,box-shadow .25s ease;display:flex;flex-direction:column}
.product-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-paper)}
.product-card .thumb{aspect-ratio:4/3;overflow:hidden}
.product-card .thumb img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
.product-card:hover .thumb img{transform:scale(1.08)}
.product-card .body{padding:16px;display:flex;flex-direction:column;gap:8px;flex:1}
.product-card h3{font-size:1.1rem;margin:0}
.product-card .price{font-family:var(--font-mono);font-weight:700;color:var(--gold-deep);font-size:1.1rem}
.product-card .badge{position:absolute;margin:10px;background:var(--gold);color:var(--moss-900);font-size:.75rem;font-weight:700;padding:4px 10px;border-radius:999px}
.product-card .cat{font-family:var(--font-mono);font-size:.75rem;text-transform:uppercase;letter-spacing:.08em;color:var(--moss-500)}

/* ============ INNER-PAGE COMPONENTS (for second writer) ============ */
.page-hero{background:var(--moss-900);color:var(--stone-50);padding:60px 0 50px;position:relative}
.page-hero h1{color:var(--stone-50);font-size:clamp(2rem,5vw,3.2rem)}
.page-hero p{color:var(--lichen-200);max-width:60ch}

.breadcrumbs{font-family:var(--font-mono);font-size:.85rem;display:flex;gap:6px;flex-wrap:wrap;color:var(--lichen-200)}
.breadcrumbs a{text-decoration:underline;color:inherit}

.prose{max-width:68ch;margin:0 auto}
.prose h2{margin-top:1.8em}
.prose p,.prose li{line-height:1.7}
.prose ul,.prose ol{padding-left:1.4em}

.notice{border-radius:var(--radius);padding:18px 22px;border:2px solid var(--moss-700);background:var(--lichen-200)}
.notice-warning{border-color:var(--gold-deep);background:#f6ead0}
.notice-danger{border-color:var(--danger);background:#f3dcd6}

.form-grid{display:grid;gap:18px;grid-template-columns:repeat(2,1fr)}
@media (max-width:640px){.form-grid{grid-template-columns:1fr}}
.field{display:flex;flex-direction:column;gap:6px}
.field.full{grid-column:1/-1}
.field label{font-weight:700}
.field input,.field select,.field textarea{
  padding:12px 14px;border:2px solid var(--moss-700);border-radius:6px;font-size:1rem;font-family:inherit;background:var(--stone-50);
  min-height:44px;accent-color:var(--gold-deep);
}
.field textarea{min-height:120px;resize:vertical}
.field-error{color:var(--danger);font-size:.85rem;min-height:1.2em}
.form-status{min-height:1.4em;font-weight:700}
.form-status.is-success{color:var(--moss-700)}
.form-status.is-error{color:var(--danger)}

.faq{display:grid;gap:14px;max-width:72ch;margin:0 auto}
.faq-item{border:2px solid var(--moss-700);border-radius:var(--radius);background:var(--stone-50);overflow:hidden}
.faq-item summary{cursor:pointer;padding:16px 20px;font-weight:700;list-style:none;display:flex;justify-content:space-between;align-items:center}
.faq-item summary::after{content:"+";font-size:1.4rem;color:var(--gold-deep)}
.faq-item[open] summary::after{content:"\2212"}
.faq-item .faq-answer{padding:0 20px 18px;line-height:1.6}

.product-detail{display:grid;grid-template-columns:1fr 1fr;gap:40px}
@media (max-width:860px){.product-detail{grid-template-columns:1fr}}
.product-detail .gallery img{border-radius:var(--radius);aspect-ratio:4/3;object-fit:cover}
.product-detail .price{font-family:var(--font-mono);font-size:1.8rem;color:var(--gold-deep);font-weight:700}
.qty-stepper{display:flex;align-items:center;border:2px solid var(--moss-700);border-radius:999px;overflow:hidden;width:fit-content}
.qty-stepper button{background:none;border:0;width:44px;height:44px;font-size:1.2rem;cursor:pointer}
.qty-stepper input{width:48px;border:0;text-align:center;font-size:1rem}

.cart-table{width:100%;border-collapse:collapse}
.cart-table th,.cart-table td{padding:14px 10px;border-bottom:1px solid var(--lichen-400);text-align:left}
.cart-table img{width:64px;height:64px;object-fit:cover;border-radius:6px}
.cart-summary{background:var(--lichen-200);border-radius:var(--radius);padding:24px;max-width:380px;margin-left:auto;display:grid;gap:12px}
.cart-summary .total-row{font-weight:700;font-size:1.2rem;border-top:2px solid var(--moss-900);padding-top:12px}

.contact-layout{display:grid;grid-template-columns:1fr 1fr;gap:40px}
@media (max-width:860px){.contact-layout{grid-template-columns:1fr}}
.contact-info{display:grid;gap:18px}
.contact-info a,.contact-info p{display:flex;align-items:center;gap:10px;text-decoration:none}

.legal-toc{background:var(--lichen-200);border-radius:var(--radius);padding:20px 24px;margin-bottom:32px}
.legal-toc ol{margin:0;padding-left:1.2em}
.legal-toc a{text-decoration:underline}

/* ============ ICON ROW ============ */
.icon-row{display:flex;gap:28px;flex-wrap:wrap}
.icon-row .icon-item{display:flex;align-items:center;gap:10px;font-weight:700}
.icon-row svg{color:var(--gold-deep)}

/* ============ TOAST / COOKIE ============ */
.mz-toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(20px);background:var(--moss-900);color:var(--stone-50);padding:12px 24px;border-radius:999px;opacity:0;transition:opacity .3s ease,transform .3s ease;z-index:200;pointer-events:none}
.mz-toast.is-visible{opacity:1;transform:translateX(-50%) translateY(0)}

.cookie-banner{position:fixed;left:0;right:0;bottom:0;background:var(--moss-900);color:var(--stone-50);padding:18px 24px;display:flex;gap:18px;align-items:center;justify-content:space-between;flex-wrap:wrap;transform:translateY(110%);transition:transform .35s ease;z-index:150}
.cookie-banner.is-visible{transform:translateY(0)}
.cookie-banner a{color:var(--gold);text-decoration:underline}
.cookie-actions{display:flex;gap:10px}

/* ============ FOOTER ============ */
.site-footer{background:var(--moss-900);color:var(--lichen-200);padding-top:50px}
.footer-inner{max-width:var(--maxw);margin:0 auto;padding:0 20px 40px;display:grid;grid-template-columns:1.3fr 2fr 1fr;gap:40px}
@media (max-width:860px){.footer-inner{grid-template-columns:1fr}}
.footer-brand p{max-width:34ch}
.logo-footer .logo-word{color:var(--stone-50)}
.newsletter-form{margin-top:18px}
.newsletter-form label{font-weight:700;display:block;margin-bottom:8px;color:var(--stone-50)}
.newsletter-row{display:flex;gap:8px}
.newsletter-row input{flex:1;padding:12px;border-radius:6px;border:0;min-height:44px}
.footer-nav{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.footer-col h3{color:var(--gold);font-size:1rem;margin-bottom:10px}
.footer-col a{display:block;text-decoration:none;color:var(--lichen-200);padding:4px 0}
.footer-col a:hover{color:var(--gold)}
.footer-contact a,.footer-contact p{display:flex;align-items:center;gap:8px;text-decoration:none;color:var(--lichen-200);margin:0 0 10px}
.footer-bottom{border-top:1px solid rgba(255,255,255,.15);padding:18px 20px;text-align:center;font-size:.85rem}

/* COMPONENTS: .page-hero - dark hero band for inner pages */
/* COMPONENTS: .breadcrumbs - small nav trail under page-hero */
/* COMPONENTS: .prose - readable long-form legal/text container */
/* COMPONENTS: .notice / .notice-warning / .notice-danger - callout boxes */
/* COMPONENTS: .btn / .btn-gold / .btn-ghost / .btn-ghost-dark / .btn-small / .btn-block - button variants with fill-sweep hover */
/* COMPONENTS: .form-grid / .field / .field.full / .field-error / .form-status - form layout and validation */
/* COMPONENTS: .faq / .faq-item - details/summary accordion */
/* COMPONENTS: .product-detail / .qty-stepper - single product page layout */
/* COMPONENTS: .cart-table / .cart-summary - checkout page layout */
/* COMPONENTS: .contact-layout / .contact-info - contact page split layout */
/* COMPONENTS: .legal-toc - table of contents box for legal pages */
/* COMPONENTS: .icon-row / .icon-item - inline icon+label row using the sprite */
/* COMPONENTS: .ticket - dashed ticket-stub decorative box */
/* COMPONENTS: .marquee-strip - scrolling circus marquee text band */
/* COMPONENTS: .product-card / .product-strip - catalog grid/scroll-snap cards */
/* COMPONENTS: .feast / .feast-card / .feast-result - signature feature styling */
/* COMPONENTS: .mz-toast - transient confirmation toast */
/* COMPONENTS: .cookie-banner - fixed bottom consent banner */
/* COMPONENTS: .reveal / .reveal-delay-1..4 - scroll-reveal animation hooks */

/* ============ HERO ============ */
.hero-text {
  font-family: var(--font-display);
  font-size: clamp(28px, 6vw, 56px);
  line-height: 1.1;
  color: var(--moss-900);
  margin: 0 0 0.5em;
}

/* ============ FORMS ============ */
.contact-form,
.checkout-form {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

/* ============ CART ============ */
.cart-items {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.cart-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px;
  background: var(--stone-100);
  border-radius: var(--radius);
  justify-content: space-between;
}

.qty-minus,
.qty-plus,
.qty-remove {
  width: 32px;
  height: 32px;
  padding: 0;
  border: 1px solid var(--lichen-400);
  background: var(--stone-50);
  border-radius: 4px;
  font-size: 16px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-body);
  transition: all 0.2s ease;
}

.qty-minus:hover,
.qty-plus:hover {
  background: var(--lichen-200);
  border-color: var(--moss-700);
}

.qty-remove {
  color: var(--danger);
}

.qty-remove:hover {
  background: var(--danger);
  color: var(--stone-50);
  border-color: var(--danger);
}

.hidden-cart,
.hidden-total {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  opacity: 0;
}

@media (max-width: 560px) {
  .hero-text {
    font-size: clamp(20px, 5vw, 36px);
  }
  
  .cart-row {
    flex-wrap: wrap;
    gap: 8px;
  }
}

/* wg-contrast-autofix */
header.site-header div.header-inner nav.site-nav a.nav-cart { color: #ffffff !important; }