html,body{margin:0;padding:0;background:#FCFBF8;color:#13233B;font-family:'Manrope',system-ui,sans-serif;-webkit-font-smoothing:antialiased}
*{box-sizing:border-box}
a{color:#1F4E8C;text-decoration:none}
a:hover{color:#13233B;text-decoration:underline}
input,select,textarea,button{font-family:inherit;font-size:15px}
h1,h2,h3{text-wrap:balance}
p{text-wrap:pretty}
img{max-width:100%;display:block}
.serif{font-family:'DM Serif Display',Georgia,serif;font-weight:400}
.mono{font-family:'JetBrains Mono',monospace}

/* photo placeholders that hold real stock photography */
.ph{border-radius:20px;overflow:hidden;position:relative;background:#EEE4D1}
.ph img{width:100%;height:100%;object-fit:cover;display:block}
.ph-cap{position:absolute;left:10px;bottom:10px;background:rgba(19,35,59,.55);color:#F5EFE3;font-size:11px;padding:3px 9px;border-radius:999px;font-family:'JetBrains Mono',monospace}

.hidden{display:none !important}

/* header / nav */
.topbar{background:#13233B;color:#F5EFE3;font-size:13px;text-align:center;padding:9px 16px;letter-spacing:.02em}
.site-header{position:sticky;top:0;z-index:30;background:rgba(252,251,248,.94);backdrop-filter:blur(10px);border-bottom:1px solid #EADFC9}
.site-header .wrap{max-width:1200px;margin:0 auto;padding:14px 24px;display:flex;align-items:center;gap:24px;flex-wrap:wrap}
.logo{display:flex;align-items:center;gap:10px;color:#13233B;text-decoration:none}
.logo-badge{width:34px;height:34px;border-radius:50%;background:#1F4E8C;display:grid;place-items:center;color:#F5EFE3;font-family:'DM Serif Display',Georgia,serif;font-size:18px;flex:none}
.logo-text{display:flex;flex-direction:column;line-height:1.05}
.logo-text .name{font-family:'DM Serif Display',Georgia,serif;font-size:22px}
.logo-text .url{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#5A6880}
.site-nav{display:flex;gap:22px;flex-wrap:wrap;flex:1;justify-content:center;font-size:15px;font-weight:600}
.site-nav a{color:#13233B}
.site-nav a.active{color:#1F4E8C}
.cart-btn{display:flex;align-items:center;gap:10px;background:#1F4E8C;color:#fff;border:0;border-radius:999px;padding:10px 18px;font-weight:700;cursor:pointer;font-size:15px}
.cart-count{background:#EADFC9;color:#13233B;border-radius:999px;min-width:24px;height:24px;display:grid;place-items:center;font-size:13px;padding:0 6px}

/* footer */
.site-footer{background:#13233B;color:#D8DEE8;font-size:14px}
.site-footer .wrap{max-width:1200px;margin:0 auto;padding:64px 24px 32px;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:36px}
.site-footer a{color:#D8DEE8}
.site-footer .col{display:flex;flex-direction:column;gap:10px;line-height:1.6}
.site-footer strong{color:#F5EFE3}
.site-footer .bottom{max-width:1200px;margin:0 auto;padding:20px 24px 32px;border-top:1px solid #2A3B55;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;color:#9AA7BA;font-size:13px}

/* buttons / pills */
.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;font-weight:700;text-decoration:none;cursor:pointer;border:0;padding:15px 26px;font-size:16px}
.btn-primary{background:#1F4E8C;color:#fff}
.btn-secondary{background:#fff;color:#13233B;border:1px solid #D9CBAE}
.btn-dark{background:#13233B;color:#fff;padding:9px 16px;font-weight:700;border-radius:999px;border:0;cursor:pointer}
.pill{padding:9px 16px;border-radius:999px;border:1px solid #1F4E8C;background:#fff;color:#1F4E8C;font-weight:600;cursor:pointer}
.pill-active{background:#1F4E8C;color:#fff}
.opt-btn{display:flex;justify-content:space-between;padding:16px;border-radius:14px;border:2px solid #EADFC9;background:#fff;cursor:pointer;font-weight:600;color:#13233B;width:100%;text-align:left}
.opt-active{border-color:#1F4E8C}
.link-btn{background:none;border:0;color:#5A6880;font-size:13px;cursor:pointer;text-decoration:underline;padding:0}

/* layout helpers */
.wrap-1200{max-width:1200px;margin:0 auto;padding:0 24px}
.wrap-900{max-width:900px;margin:0 auto;padding:0 24px}
.wrap-860{max-width:860px;margin:0 auto;padding:0 24px}
.wrap-760{max-width:760px;margin:0 auto;padding:0 24px}
.grid-auto{display:grid;gap:24px}
.grid-2{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:48px;align-items:center}

/* forms */
.field{display:flex;flex-direction:column;gap:6px;font-weight:600;font-size:14px}
.field input,.field textarea{padding:12px 14px;border-radius:12px;border:1px solid #D9CBAE;font-weight:400}
.checkline{display:flex;gap:10px;font-size:14px;line-height:1.5;color:#3E4C63}
.checkline input{accent-color:#1F4E8C}

/* product/article cards */
.card{display:flex;flex-direction:column;gap:12px}
.card .cat{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:#1F4E8C;font-weight:700}
.card .name{font-weight:700;font-size:17px;color:#13233B}
.card .short{font-size:14px;color:#5A6880;line-height:1.5}
.card .row{display:flex;justify-content:space-between;align-items:center}
.card .price{font-weight:700;font-size:18px}

/* FAQ */
.faq-item{border-bottom:1px solid #EADFC9}
.faq-q{width:100%;text-align:left;background:none;border:0;padding:22px 0;display:flex;justify-content:space-between;gap:16px;font-size:18px;font-weight:700;color:#13233B;cursor:pointer}
.faq-sign{color:#1F4E8C}
.faq-a{margin:0 0 22px;line-height:1.7;color:#3E4C63;display:none}
.faq-item.open .faq-a{display:block}

/* cart drawer */
.cart-overlay{position:fixed;inset:0;background:rgba(19,35,59,.4);z-index:50;display:none}
.cart-drawer{position:fixed;top:0;right:-440px;bottom:0;width:min(420px,100%);background:#FCFBF8;z-index:51;display:flex;flex-direction:column;box-shadow:-20px 0 40px rgba(19,35,59,.15);transition:right .25s ease}
body.cart-open .cart-overlay{display:block}
body.cart-open .cart-drawer{right:0}
.cart-head{padding:22px 24px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #EADFC9}
.cart-close{background:none;border:0;font-size:26px;cursor:pointer;color:#13233B;width:44px;height:44px}
.cart-progress{padding:16px 24px;background:#F5EFE3;display:flex;flex-direction:column;gap:8px;font-size:14px}
.cart-progress-bar{height:6px;border-radius:99px;background:#fff;overflow:hidden}
.cart-progress-bar>span{height:100%;background:#1F4E8C;display:block;width:0%}
.cart-lines{flex:1;overflow:auto;padding:16px 24px;display:flex;flex-direction:column;gap:16px}
.cart-line{display:grid;grid-template-columns:64px 1fr auto;gap:14px;align-items:center}
.cart-line-thumb{width:64px;height:64px;border-radius:12px;background:repeating-linear-gradient(135deg,#E4D7BE 0 6px,#EEE4D1 6px 12px)}
.cart-line-info{display:flex;flex-direction:column;gap:6px}
.cart-line-name{font-weight:700;font-size:15px}
.cart-line-qty{display:flex;align-items:center;gap:8px}
.qty-btn{width:30px;height:30px;border-radius:50%;border:1px solid #D9CBAE;background:#fff;cursor:pointer}
.cart-line-end{display:flex;flex-direction:column;align-items:end;gap:6px}
.cart-foot{padding:20px 24px;border-top:1px solid #EADFC9;display:flex;flex-direction:column;gap:12px}
.cart-empty-msg{color:#5A6880;margin:24px 0}

/* cookie banner */
.cookie-banner{position:fixed;left:16px;right:16px;bottom:16px;z-index:40;max-width:720px;margin:0 auto;background:#fff;border:1px solid #EADFC9;border-radius:20px;padding:20px 22px;box-shadow:0 16px 40px rgba(19,35,59,.18);display:flex;flex-direction:column;gap:14px}

/* toast */
.toast{position:fixed;top:90px;left:50%;transform:translate(-50%,-14px);z-index:60;background:#13233B;color:#fff;padding:12px 20px;border-radius:999px;font-size:14px;font-weight:600;opacity:0;pointer-events:none;transition:opacity .2s, transform .2s}
.toast.show{opacity:1;transform:translate(-50%,0)}

/* progress (packing list) */
.progress-bar{height:10px;border-radius:99px;background:#EADFC9;overflow:hidden}
.progress-bar>span{height:100%;background:#1F4E8C;display:block;transition:width .3s}

@media (max-width: 640px){
  .site-nav{order:3;width:100%;justify-content:flex-start;gap:14px}
}
