:root{
  --color-bg:#FBF7F0;
  --color-bg-alt:#F1E9DB;
  --color-surface:#FFFFFF;
  --color-primary:#1F3B2F;
  --color-primary-light:#2F5744;
  --color-primary-dark:#142822;
  --color-secondary:#C9633C;
  --color-secondary-light:#E08A5F;
  --color-accent:#D9A441;
  --color-text:#241F1B;
  --color-text-light:#5A5148;
  --color-border:#E4DACB;

  --radius-sm:8px;
  --radius-md:16px;
  --radius-lg:26px;
  --radius-full:999px;

  --shadow-sm: 0 2px 8px rgba(31,27,20,0.06);
  --shadow-md: -24px 14px 34px -18px rgba(31,59,47,0.22), 0 10px 24px -12px rgba(31,27,20,0.12);
  --shadow-lg: -46px 22px 55px -22px rgba(31,59,47,0.25), -80px 32px 80px -30px rgba(31,59,47,0.14), 0 26px 55px -22px rgba(31,27,20,0.16);
  --shadow-hover: -60px 28px 70px -24px rgba(31,59,47,0.3), -100px 40px 100px -34px rgba(31,59,47,0.16), 0 32px 65px -22px rgba(31,27,20,0.18);

  --ease: cubic-bezier(.4,0,.2,1);
  --transition: .35s var(--ease);
  --nav-pad: 1.6rem;
  --nav-logo-h: 34px;
}

*, *::before, *::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  background:var(--color-bg);
  color:var(--color-text);
  font-family:'Space Grotesk', sans-serif;
  line-height:1.6;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ margin:0; padding:0; list-style:none; }
button{ font-family:inherit; cursor:pointer; }
h1,h2,h3{ font-weight:700; line-height:1.15; margin:0 0 .6em; color:var(--color-primary); }
p{ margin:0 0 1em; color:var(--color-text-light); }

.visually-hidden{
  position:absolute; width:1px; height:1px; overflow:hidden;
  clip:rect(0,0,0,0); white-space:nowrap;
}

.skip-link{
  position:absolute; left:-999px; top:0; background:var(--color-primary); color:#fff;
  padding:.8rem 1.4rem; z-index:1000; border-radius:0 0 8px 0;
}
.skip-link:focus{ left:0; }

h1{ font-size:clamp(2.2rem, 5vw + 1rem, 3.6rem); }
h2{ font-size:clamp(1.7rem, 2.6vw + 1rem, 2.5rem); }
h3{ font-size:clamp(1.1rem, 1vw + .8rem, 1.35rem); }

.eyebrow{
  display:inline-block; font-size:.8rem; font-weight:600; letter-spacing:.08em;
  text-transform:uppercase; color:var(--color-secondary); margin-bottom:.8rem;
}

.section{
  container-type: inline-size;
  padding: clamp(3.5rem, 7vw, 7rem) clamp(1.25rem, 5vw, 4rem);
  max-width:1320px; margin:0 auto;
}
.section--alt{ background:var(--color-bg-alt); max-width:none; }
.section--alt > *{ max-width:1320px; margin-left:auto; margin-right:auto; }
.section--wide{ max-width:none; }
.section header{ margin-bottom:2.6rem; max-width:760px; }
.section header p{ font-size:1.05rem; }


.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  padding:.85rem 1.7rem; border-radius:var(--radius-full); font-weight:600; font-size:.98rem;
  border:2px solid transparent; transition:var(--transition); min-height:48px;
  white-space:nowrap;
}
.btn--primary{
  background:var(--color-secondary); color:#fff;
  box-shadow:-14px 8px 22px -12px rgba(201,99,60,.55), 0 6px 16px -8px rgba(31,27,20,.2);
}
.btn--primary:hover{
  background:var(--color-secondary-light);
  transform:translateY(-2px);
  box-shadow:-22px 14px 32px -14px rgba(201,99,60,.6), 0 10px 22px -8px rgba(31,27,20,.24);
}
.btn--outline{
  background:transparent; color:var(--color-primary); border-color:var(--color-primary);
}
.btn--outline:hover{
  background:var(--color-primary); color:#fff; transform:translateY(-2px);
}
.btn--lg{ padding:1rem 2.2rem; font-size:1.05rem; }


.site-nav{
  position:sticky; top:0; z-index:150; width:100%;
  background:transparent;
  transition: padding var(--transition), background var(--transition), box-shadow var(--transition);
  padding: var(--nav-pad) 0;
}
.site-nav.nav--scrolled{
  --nav-pad: .7rem;
  --nav-logo-h: 24px;
  background:rgba(251,247,240,.94);
  backdrop-filter:blur(10px);
  box-shadow:0 8px 30px -20px rgba(31,27,20,.35);
}
.nav-inner{
  max-width:1320px; margin:0 auto; padding:0 clamp(1.25rem,4vw,3rem);
  display:flex; align-items:center; gap:1.5rem;
}
.nav-logo img{ height:var(--nav-logo-h); width:auto; transition:height var(--transition); }
.nav-main{ margin-left:auto; }
.nav-main ul{ display:flex; gap:1.9rem; }
.nav-main a{
  position:relative; font-weight:500; font-size:.96rem; color:var(--color-primary);
  padding:.3rem 0;
}
.nav-main a::after{
  content:""; position:absolute; left:0; bottom:-2px; height:2px; width:0;
  background:var(--color-secondary); transition:width var(--transition);
}
.nav-main a:hover::after, .nav-main a[aria-current="page"]::after{ width:100%; }
.nav-cta{ margin-left:.5rem; }
@media (max-width: 900px){
  .nav-main, .nav-cta{ display:none; }
}

.hamburger{
  display:none; flex-direction:column; gap:5px; background:none; border:none; padding:.5rem;
  width:44px; height:44px; align-items:center; justify-content:center;
}
.hamburger span{ width:24px; height:2px; background:var(--color-primary); border-radius:2px; transition:var(--transition); }
@media (max-width: 900px){ .hamburger{ display:flex; } }

.mobile-menu{
  position:fixed; inset:0; z-index:200; background:var(--color-primary);
  clip-path:circle(0px at var(--reveal-x, 90%) var(--reveal-y, 5%));
  transition:clip-path .6s var(--ease);
  display:flex; align-items:center; justify-content:center; pointer-events:none;
}
.mobile-menu[data-state="open"]{
  clip-path:circle(150% at var(--reveal-x, 90%) var(--reveal-y, 5%));
  pointer-events:auto;
}
.mobile-menu ul{
  display:flex; flex-direction:column; gap:1.6rem; text-align:center;
  opacity:0; transition:opacity .35s ease;
}
.mobile-menu[data-state="open"] ul{ opacity:1; transition-delay:.3s; }
.mobile-menu a{ color:#fff; font-size:1.5rem; font-weight:600; }
.mobile-menu-close{
  position:absolute; top:1.4rem; right:1.4rem; background:rgba(255,255,255,.12);
  border:none; color:#fff; width:46px; height:46px; border-radius:50%; font-size:1.2rem;
  display:flex; align-items:center; justify-content:center; transition:var(--transition);
}
.mobile-menu-close:hover{ background:rgba(255,255,255,.25); }


.hero{ position:relative; container-type:inline-size; }
.hero-split{ display:flex; min-height:56vh; }
.hero-half{
  flex:1; padding:clamp(2rem,5vw,4rem); display:flex; align-items:flex-end;
  position:relative; overflow:hidden;
}
.hero-half::before{
  content:""; position:absolute; inset:-20% -30%; filter:blur(70px); opacity:.55; z-index:0;
}
.hero-half--before{ background:linear-gradient(120deg,#EDE7DA,#DCD3C1); }
.hero-half--before::before{ background:radial-gradient(circle at 30% 30%, #cabf9f, transparent 60%); }
.hero-half--after{ background:linear-gradient(120deg,var(--color-primary),var(--color-primary-light)); }
.hero-half--after::before{ background:radial-gradient(circle at 70% 40%, var(--color-secondary), transparent 60%); }
.hero-half p{ position:relative; z-index:1; font-size:1.05rem; max-width:420px; }
.hero-half--before p{ color:var(--color-text); }
.hero-half--after p{ color:#F4EFE4; }
.hero-tag{
  position:relative; z-index:1; display:inline-block; margin-bottom:1rem;
  font-size:.78rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  padding:.4rem .9rem; border-radius:var(--radius-full); background:rgba(255,255,255,.6); color:var(--color-text);
}
.hero-tag--accent{ background:rgba(255,255,255,.14); color:#fff; }
.hero-content{
  position:relative; z-index:2; max-width:900px; margin:-3.5rem auto 0; padding:0 clamp(1.25rem,5vw,3rem);
  text-align:center;
}
.hero-content h1{ color:var(--color-primary); }
.hero-lede{ font-size:1.15rem; max-width:640px; margin:0 auto 2rem; }
.hero-actions{ display:flex; gap:1rem; justify-content:center; flex-wrap:wrap; }
@media (max-width: 720px){
  .hero-split{ flex-direction:column; min-height:auto; }
  .hero-half{ align-items:flex-start; padding:2.4rem 1.5rem; }
  .hero-content{ margin-top:-2rem; }
}


.card-grid{ display:grid; grid-template-columns:1fr; gap:1.8rem; }
@container (min-width: 640px){
  .card-grid--why{ grid-template-columns:repeat(2,1fr); }
  .card-grid--process{ grid-template-columns:repeat(2,1fr); }
}
@container (min-width: 980px){
  .card-grid--why{ grid-template-columns:repeat(4,1fr); }
  .card-grid--process{ grid-template-columns:repeat(4,1fr); }
}

.card{
  background:var(--color-surface); border-radius:var(--radius-md);
  border:1px solid var(--color-border);
  box-shadow:var(--shadow-md);
  padding:1.9rem; display:flex; flex-direction:column;
  transition:box-shadow var(--transition), transform var(--transition);
}
.card:hover{ box-shadow:var(--shadow-hover); transform:translateY(-4px); }
.card--icon .card-header{ display:flex; flex-direction:column; gap:.9rem; align-items:flex-start; }
.card--icon .card-header i{
  font-size:1.5rem; color:var(--color-secondary); background:var(--color-bg-alt);
  width:52px; height:52px; border-radius:var(--radius-sm); display:flex; align-items:center; justify-content:center;
}
.card-header h3{ margin:0; }
.card-body{ flex:1; margin:1rem 0 1.2rem; }
.card-footer a{
  font-weight:600; color:var(--color-secondary); font-size:.92rem; display:inline-flex; gap:.4rem; align-items:center;
  border-bottom:2px solid transparent; transition:var(--transition);
}
.card-footer a:hover{ border-color:var(--color-secondary); }
.card--compact{ padding:1.6rem; }
.card-index{
  display:inline-block; font-size:.85rem; font-weight:700; color:var(--color-accent);
  margin-bottom:.4rem;
}


.occasions-grid{
  container-type:inline-size; container-name:occasions;
  display:grid; grid-template-columns:1fr; gap:2.2rem;
}
.occasion-card{
  display:flex; flex-direction:column; background:var(--color-surface);
  border-radius:var(--radius-lg); overflow:hidden; border:1px solid var(--color-border);
  box-shadow:var(--shadow-md); transition:box-shadow var(--transition), transform var(--transition);
}
.occasion-card:hover{ box-shadow:var(--shadow-hover); transform:translateY(-4px); }
.occasion-media{ margin:0; flex:0 0 auto; }
.occasion-media img{ width:100%; height:220px; object-fit:cover; }
.occasion-content{ padding:1.8rem; display:flex; flex-direction:column; flex:1; }
.occasion-label{
  font-size:.75rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  color:var(--color-secondary); display:block; margin-bottom:.3rem;
}
.occasion-content p{ flex:1; }
.link-arrow{ font-weight:600; color:var(--color-primary); display:inline-flex; gap:.4rem; align-items:center; }
@container occasions (min-width: 720px){
  .occasions-grid{ grid-template-columns:repeat(2,1fr); }
  .occasion-card{ flex-direction:row; }
  .occasion-media{ flex:0 0 42%; }
  .occasion-media img{ height:100%; }
}


.manufaktur-swiper{ padding-bottom:3rem; }
.manufaktur-slide{ margin:0; background:var(--color-surface); border-radius:var(--radius-lg); overflow:hidden; border:1px solid var(--color-border); box-shadow:var(--shadow-md); height:100%; }
.manufaktur-slide img{ width:100%; height:220px; object-fit:cover; }
.manufaktur-slide figcaption{ padding:1.6rem; }
.manufaktur-slide figcaption p{ margin:0; font-size:.95rem; }
.swiper-pagination-bullet{ background:var(--color-primary); opacity:.3; }
.swiper-pagination-bullet-active{ opacity:1; background:var(--color-secondary); }


.process-grid{ display:grid; grid-template-columns:1fr; gap:2rem; }
@container (min-width: 700px){ .process-grid{ grid-template-columns:repeat(2,1fr); } }
@container (min-width: 1000px){ .process-grid{ grid-template-columns:repeat(4,1fr); } }
.process-step{
  border-left:3px solid var(--color-secondary); padding-left:1.3rem; position:relative;
}
.process-number{ display:block; font-size:2rem; font-weight:700; color:var(--color-accent); margin-bottom:.4rem; }


.split-media{ display:flex; flex-direction:column; gap:2.4rem; align-items:center; }
.split-media-figure{ margin:0; width:100%; }
.split-media-figure img{
  width:100%; border-radius:var(--radius-lg); box-shadow:var(--shadow-lg);
}
.split-media-text{ width:100%; }
@container (min-width: 860px){
  .split-media{ flex-direction:row; align-items:center; }
  .split-media-figure{ flex:0 0 46%; }
  .split-media-text{ flex:1; }
  .split-media--reverse{ flex-direction:row-reverse; }
}


.sustainability-inner{ display:flex; flex-direction:column; gap:2.4rem; }
.sustainability-media{ margin:0; }
.sustainability-media img{ width:100%; border-radius:var(--radius-lg); box-shadow:var(--shadow-lg); }
@container (min-width: 860px){
  .sustainability-inner{ flex-direction:row; align-items:center; }
  .sustainability-text{ flex:1; }
  .sustainability-media{ flex:0 0 44%; }
}
.meter-block{ margin:1.6rem 0; }
.meter-block label{ display:block; font-weight:600; margin-bottom:.5rem; font-size:.9rem; }
meter{ width:100%; height:14px; border-radius:var(--radius-full); }
.meter-value{ display:inline-block; margin-top:.4rem; font-size:.85rem; color:var(--color-text-light); }


.details-block{
  background:var(--color-surface); border:1px solid var(--color-border); border-left:4px solid var(--color-accent);
  border-radius:var(--radius-sm); padding:1.1rem 1.4rem; margin-bottom:1rem;
}
.details-block summary{ font-weight:600; cursor:pointer; color:var(--color-primary); }
.details-block p{ margin-top:.8rem; margin-bottom:0; }
.faq-list{ display:flex; flex-direction:column; gap:.4rem; }


.cta-section{ text-align:center; }
.cta-inner{ max-width:640px; margin:0 auto; }
.cta-inner h2{ margin-bottom:.6rem; }


.page-hero{ background:linear-gradient(135deg,var(--color-primary),var(--color-primary-light)); position:relative; overflow:hidden; }
.page-hero::before{
  content:""; position:absolute; inset:-10% -20%; background:radial-gradient(circle at 20% 30%, rgba(201,99,60,.35), transparent 55%);
  filter:blur(50px);
}
.page-hero-inner{
  position:relative; z-index:1; max-width:760px; margin:0 auto; padding:clamp(4rem,9vw,6.5rem) clamp(1.25rem,5vw,3rem) clamp(3rem,6vw,4rem);
  text-align:center;
}
.page-hero-inner h1{ color:#fff; }
.page-hero-inner p{ color:#EFE7D8; font-size:1.1rem; }
.page-hero .eyebrow{ color:var(--color-secondary-light); }


.contact-methods header{ max-width:820px; }
.table-wrap{ overflow-x:auto; border-radius:var(--radius-md); box-shadow:var(--shadow-md); }
.compare-table{ width:100%; border-collapse:collapse; background:var(--color-surface); min-width:600px; }
.compare-table th, .compare-table td{ padding:1rem 1.3rem; text-align:left; border-bottom:1px solid var(--color-border); }
.compare-table thead th{ background:var(--color-primary); color:#fff; font-weight:600; }
.compare-table i{ margin-right:.5rem; color:var(--color-secondary); }
.compare-table tbody tr:hover{ background:var(--color-bg-alt); }

.contact-form{ max-width:720px; margin:0 auto; }
.accordion-field{
  border:1px solid var(--color-border); border-radius:var(--radius-md); margin-bottom:1rem; overflow:hidden;
  background:var(--color-surface); box-shadow:var(--shadow-sm);
}
.accordion-field-head{
  width:100%; display:flex; align-items:center; gap:1rem; padding:1.2rem 1.5rem; background:none;
  border:none; font-size:1.05rem; font-weight:600; color:var(--color-primary); text-align:left;
}
.accordion-field-head i{ margin-left:auto; transition:transform var(--transition); }
.accordion-step{
  width:30px; height:30px; border-radius:50%; background:var(--color-bg-alt); color:var(--color-secondary);
  display:flex; align-items:center; justify-content:center; font-size:.8rem; font-weight:700; flex:0 0 auto;
}
.accordion-field-body{
  max-height:0; overflow:hidden; transition:max-height .5s var(--ease), padding var(--transition);
  padding:0 1.5rem;
}
.accordion-field[data-open="true"] .accordion-field-body{ max-height:600px; padding:0 1.5rem 1.5rem; }
.accordion-field[data-open="true"] .accordion-field-head i{ transform:rotate(180deg); }
.form-row{ margin-bottom:1.2rem; display:flex; flex-direction:column; gap:.4rem; }
.form-row label{ font-weight:600; font-size:.92rem; }
.form-row input[type="text"], .form-row input[type="email"], .form-row textarea{
  padding:.85rem 1rem; border:1px solid var(--color-border); border-radius:var(--radius-sm);
  font-family:inherit; font-size:1rem; background:var(--color-bg); transition:var(--transition);
}
.form-row input:focus, .form-row textarea:focus{
  outline:none; border-color:var(--color-secondary); box-shadow:0 0 0 3px rgba(201,99,60,.15);
}
.form-row--checkbox{ flex-direction:row; align-items:flex-start; gap:.7rem; }
.form-row--checkbox input{ margin-top:.3rem; width:20px; height:20px; flex:0 0 auto; }
.form-row--checkbox label{ font-weight:400; font-size:.95rem; }

.contact-map{ }
.map-embed{ border-radius:var(--radius-md); overflow:hidden; box-shadow:var(--shadow-md); }
.map-embed iframe{ display:block; }


.thanks-page{ text-align:center; padding-top:clamp(4rem,8vw,6rem); padding-bottom:clamp(4rem,8vw,6rem); }
.thanks-inner{ max-width:560px; margin:0 auto; }
.thanks-icon{ font-size:4.2rem; color:var(--color-secondary); margin-bottom:1.4rem; }


.legal-page header{ max-width:800px; margin:0 auto 2.5rem; text-align:left; }
.legal-body{ max-width:800px; margin:0 auto; }
.legal-body h2{ margin-top:2.2rem; }
.legal-body--clauses h2{ border-bottom:2px solid var(--color-border); padding-bottom:.4rem; }
.legal-body--lettered h2{ color:var(--color-secondary); }
.term{ color:var(--color-secondary); }
.definition-box{
  background:var(--color-bg-alt); border-left:4px solid var(--color-accent);
  border-radius:var(--radius-sm); padding:1rem 1.3rem; margin:1rem 0; font-size:.92rem;
}
.definition-box strong{ display:block; margin-bottom:.3rem; color:var(--color-primary); }
.impressum-table{ width:100%; border-collapse:collapse; margin:1rem 0 1.6rem; }
.impressum-table th, .impressum-table td{ text-align:left; padding:.7rem 1rem; border-bottom:1px solid var(--color-border); }
.impressum-table th{ width:38%; color:var(--color-primary); font-weight:600; }


.footer{ background:var(--color-primary); padding:clamp(3rem,6vw,5rem) clamp(1.25rem,5vw,3rem) 2rem; margin-top:auto; }
.footer-inner{ max-width:1320px; margin:0 auto; }
.footer-grid{ display:grid; grid-template-columns:1fr; gap:1.4rem; }
@container (min-width: 700px){ .footer-grid{ grid-template-columns:repeat(2,1fr); } }
.footer-card{
  background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12); border-radius:var(--radius-md);
  padding:1.6rem; color:#EFE7D8;
}
.footer-card h3{ color:#fff; font-size:1.05rem; margin-bottom:.9rem; }
.footer-card p, .footer-card address{ color:#D9CEB9; font-style:normal; font-size:.92rem; }
.footer-logo{ height:28px; margin-bottom:.4rem; filter:brightness(0) invert(1); }
.footer-links{ display:flex; flex-direction:column; gap:.6rem; }
.footer-links a{ color:#D9CEB9; font-size:.92rem; transition:var(--transition); }
.footer-links a:hover{ color:var(--color-secondary-light); }
.footer-card address a{ color:#EFE7D8; }
.footer-bottom{ text-align:center; margin-top:2.4rem; }
.footer-bottom p{ color:#B9AF98; font-size:.85rem; margin:0; }


.hero, .why-choose, .occasions, .manufakturen, .process, .sustainability, .faq, .cta-section, .contact-methods, .contact-form-section, .contact-map, .legal-page{
  container-type:inline-size;
}


.cookie-consent{
  position:fixed; bottom:20px; left:50%; transform:translateX(-50%);
  width:min(92vw,420px); background:var(--color-surface); border-radius:var(--radius-lg);
  box-shadow:var(--shadow-lg); z-index:400; overflow:hidden;
  transition:width .5s var(--ease), max-height .5s var(--ease);
  max-height:260px; border:1px solid var(--color-border);
}
.cookie-consent[data-state="hidden"]{ display:none; }
.cookie-consent[data-state="expanded"]{ width:min(92vw,540px); max-height:86vh; overflow-y:auto; }
.cookie-consent-compact{ padding:1.4rem 1.6rem; }
.cookie-consent-compact p{ font-size:.9rem; margin-bottom:1rem; }
.cookie-consent-compact a{ color:var(--color-secondary); font-weight:600; }
.cookie-consent-actions{ display:flex; gap:.8rem; flex-wrap:wrap; }
.cookie-consent-panel{ display:none; padding:1.5rem 1.7rem; }
.cookie-consent[data-state="expanded"] .cookie-consent-compact{ display:none; }
.cookie-consent[data-state="expanded"] .cookie-consent-panel{ display:block; }
.cookie-consent-panel h3{ margin-bottom:1rem; }
.cookie-category{ padding:.9rem 0; border-bottom:1px solid var(--color-border); }
.cookie-category-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:.4rem; }
.cookie-category p{ font-size:.85rem; margin:0; }
.switch{ position:relative; display:inline-block; width:42px; height:24px; }
.switch input{ opacity:0; width:0; height:0; }
.switch span{
  position:absolute; inset:0; background:var(--color-border); border-radius:var(--radius-full); transition:var(--transition);
}
.switch span::before{
  content:""; position:absolute; height:18px; width:18px; left:3px; top:3px; background:#fff; border-radius:50%;
  transition:var(--transition); box-shadow:var(--shadow-sm);
}
.switch input:checked + span{ background:var(--color-secondary); }
.switch input:checked + span::before{ transform:translateX(18px); }

@media (max-width: 480px){
  .cookie-consent-actions{ flex-direction:column; }
  .cookie-consent-actions .btn{ width:100%; }
}