/* ===== Café Schmidt — Shop (Prototyp), dunkles Confiserie-Design ===== */
@font-face{font-family:'Bodoni Moda';font-weight:500;font-display:swap;src:url(/fonts/bodoni-500.woff2) format('woff2');}
@font-face{font-family:'Bodoni Moda';font-weight:700;font-display:swap;src:url(/fonts/bodoni-700.woff2) format('woff2');}
@font-face{font-family:'Hanken Grotesk';font-weight:400;font-display:swap;src:url(/fonts/hanken-400.woff2) format('woff2');}
@font-face{font-family:'Hanken Grotesk';font-weight:600;font-display:swap;src:url(/fonts/hanken-600.woff2) format('woff2');}
:root{
  --cocoa:#1d120d;--cocoa-2:#261811;--cocoa-3:#33211a;--gold:#c8a15c;--gold-2:#e7ce98;--cream:#efe6d5;--cream-dim:#b6a892;--kirsch:#b23a2c;
  --line:rgba(200,161,92,.22);--line-2:rgba(200,161,92,.12);
  --display:'Bodoni Moda',Georgia,serif;--body:'Hanken Grotesk',system-ui,sans-serif;--wrap:1200px;--gutter:clamp(1.25rem,4vw,3rem);--ease:cubic-bezier(.2,.7,.2,1);
}
*,*::before,*::after{box-sizing:border-box;margin:0;}
html{scroll-behavior:smooth;}
body{background:var(--cocoa);color:var(--cream);font-family:var(--body);line-height:1.7;-webkit-font-smoothing:antialiased;overflow-x:hidden;}
img{display:block;max-width:100%;}
a{color:inherit;text-decoration:none;}
h1,h2,h3{font-family:var(--display);font-weight:500;line-height:1.05;letter-spacing:-.01em;}
:focus-visible{outline:2px solid var(--gold-2);outline-offset:3px;border-radius:2px;}
.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gutter);}
.foil{background:linear-gradient(100deg,#8f6a34,#c8a15c 19%,#ebd79a 37%,#fff3cf 50%,#ebd79a 63%,#c8a15c 81%,#8f6a34);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:foil 9s ease-in-out infinite;}
@keyframes foil{0%{background-position:8% 0}50%{background-position:92% 0}100%{background-position:8% 0}}
.skip{position:fixed;top:8px;left:8px;z-index:120;background:var(--cocoa-2);color:var(--gold-2);padding:.7rem 1.1rem;border:1px solid var(--gold);border-radius:3px;transform:translateY(-160%);transition:transform .2s;}
.skip:focus{transform:none;}
.eyebrow{font-family:var(--body);font-size:.72rem;font-weight:600;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);display:inline-flex;align-items:center;gap:.8rem;}
.eyebrow::before{content:"";width:28px;height:1px;background:var(--gold);}

/* Prototyp-Banner */
.protobar{background:rgba(178,58,44,.16);border-bottom:1px solid rgba(178,58,44,.45);color:#f2cdc6;font-size:.8rem;text-align:center;padding:.5rem 1rem;}
.protobar strong{color:#fff;}

/* Header */
.shophead{position:sticky;top:0;z-index:40;background:rgba(20,12,8,.9);backdrop-filter:blur(10px);border-bottom:1px solid var(--line-2);}
.shophead__in{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;padding-block:1rem;}
.brand{display:flex;flex-direction:column;line-height:1;}
.brand__name{font-family:var(--display);font-weight:700;font-size:1.5rem;}
.brand__sub{font-size:.54rem;letter-spacing:.32em;text-transform:uppercase;color:var(--cream-dim);margin-top:.35rem;}
.shopnav{display:flex;align-items:center;gap:1.6rem;}
.shopnav a{font-size:.85rem;letter-spacing:.04em;color:var(--cream-dim);transition:color .25s;}
.shopnav a:hover,.shopnav a[aria-current]{color:var(--gold-2);}
.cartbtn{position:relative;display:inline-flex;align-items:center;gap:.5rem;background:none;border:1px solid var(--line);color:var(--cream);border-radius:999px;padding:.5rem .9rem;cursor:pointer;font-family:var(--body);font-size:.85rem;transition:border-color .25s,color .25s;}
.cartbtn:hover{border-color:var(--gold);color:var(--gold-2);}
.cartbtn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;}
.cartbtn__count{position:absolute;top:-7px;right:-7px;min-width:19px;height:19px;padding:0 5px;border-radius:999px;background:var(--kirsch);color:#fff;font-size:.68rem;font-weight:600;display:grid;place-content:center;}
.cartbtn__count:empty,.cartbtn__count[data-n="0"]{display:none;}
@media(max-width:640px){.shopnav a:not(.cart-wrap){display:none;}}

/* Intro */
.shopintro{padding-block:clamp(2.5rem,6vw,4.5rem) 1rem;}
.shopintro h1{font-size:clamp(2.2rem,6vw,4rem);margin:.9rem 0 .7rem;}
.shopintro p{color:var(--cream-dim);max-width:60ch;}

/* Kategorie-Chips */
.chips{display:flex;flex-wrap:wrap;gap:.6rem;margin:clamp(1.6rem,3vw,2.4rem) 0 0;}
.chip{border:1px solid var(--line);border-radius:999px;padding:.45rem 1.05rem;font-size:.82rem;color:var(--cream-dim);background:none;cursor:pointer;transition:all .25s;}
.chip:hover{border-color:var(--gold);color:var(--gold-2);}
.chip[aria-pressed="true"]{background:var(--gold);border-color:var(--gold);color:#241608;font-weight:600;}

/* Produktgitter */
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:clamp(1.1rem,2.4vw,1.9rem);margin-block:clamp(1.8rem,4vw,3rem);}
.pcard{display:flex;flex-direction:column;border:1px solid var(--line-2);border-radius:4px;overflow:hidden;background:var(--cocoa-2);transition:box-shadow .4s,border-color .3s,transform .3s var(--ease);}
.pcard:hover{border-color:var(--line);box-shadow:0 24px 50px -30px #000,0 0 34px -14px rgba(200,161,92,.3);transform:translateY(-3px);}
.pcard__media{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--cocoa-3);}
.pcard__media img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease);}
.pcard:hover .pcard__media img{transform:scale(1.06);}
.pcard__tag{position:absolute;top:.6rem;left:.6rem;background:rgba(20,12,8,.82);color:var(--gold-2);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;padding:.25rem .55rem;border-radius:999px;border:1px solid var(--line);}
.pcard__body{padding:1.1rem 1.1rem 1.2rem;display:flex;flex-direction:column;gap:.5rem;flex:1;}
.pcard__cat{font-size:.66rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);}
.pcard__name{font-family:var(--display);font-size:1.22rem;}
.pcard__name a:hover{color:var(--gold-2);}
.pcard__desc{font-size:.88rem;color:var(--cream-dim);flex:1;}
.pcard__row{display:flex;align-items:center;justify-content:space-between;gap:.8rem;margin-top:.4rem;}
.price{font-weight:600;color:var(--gold-2);white-space:nowrap;}
.price sup{font-size:.6em;color:var(--cream-dim);}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;font-family:var(--body);font-weight:600;font-size:.85rem;letter-spacing:.03em;padding:.75rem 1.2rem;border-radius:2px;border:1px solid transparent;cursor:pointer;transition:transform .25s var(--ease),background-color .3s,color .3s,border-color .3s;}
.btn:hover{transform:translateY(-2px);}
.btn--solid{background:var(--kirsch);color:#fff;}
.btn--solid:hover{background:#c9483a;}
.btn--gold{border-color:var(--gold);color:var(--gold-2);background:linear-gradient(120deg,rgba(200,161,92,.06),rgba(231,206,152,.14),rgba(200,161,92,.06));background-size:200% 100%;}
.btn--gold:hover{background-position:100% 0;border-color:var(--gold-2);}
.btn--ghost{border-color:var(--line);color:var(--cream);}
.btn--ghost:hover{border-color:var(--gold);color:var(--gold-2);}
.btn--full{width:100%;}
.btn--lg{padding:.95rem 1.5rem;font-size:.92rem;}
.btn[disabled]{opacity:.5;cursor:not-allowed;transform:none;}

/* Produktdetail */
.pdetail{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(1.6rem,4vw,3.5rem);align-items:start;padding-block:clamp(1.5rem,3vw,2.5rem) clamp(3rem,6vw,5rem);}
.pdetail__media{border:1px solid var(--line);border-radius:4px;overflow:hidden;aspect-ratio:1/1;background:var(--cocoa-2);}
.pdetail__media img{width:100%;height:100%;object-fit:cover;}
.pdetail__cat{font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);}
.pdetail h1{font-size:clamp(1.9rem,3.5vw,2.8rem);margin:.6rem 0 1rem;}
.pdetail__price{font-size:1.5rem;font-weight:600;color:var(--gold-2);margin-bottom:1.2rem;}
.pdetail__desc{color:var(--cream-dim);margin-bottom:1.6rem;}
.pdetail__opt{margin-bottom:1.4rem;}
.pdetail__opt label{display:block;font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin-bottom:.5rem;}
select,input,textarea{font-family:var(--body);font-size:.95rem;color:var(--cream);background:var(--cocoa-2);border:1px solid var(--line);border-radius:3px;padding:.7rem .85rem;width:100%;}
select:focus,input:focus,textarea:focus{outline:none;border-color:var(--gold);}
.qtyrow{display:flex;align-items:center;gap:1rem;margin-bottom:1.4rem;}
.stepper{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:3px;overflow:hidden;}
.stepper button{width:40px;height:42px;background:var(--cocoa-2);border:0;color:var(--cream);font-size:1.2rem;cursor:pointer;}
.stepper button:hover{color:var(--gold-2);}
.stepper input{width:48px;text-align:center;border:0;border-inline:1px solid var(--line);border-radius:0;padding:.6rem 0;}
.backlink{display:inline-block;margin-top:1.4rem;color:var(--cream-dim);font-size:.85rem;}
.backlink:hover{color:var(--gold-2);}

/* Warenkorb-Drawer */
.cart-backdrop{position:fixed;inset:0;background:rgba(10,6,3,.6);z-index:90;opacity:0;visibility:hidden;transition:opacity .3s;}
.cart-backdrop.open{opacity:1;visibility:visible;}
.cart{position:fixed;top:0;right:0;bottom:0;width:min(420px,92vw);z-index:95;background:var(--cocoa);border-left:1px solid var(--line);display:flex;flex-direction:column;transform:translateX(100%);transition:transform .35s var(--ease);}
.cart.open{transform:none;}
.cart__head{display:flex;align-items:center;justify-content:space-between;padding:1.3rem var(--gutter);border-bottom:1px solid var(--line-2);}
.cart__head h2{font-size:1.3rem;}
.cart__close{background:none;border:0;color:var(--cream-dim);font-size:1.6rem;cursor:pointer;line-height:1;}
.cart__close:hover{color:var(--gold-2);}
.cart__items{flex:1;overflow-y:auto;padding:.5rem var(--gutter);}
.cart__empty{color:var(--cream-dim);text-align:center;padding:3rem 1rem;font-style:italic;}
.citem{display:grid;grid-template-columns:64px 1fr auto;gap:.9rem;align-items:center;padding:1rem 0;border-bottom:1px solid var(--line-2);}
.citem img{width:64px;height:64px;object-fit:cover;border-radius:3px;border:1px solid var(--line-2);}
.citem__name{font-family:var(--display);font-size:1rem;}
.citem__meta{font-size:.78rem;color:var(--cream-dim);margin-top:.15rem;}
.citem__ctrls{display:flex;align-items:center;gap:.7rem;margin-top:.5rem;}
.citem__ctrls .stepper button{width:30px;height:30px;font-size:1rem;}
.citem__ctrls .stepper input{width:34px;padding:.35rem 0;font-size:.85rem;}
.citem__rm{background:none;border:0;color:var(--cream-dim);font-size:.76rem;cursor:pointer;text-decoration:underline;}
.citem__rm:hover{color:var(--kirsch);}
.citem__price{font-weight:600;color:var(--gold-2);white-space:nowrap;}
.cart__foot{border-top:1px solid var(--line);padding:1.2rem var(--gutter) 1.5rem;display:grid;gap:.9rem;}
.cart__sum{display:flex;justify-content:space-between;font-size:1.05rem;}
.cart__sum b{font-family:var(--display);font-size:1.3rem;color:var(--gold-2);}
.cart__note{font-size:.76rem;color:var(--cream-dim);}

/* Kasse */
.checkout{display:grid;grid-template-columns:1.3fr .9fr;gap:clamp(1.6rem,4vw,3rem);align-items:start;padding-block:clamp(1.5rem,3vw,2.5rem) clamp(3rem,6vw,5rem);}
.field{margin-bottom:1rem;}
.field label{display:block;font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;color:var(--gold);margin-bottom:.4rem;}
.field-row{display:grid;grid-template-columns:1fr 2fr;gap:1rem;}
.cardblock{margin-top:1.6rem;padding-top:1.6rem;border-top:1px solid var(--line-2);}
.paybox{border:1px dashed var(--gold);border-radius:4px;background:rgba(200,161,92,.05);padding:1.4rem;color:var(--cream-dim);display:flex;gap:.9rem;align-items:flex-start;font-size:.9rem;}
.paybox svg{flex:none;width:22px;height:22px;stroke:var(--gold-2);fill:none;stroke-width:1.6;margin-top:.1rem;}
.summary{border:1px solid var(--line);border-radius:4px;background:var(--cocoa-2);padding:1.4rem;position:sticky;top:90px;}
.summary h2{font-size:1.3rem;margin-bottom:1rem;}
.sline{display:flex;justify-content:space-between;gap:1rem;padding:.55rem 0;border-bottom:1px solid var(--line-2);font-size:.92rem;}
.sline--total{border-bottom:0;padding-top:1rem;font-size:1.1rem;}
.sline--total b{font-family:var(--display);font-size:1.35rem;color:var(--gold-2);}
.legal{display:grid;gap:.6rem;margin:1.3rem 0;}
.legal label{display:flex;gap:.6rem;align-items:flex-start;font-size:.82rem;color:var(--cream-dim);cursor:pointer;}
.legal input{width:auto;margin-top:.2rem;}
.legal a{color:var(--gold-2);text-decoration:underline;}

/* Footer */
.shopfoot{border-top:1px solid var(--line);padding-block:2.2rem;color:var(--cream-dim);font-size:.82rem;text-align:center;}
.shopfoot a{color:var(--gold-2);}

@media(max-width:820px){.pdetail,.checkout{grid-template-columns:1fr;} .summary{position:static;}}
@media(prefers-reduced-motion:reduce){.foil{animation:none;}.pcard,.btn,.cart{transition:none;}}