@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400&family=Jost:wght@300;400;500&display=swap');

:root{
  --cream:#F7F3EC; --card:#FCFAF5; --taupe:#A29588; --taupe-soft:#C9BFB2;
  --line:#E4DCD0; --espresso:#46352E; --espresso-deep:#2E2019;
  --serif:"Cormorant Garamond", Georgia, serif;
  --sans:"Jost", system-ui, -apple-system, "Segoe UI", sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--cream);color:var(--espresso);font-family:var(--sans);font-weight:300;line-height:1.6;-webkit-font-smoothing:antialiased;letter-spacing:.01em}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
input,select,textarea{font-family:inherit;font-size:1rem;color:var(--espresso)}
:focus-visible{outline:2px solid var(--espresso);outline-offset:2px}
.eyebrow{font-size:.68rem;letter-spacing:.34em;text-transform:uppercase;color:var(--taupe);font-weight:400}
.serif{font-family:var(--serif)}

/* Header */
header{position:sticky;top:0;z-index:40;background:rgba(247,243,236,.9);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.bar{max-width:1180px;margin:0 auto;padding:18px 28px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand .name{font-family:var(--serif);font-weight:500;font-size:1.55rem;color:var(--espresso-deep);letter-spacing:.02em}
nav.mainnav{display:flex;gap:30px;font-size:.82rem;letter-spacing:.08em}
nav.mainnav a{position:relative;padding:4px 0}
nav.mainnav a::after{content:"";position:absolute;left:0;bottom:-2px;height:1px;width:0;background:var(--espresso);transition:width .28s}
nav.mainnav a:hover::after{width:100%}
.cartbtn{display:flex;align-items:center;gap:8px;font-size:.82rem;letter-spacing:.08em}
.cartbtn .count{min-width:20px;height:20px;padding:0 5px;border-radius:20px;background:var(--espresso);color:var(--cream);font-size:.66rem;display:inline-flex;align-items:center;justify-content:center}

main{max-width:1180px;margin:0 auto;padding:0 28px 100px}

/* Hero */
.hero{padding:88px 0 64px;border-bottom:1px solid var(--line);display:grid;grid-template-columns:1.15fr .85fr;gap:48px;align-items:end}
.hero h1{font-family:var(--serif);font-weight:400;font-size:clamp(2.8rem,6vw,4.6rem);line-height:1.02;color:var(--espresso-deep)}
.hero h1 em{font-style:italic;color:var(--taupe)}
.hero p{max-width:36ch;margin-top:24px;color:#6a5c52;font-size:1.02rem}
.portrait{position:relative;justify-self:end;width:100%;max-width:440px;aspect-ratio:4/5;overflow:hidden}
.portrait img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center top}
.portrait .fade{position:absolute;left:0;right:0;bottom:0;height:24%;pointer-events:none;background:linear-gradient(to top,var(--cream) 0%,rgba(247,243,236,.7) 36%,rgba(247,243,236,0) 100%)}

/* Catalog */
.catalog-head{padding:46px 0 22px;display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap}
.catalog-head h2{font-family:var(--serif);font-weight:400;font-size:2.1rem;color:var(--espresso-deep)}
.searchwrap{position:relative;min-width:260px;flex:1;max-width:340px}
.searchwrap input{width:100%;padding:11px 14px 11px 38px;background:var(--card);border:1px solid var(--line);border-radius:2px;font-weight:300}
.searchwrap svg{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--taupe)}
.filters{display:flex;gap:26px;flex-wrap:wrap;align-items:center;justify-content:space-between;padding:0 0 26px;border-bottom:1px solid var(--line);margin-bottom:36px}
.chipset{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.chipset .lbl{font-size:.66rem;letter-spacing:.24em;text-transform:uppercase;color:var(--taupe);margin-right:6px}
.chip{font-size:.8rem;letter-spacing:.04em;padding:6px 15px;border-radius:20px;border:1px solid var(--line);color:#6a5c52;transition:.2s}
.chip:hover{border-color:var(--taupe)}
.chip.on{background:var(--espresso);border-color:var(--espresso);color:var(--cream)}
.sortsel select{appearance:none;background:transparent;border:none;border-bottom:1px solid var(--taupe);padding:5px 22px 5px 4px;font-size:.82rem;letter-spacing:.05em;color:var(--espresso);cursor:pointer}

.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px 30px}
.card{background:var(--card);border:1px solid var(--line);border-radius:3px;overflow:hidden;display:flex;flex-direction:column;transition:transform .3s,box-shadow .3s}
.card:hover{transform:translateY(-4px);box-shadow:0 18px 40px -28px rgba(70,53,46,.5)}
.thumb{aspect-ratio:4/3;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;background:radial-gradient(120% 120% at 30% 20%,#FBF8F2 0%,var(--cream) 45%,#EFE8DC 100%);border-bottom:1px solid var(--line)}
.thumb .mono{font-family:var(--serif);font-size:3rem;color:var(--taupe);opacity:.55;font-weight:500}
.thumb-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}
.visual-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;border-radius:3px}
.thumb .type{position:absolute;top:12px;left:12px;font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;background:rgba(247,243,236,.9);border:1px solid var(--line);color:var(--espresso);padding:4px 9px;border-radius:2px}
.card .body{padding:18px 18px 20px;display:flex;flex-direction:column;gap:7px;flex:1}
.card .cat{font-size:.62rem;letter-spacing:.24em;text-transform:uppercase;color:var(--taupe)}
.card .ttl{font-family:var(--serif);font-size:1.32rem;line-height:1.2;color:var(--espresso-deep)}
.card .foot{margin-top:auto;display:flex;align-items:center;justify-content:space-between;padding-top:10px}
.price{font-family:var(--serif);font-size:1.3rem;color:var(--espresso)}
.card .add{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--espresso);border-bottom:1px solid var(--taupe);padding-bottom:2px}
.empty{grid-column:1/-1;text-align:center;padding:70px 0;color:var(--taupe)}
.empty .serif{font-size:1.6rem;color:var(--espresso);display:block;margin-bottom:6px}

/* Product */
.pd{display:grid;grid-template-columns:1fr 1fr;gap:56px;padding:44px 0}
.pd .visual{position:relative;aspect-ratio:1;border:1px solid var(--line);border-radius:3px;overflow:hidden;display:flex;align-items:center;justify-content:center;background:radial-gradient(130% 130% at 30% 20%,#FBF8F2 0%,var(--cream) 45%,#ECE4D6 100%)}
.pd .visual .mono{font-family:var(--serif);font-size:6rem;color:var(--taupe);opacity:.5;font-weight:500}
.pd h1{font-family:var(--serif);font-weight:400;font-size:2.9rem;line-height:1.05;color:var(--espresso-deep)}
.pd .badge{display:inline-flex;align-items:center;gap:7px;margin-top:18px;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--taupe);border:1px solid var(--line);padding:6px 12px;border-radius:2px}
.pd .desc{margin:26px 0;color:#6a5c52;font-size:1.04rem;line-height:1.75}
.pd .pricebig{font-family:var(--serif);font-size:2.4rem;color:var(--espresso);margin:8px 0 26px}
.access-note{margin-top:20px;padding-top:16px;border-top:1px solid var(--line);font-size:.85rem;color:#6a5c52;line-height:1.6}
.product-details{max-width:820px;margin:10px auto 0;padding:34px 0 0;border-top:1px solid var(--line)}
.product-details h2{font-family:var(--serif);font-weight:400;font-size:1.9rem;color:var(--espresso-deep);margin-bottom:16px}
.product-details p{color:#5f524a;font-size:1rem;line-height:1.75;margin:0 0 14px;white-space:normal}
.actions{display:flex;gap:14px;flex-wrap:wrap}
.btn{padding:14px 30px;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;border-radius:2px;transition:.25s;display:inline-block;text-align:center}
.btn-dark{background:var(--espresso);color:var(--cream)}
.btn-dark:hover{background:var(--espresso-deep)}
.btn-ghost{border:1px solid var(--espresso);color:var(--espresso)}
.btn-ghost:hover{background:var(--espresso);color:var(--cream)}
.backlink{display:inline-flex;align-items:center;gap:8px;margin:8px 0;font-size:.76rem;letter-spacing:.1em;color:var(--taupe)}
.backlink:hover{color:var(--espresso)}

/* Panels: cart / checkout / legal */
.panel{max-width:720px;margin:0 auto;padding:50px 0}
.panel h2{font-family:var(--serif);font-weight:400;font-size:2.3rem;color:var(--espresso-deep);margin-bottom:28px}
.cart-item{display:flex;align-items:center;gap:18px;padding:18px 0;border-bottom:1px solid var(--line)}
.cart-item .ci-mono{width:64px;height:64px;flex:none;border:1px solid var(--line);border-radius:3px;overflow:hidden;display:flex;align-items:center;justify-content:center;font-family:var(--serif);color:var(--taupe);font-size:1.5rem;background:var(--cream)}
.cart-item .ci-mono img{width:100%;height:100%;object-fit:cover}
.cart-item .ci-info{flex:1}
.cart-item .ci-info .t{font-family:var(--serif);font-size:1.25rem;color:var(--espresso-deep)}
.cart-item .ci-info .c{font-size:.64rem;letter-spacing:.2em;text-transform:uppercase;color:var(--taupe)}
.cart-item .rem{font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--taupe)}
.cart-item .rem:hover{color:#a3402f}
.summary{margin-top:28px;display:flex;justify-content:space-between;align-items:baseline}
.summary .tot{font-family:var(--serif);font-size:2rem;color:var(--espresso)}
.checkout-foot{margin-top:34px;display:flex;justify-content:flex-end;gap:14px}
.field{margin-bottom:20px}
.field label{display:block;font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:var(--taupe);margin-bottom:8px}
.field input,.field select,.field textarea{width:100%;padding:12px 14px;background:var(--card);border:1px solid var(--line);border-radius:2px;font-weight:300}
.paymethods{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.paymethods label{border:1px solid var(--line);border-radius:3px;padding:16px 12px;text-align:center;font-size:.8rem;letter-spacing:.08em;background:var(--card);cursor:pointer;display:block}
.paymethods input{position:absolute;opacity:0}
.paymethods input:checked+span{color:var(--espresso-deep);font-weight:500}
.note{font-size:.74rem;color:var(--taupe);margin-top:14px;letter-spacing:.03em}
.consent{margin:18px 0 4px;display:flex;gap:12px;align-items:flex-start}
.consent input[type=checkbox]{width:18px;height:18px;min-width:18px;flex:none;margin:3px 0 0;accent-color:var(--espresso);cursor:pointer}
.consent label{margin:0;font-size:.9rem;line-height:1.55;color:var(--espresso);text-transform:none;letter-spacing:0;cursor:pointer}
.consent a{color:var(--espresso);border-bottom:1px solid var(--taupe)}

/* Legal */
.legal{max-width:760px;margin:0 auto;padding:44px 0 20px}
.legal h1{font-family:var(--serif);font-weight:400;font-size:2.5rem;color:var(--espresso-deep);margin:14px 0 6px}
.legal .lead-sub{color:#6a5c52;font-size:.98rem;margin-bottom:6px}
.legal .eff{font-size:.8rem;color:var(--taupe);letter-spacing:.04em;margin-bottom:28px;padding-bottom:18px;border-bottom:1px solid var(--line)}
.legal h2{font-family:var(--serif);font-weight:500;font-size:1.35rem;color:var(--espresso-deep);margin:30px 0 10px}
.legal p{margin:0 0 12px;color:#5f524a;font-size:.96rem;line-height:1.72}
.legal ol,.legal ul{margin:0 0 14px 20px;color:#5f524a;font-size:.96rem;line-height:1.72}
.legal li{margin-bottom:7px}
.legal table{width:100%;border-collapse:collapse;margin:8px 0 18px;font-size:.9rem}
.legal th,.legal td{border:1px solid var(--line);padding:10px 12px;text-align:left;vertical-align:top;color:#5f524a}
.legal th{background:var(--card);font-weight:500;color:var(--espresso-deep)}
.legal a{color:var(--espresso);border-bottom:1px solid var(--taupe)}

/* Success */
.success{max-width:640px;margin:0 auto;padding:60px 0;text-align:center}
.success h2{font-family:var(--serif);font-weight:400;font-size:2.6rem;color:var(--espresso-deep)}
.success .lead{color:#6a5c52;margin:14px 0 34px}
.deliver-card{border:1px solid var(--line);border-radius:3px;background:var(--card);padding:26px;text-align:left;margin-bottom:14px}
.deliver-card .dh{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.deliver-card .dh .t{font-family:var(--serif);font-size:1.3rem;color:var(--espresso-deep)}
.deliver-card .keybox{font-family:var(--serif);letter-spacing:.14em;font-size:1.1rem;color:var(--espresso);background:var(--cream);border:1px dashed var(--taupe);padding:12px 14px;border-radius:2px}

/* Footer */
footer{border-top:1px solid var(--line);background:var(--cream)}
.foot-in{max-width:1180px;margin:0 auto;padding:38px 28px;display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;font-size:.78rem;color:var(--taupe);letter-spacing:.05em}
.foot-in a:hover{color:var(--espresso)}
.foot-links{display:flex;gap:22px;flex-wrap:wrap}
.flash{max-width:1180px;margin:14px auto 0;padding:12px 20px;background:#efeadf;border:1px solid var(--line);border-radius:3px;color:var(--espresso);font-size:.9rem}

@media(max-width:900px){
  .grid{grid-template-columns:repeat(2,1fr)}
  .hero{grid-template-columns:1fr;gap:34px}
  .portrait{justify-self:center;max-width:360px}
  .pd{grid-template-columns:1fr;gap:30px}
  nav.mainnav{display:none}
}
@media(max-width:560px){
  .bar{padding:14px 18px}main{padding:0 18px 90px}
  .grid,.paymethods{grid-template-columns:1fr}
}

/* --- Upsell / cross-sell + popup --- */
.btn-mini{padding:6px 14px;font-size:.72rem;letter-spacing:.08em}
.suggest,.cross{max-width:1200px;margin:44px auto 0;padding-top:30px;border-top:1px solid var(--line)}
.suggest h2{font-family:var(--serif);font-weight:400;font-size:1.7rem;color:var(--espresso-deep);margin-bottom:20px}
.cross h3{font-family:var(--serif);font-weight:400;font-size:1.35rem;color:var(--espresso-deep);margin:0 0 16px}
.suggest-grid,.cross-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.suggest-card,.cross-card{border:1px solid var(--line);border-radius:4px;background:var(--card);padding:14px;display:flex;flex-direction:column;gap:10px}
.suggest-thumb,.cross-thumb{position:relative;display:block;aspect-ratio:4/3;overflow:hidden;border-radius:3px;background:radial-gradient(120% 120% at 30% 20%,#FBF8F2 0%,var(--cream) 45%,#EFE8DC 100%)}
.suggest-thumb img,.cross-thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.suggest-thumb .mono,.cross-thumb span{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-size:2rem;color:var(--taupe);opacity:.5}
.suggest-name,.cross-name{font-family:var(--serif);font-size:1.05rem;color:var(--espresso);text-decoration:none;line-height:1.3}
.suggest-name:hover,.cross-name:hover{color:var(--espresso-deep)}
.suggest-row,.cross-row{display:flex;align-items:center;justify-content:space-between;margin-top:auto}
.suggest-price,.cross-price{font-family:var(--serif);font-size:1.15rem;color:var(--espresso)}
.cross-row form{margin:0}

/* popup */
.modal-overlay{position:fixed;inset:0;background:rgba(46,32,25,.42);display:none;align-items:center;justify-content:center;z-index:120;padding:20px}
.modal-overlay.open{display:flex}
.modal{background:var(--cream);border:1px solid var(--line);border-radius:6px;max-width:460px;width:100%;padding:28px;position:relative;box-shadow:0 24px 60px rgba(46,32,25,.22)}
.modal-x{position:absolute;top:12px;right:16px;background:none;border:none;font-size:1.6rem;line-height:1;color:var(--taupe);cursor:pointer}
.modal-check{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:#3d6b4f}
.modal-name{font-family:var(--serif);font-size:1.5rem;color:var(--espresso-deep);margin:6px 0 18px}
.modal-suggest{border-top:1px solid var(--line);padding-top:16px}
.modal-suggest-h{font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--taupe);margin-bottom:12px}
.msg-item{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.msg-thumb{width:52px;height:52px;flex:none;border:1px solid var(--line);border-radius:3px;overflow:hidden;position:relative;background:var(--cream)}
.msg-thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.msg-thumb span{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:var(--serif);color:var(--taupe)}
.msg-info{flex:1;min-width:0}
.msg-info a{display:block;font-family:var(--serif);font-size:.98rem;color:var(--espresso);text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.msg-info span{font-size:.82rem;color:var(--taupe)}
.modal-actions{display:flex;gap:10px;margin-top:20px}
.modal-actions .btn{flex:1;text-align:center}
@media(max-width:720px){.suggest-grid,.cross-grid{grid-template-columns:1fr}.modal-actions{flex-direction:column}}

/* --- Promocja (przekreślona cena + plakietka) --- */
.price-old{text-decoration:line-through;color:var(--taupe);font-size:.82em;font-weight:400;margin-right:2px;opacity:.85}
.price-now{color:#9a3b2f}
.pd .pricebig .price-now{color:#9a3b2f}
.promo-badge{position:absolute;top:12px;right:12px;background:#9a3b2f;color:#fff;font-family:var(--sans);font-size:.72rem;font-weight:500;letter-spacing:.04em;padding:3px 9px;border-radius:2px;z-index:2}
.pd .pricebig .promo-badge{position:static;display:inline-block;vertical-align:middle;margin-left:8px;font-size:.9rem;padding:4px 12px}