/* ============================================================
   MOHIMAN — Heritage editorial design system
   Palette: cream paper · charcoal ink · label blue · caramel
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@500;600;700&family=Fraunces:ital,opsz,wght@0,9..144,400;0,9..144,500;0,9..144,600;1,9..144,400&family=Archivo:wght@400;500;600;700&display=swap');

:root{
  --cream:        #f3ead7;
  --cream-deep:   #ece0c6;
  --paper:        #f8f1e1;
  --ink:          #1d1a16;
  --ink-soft:     #514a3f;
  --ink-faint:    #8a8170;
  --blue:         #1c7fb8;
  --blue-deep:    #155f8a;
  --caramel:      #c5862f;
  --caramel-deep: #a86d1f;
  --line:         #d8cbab;
  --line-strong:  #c2b18b;
  --ok:           #2f7d46;
  --warn:         #b4451f;
  --shadow:       0 22px 60px -28px rgba(29,26,22,.55);
  --radius:       3px;
  --maxw:         1180px;
  font-synthesis: none;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:'Archivo',system-ui,sans-serif;
  color:var(--ink);
  background-color:var(--cream);
  background-image:
    radial-gradient(120% 90% at 50% -10%, rgba(255,250,238,.9), transparent 60%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.045'/%3E%3C/svg%3E");
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  min-height:100vh;
  display:flex;flex-direction:column;
}

a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
button{font-family:inherit;cursor:pointer;border:none;background:none}

.wrap{width:100%;max-width:var(--maxw);margin:0 auto;padding:0 28px}

/* ---------- Type ---------- */
.brand-mark{font-family:'Cinzel',serif;letter-spacing:.14em;font-weight:600}
.eyebrow{
  font-size:.72rem;letter-spacing:.32em;text-transform:uppercase;
  color:var(--caramel-deep);font-weight:600;
}
h1,h2,h3{font-family:'Fraunces',serif;font-weight:500;line-height:1.1;letter-spacing:-.01em}

/* ---------- Top bar ---------- */
.topbar{
  border-bottom:1px solid var(--line);
  background:rgba(248,241,225,.86);
  backdrop-filter:blur(8px);
  position:sticky;top:0;z-index:40;
}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;height:72px}
.logo{font-family:'Cinzel',serif;font-size:1.45rem;font-weight:700;letter-spacing:.22em}
.logo small{display:block;font-family:'Archivo';font-size:.52rem;letter-spacing:.34em;
  text-transform:uppercase;color:var(--ink-faint);font-weight:600;margin-top:2px;letter-spacing:.3em}
.topnav{display:flex;align-items:center;gap:22px}

.region-switch{display:flex;align-items:center;border:1px solid var(--line-strong);border-radius:100px;overflow:hidden}
.region-switch a{
  font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;font-weight:600;
  padding:7px 14px;color:var(--ink-faint);transition:.18s;
}
.region-switch a.active{background:var(--ink);color:var(--paper)}
.region-switch a:not(.active):hover{color:var(--ink)}

.cart-link{display:flex;align-items:center;gap:8px;font-size:.72rem;letter-spacing:.14em;
  text-transform:uppercase;font-weight:600;position:relative}
.cart-link .pill{background:var(--blue);color:#fff;border-radius:100px;min-width:20px;height:20px;
  display:inline-flex;align-items:center;justify-content:center;font-size:.66rem;padding:0 5px}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  font-family:'Archivo';font-weight:600;font-size:.82rem;letter-spacing:.12em;
  text-transform:uppercase;padding:16px 30px;border-radius:var(--radius);
  transition:transform .15s ease, background .2s, color .2s, box-shadow .2s;
  border:1px solid transparent;
}
.btn:active{transform:translateY(1px)}
.btn-primary{background:var(--ink);color:var(--paper)}
.btn-primary:hover{background:var(--blue-deep)}
.btn-blue{background:var(--blue);color:#fff}
.btn-blue:hover{background:var(--blue-deep)}
.btn-outline{background:transparent;border-color:var(--line-strong);color:var(--ink)}
.btn-outline:hover{border-color:var(--ink);background:var(--ink);color:var(--paper)}
.btn-block{width:100%}
.btn:disabled{opacity:.4;cursor:not-allowed}

/* ---------- Product hero ---------- */
.hero{flex:1;padding:70px 0 90px}
.product{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.product-figure{
  position:relative;border-radius:6px;overflow:hidden;background:var(--cream-deep);
  box-shadow:var(--shadow);border:1px solid var(--line);
}
.product-figure::after{content:"";position:absolute;inset:0;
  box-shadow:inset 0 0 90px rgba(29,26,22,.18);pointer-events:none}
.product-figure img{width:100%;height:100%;object-fit:cover}
.ribbon{position:absolute;top:18px;left:18px;background:var(--blue);color:#fff;
  font-size:.62rem;letter-spacing:.22em;text-transform:uppercase;font-weight:600;
  padding:7px 14px;border-radius:2px}

.product-info .origin{display:flex;align-items:center;gap:12px;margin-bottom:18px}
.product-info .origin .rule{height:1px;width:46px;background:var(--caramel)}
.product-name{font-family:'Cinzel',serif;font-size:clamp(2.6rem,6vw,4.2rem);
  font-weight:700;letter-spacing:.08em;line-height:.95;margin-bottom:6px}
.product-sub{font-family:'Fraunces';font-size:1.35rem;color:var(--ink-soft);
  font-style:italic;margin-bottom:26px}

.specs{display:flex;flex-wrap:wrap;gap:0;border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);margin:26px 0}
.spec{flex:1;min-width:120px;padding:16px 18px;border-right:1px solid var(--line)}
.spec:last-child{border-right:none}
.spec .k{font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-faint);font-weight:600}
.spec .v{font-family:'Fraunces';font-size:1.05rem;margin-top:3px}

.price-row{display:flex;align-items:baseline;gap:14px;margin:6px 0 4px}
.price{font-family:'Fraunces';font-size:2.4rem;font-weight:600}
.price .cur{font-size:1rem;color:var(--ink-faint);letter-spacing:.1em;margin-right:2px}
.ship-note{font-size:.8rem;color:var(--ink-soft)}

.desc{color:var(--ink-soft);margin:22px 0 30px;max-width:48ch}

.qty-buy{display:flex;gap:14px;align-items:stretch;flex-wrap:wrap}
.qty{display:flex;align-items:center;border:1px solid var(--line-strong);border-radius:var(--radius)}
.qty button{width:46px;font-size:1.2rem;color:var(--ink-soft)}
.qty button:hover{color:var(--ink)}
.qty input{width:46px;text-align:center;border:none;background:transparent;
  font-family:'Fraunces';font-size:1.1rem;color:var(--ink);-moz-appearance:textfield}
.qty input::-webkit-outer-spin-button,.qty input::-webkit-inner-spin-button{-webkit-appearance:none}

.trust{display:flex;gap:26px;margin-top:34px;flex-wrap:wrap}
.trust .item{display:flex;align-items:center;gap:9px;font-size:.7rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--ink-soft);font-weight:600}
.trust svg{width:20px;height:20px;stroke:var(--caramel);fill:none}

/* ---------- Story band ---------- */
.band{background:var(--ink);color:var(--cream);padding:64px 0;position:relative;overflow:hidden}
.band::before{content:"";position:absolute;inset:0;opacity:.06;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.band .wrap{position:relative}
.band .eyebrow{color:var(--caramel)}
.band h2{font-size:clamp(1.8rem,4vw,2.8rem);max-width:18ch;margin:14px 0 18px;color:var(--paper)}
.band p{max-width:60ch;color:#d9cfba}

/* ---------- Cart / Checkout shells ---------- */
.page{flex:1;padding:56px 0 90px}
.page-head{margin-bottom:38px}
.page-head h1{font-size:clamp(2rem,5vw,3rem)}
.page-head .eyebrow{margin-bottom:10px}

.layout{display:grid;grid-template-columns:1.4fr .9fr;gap:48px;align-items:start}

.card{background:var(--paper);border:1px solid var(--line);border-radius:6px;
  box-shadow:0 10px 30px -22px rgba(29,26,22,.5)}
.card-pad{padding:30px}
.card h3{font-size:1.3rem;margin-bottom:4px}
.card .sub{color:var(--ink-faint);font-size:.85rem;margin-bottom:22px}

.line-item{display:flex;gap:20px;align-items:center;padding:8px 0}
.line-item .thumb{width:92px;height:108px;border-radius:4px;overflow:hidden;
  border:1px solid var(--line);background:var(--cream-deep);flex:none}
.line-item .meta{flex:1}
.line-item .meta .nm{font-family:'Cinzel';font-weight:600;letter-spacing:.1em;font-size:1.05rem}
.line-item .meta .dt{font-size:.8rem;color:var(--ink-soft)}
.line-item .ln-price{font-family:'Fraunces';font-size:1.2rem}

.summary .row{display:flex;justify-content:space-between;padding:11px 0;
  font-size:.92rem;border-bottom:1px dashed var(--line)}
.summary .row.total{border-bottom:none;border-top:2px solid var(--ink);margin-top:6px;padding-top:16px;
  font-family:'Fraunces';font-size:1.5rem}
.summary .row .muted{color:var(--ink-faint)}
.conv-note{font-size:.78rem;color:var(--ink-soft);background:var(--cream-deep);
  border:1px solid var(--line);border-radius:4px;padding:11px 13px;margin-top:14px}

.empty{text-align:center;padding:70px 20px;color:var(--ink-soft)}
.empty h2{font-size:1.8rem;margin-bottom:10px}

/* ---------- Forms ---------- */
.field{margin-bottom:18px}
.field label{display:block;font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;
  font-weight:600;color:var(--ink-soft);margin-bottom:7px}
.field input,.field select,.field textarea{
  width:100%;padding:13px 14px;border:1px solid var(--line-strong);border-radius:var(--radius);
  background:var(--paper);font-family:'Archivo';font-size:.95rem;color:var(--ink);transition:.15s;
}
.field input:focus,.field select:focus,.field textarea:focus{
  outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(28,127,184,.14)}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}

.pay-options{display:grid;gap:14px;margin:6px 0 24px}
.pay-opt{border:1.5px solid var(--line-strong);border-radius:6px;padding:18px;cursor:pointer;
  display:flex;gap:14px;align-items:flex-start;transition:.16s;background:var(--paper)}
.pay-opt:hover{border-color:var(--ink)}
.pay-opt.selected{border-color:var(--blue);background:#faf6ec;box-shadow:0 0 0 3px rgba(28,127,184,.1)}
.pay-opt.disabled{opacity:.5;cursor:not-allowed;pointer-events:none}
.pay-opt input{margin-top:4px;accent-color:var(--blue)}
.pay-opt .t{font-family:'Fraunces';font-size:1.1rem}
.pay-opt .d{font-size:.82rem;color:var(--ink-soft)}

.notice{padding:13px 16px;border-radius:4px;font-size:.85rem;margin-bottom:18px}
.notice.info{background:#eef5fa;border:1px solid #bcd9ec;color:var(--blue-deep)}
.notice.warn{background:#fbf0e8;border:1px solid #e9c6ad;color:var(--warn)}
.notice.ok{background:#eef6ef;border:1px solid #bcd9c2;color:var(--ok)}

#paypal-box{margin-top:8px}
.hidden{display:none!important}

/* ---------- Footer ---------- */
.site-footer{background:var(--ink);color:var(--cream);padding:46px 0;margin-top:auto}
.site-footer .wrap{display:flex;justify-content:space-between;align-items:center;gap:30px;flex-wrap:wrap}
.foot-marks{display:flex;gap:28px;align-items:center;flex-wrap:wrap}
.foot-marks .m{display:flex;align-items:center;gap:9px;font-size:.66rem;letter-spacing:.18em;
  text-transform:uppercase;color:#cdbf9f;font-weight:600}
.foot-marks svg{width:18px;height:18px;stroke:var(--caramel);fill:none}
.foot-brand{font-family:'Cinzel';letter-spacing:.2em;font-weight:600}
.foot-copy{font-size:.72rem;color:#9b9079;letter-spacing:.06em}

/* ---------- Confirmation ---------- */
.confirm{max-width:620px;margin:0 auto;text-align:center}
.confirm .seal{width:74px;height:74px;border-radius:50%;background:var(--blue);margin:0 auto 22px;
  display:flex;align-items:center;justify-content:center}
.confirm .seal svg{width:34px;height:34px;stroke:#fff;fill:none;stroke-width:2.5}
.confirm h1{font-size:2.4rem;margin-bottom:8px}
.confirm .ordno{font-family:'Fraunces';font-size:1.2rem;color:var(--caramel-deep);
  letter-spacing:.08em;margin:14px 0}
.confirm .det{text-align:left;margin:26px auto;max-width:420px}

/* ---------- Responsive ---------- */
@media(max-width:900px){
  .product{grid-template-columns:1fr;gap:38px}
  .layout{grid-template-columns:1fr;gap:32px}
  .product-figure{max-width:440px;margin:0 auto}
}
@media(max-width:560px){
  .wrap{padding:0 18px}
  .topbar .wrap{height:64px}
  .logo{font-size:1.2rem;letter-spacing:.16em}
  .topnav{gap:14px}
  .grid-2{grid-template-columns:1fr}
  .specs{flex-wrap:wrap}
  .spec{min-width:50%;border-bottom:1px solid var(--line)}
}

/* ============================================================
   Reviews
   ============================================================ */
.reviews{background:var(--cream-deep);border-top:1px solid var(--line);padding:64px 0}
.reviews-head{text-align:center;margin-bottom:40px}
.reviews-head .eyebrow{justify-content:center}
.rev-summary{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:14px;flex-wrap:wrap}
.rev-avg{font-family:"Fraunces",Georgia,serif;font-size:2.6rem;line-height:1;color:var(--ink)}
.rev-count{color:var(--ink-soft);font-size:.95rem}
.rev-title{font-family:"Fraunces",Georgia,serif;margin:10px 0 6px}
.rev-empty{color:var(--ink-soft)}

.stars{color:var(--caramel);letter-spacing:2px;font-size:1.05rem;line-height:1}
.stars-lg{font-size:1.5rem}

.reviews-grid{display:grid;grid-template-columns:1fr 380px;gap:40px;align-items:start}

.rev-list{display:flex;flex-direction:column;gap:16px}
.rev-list-empty{padding:20px 0}
.rev-card{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:20px 22px;box-shadow:0 10px 30px -24px rgba(29,26,22,.5)}
.rev-card-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px}
.rev-verified{font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ok);font-weight:700}
.rev-card-title{font-family:"Fraunces",Georgia,serif;font-size:1.1rem;margin:0 0 6px}
.rev-card-body{color:var(--ink-soft);line-height:1.6;margin:0 0 14px}
.rev-card-meta{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:.85rem;color:var(--ink-faint)}
.rev-card-meta strong{color:var(--ink)}

.rev-form-wrap{position:sticky;top:96px}
.rev-form{background:var(--paper);border:1px solid var(--line-strong);border-radius:var(--radius);padding:26px;box-shadow:var(--shadow)}
.rev-form h3{font-family:"Fraunces",Georgia,serif;font-size:1.3rem;margin:0 0 4px}
.rev-form-note{font-size:.85rem;color:var(--ink-soft);margin:0 0 18px}
.rev-form .opt{color:var(--ink-faint);text-transform:none;letter-spacing:0;font-weight:400}

.star-input{display:flex;gap:6px}
.star-btn{background:none;border:none;cursor:pointer;font-size:1.9rem;line-height:1;color:var(--line-strong);padding:0;transition:color .12s,transform .12s}
.star-btn:hover{transform:scale(1.12)}
.star-btn.on{color:var(--caramel)}

.rev-msg{padding:11px 14px;border-radius:var(--radius);font-size:.9rem;margin-bottom:14px}
.rev-msg.ok{background:rgba(47,125,70,.12);color:var(--ok);border:1px solid rgba(47,125,70,.3)}
.rev-msg.err{background:rgba(180,69,31,.1);color:var(--warn);border:1px solid rgba(180,69,31,.3)}

@media (max-width:860px){
  .reviews-grid{grid-template-columns:1fr}
  .rev-form-wrap{position:static;order:-1}
}