:root{
  --navy:#0E2B33;
  --teal:#1C4B4E;
  --teal-light:#2A6266;
  --orange:#E4622C;
  /* Same hue as --orange but darkened for use as text on light (paper)
     backgrounds — --orange only reaches ~2.9:1 there, failing WCAG AA;
     this reaches ~4.9:1. */
  --orange-on-paper:#B03E14;
  --brass:#D9A441;
  --paper:#F2E9D6;
  --ink:#15211F;
  --line: rgba(242,233,214,0.16);
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--navy);
  color:var(--paper);
  font-family:'Libre Franklin', sans-serif;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
@media (prefers-reduced-motion: reduce){
  *{animation:none !important; transition:none !important;}
}
a{color:inherit; text-decoration:none;}
h1,h2,h3{font-family:'Anton', sans-serif; font-weight:400; letter-spacing:0.5px; text-transform:uppercase;}
.mono{font-family:'IBM Plex Mono', monospace;}
.wrap{max-width:1120px; margin:0 auto; padding:0 28px;}

/* ---------- water texture backdrop ---------- */
.ripple-bg{
  position:fixed; inset:0; z-index:-1;
  background:
    radial-gradient(ellipse 900px 500px at 15% -5%, rgba(217,164,65,0.10), transparent 60%),
    radial-gradient(ellipse 700px 500px at 100% 10%, rgba(228,98,44,0.08), transparent 55%),
    repeating-linear-gradient(115deg, rgba(242,233,214,0.025) 0px, rgba(242,233,214,0.025) 1px, transparent 1px, transparent 42px),
    linear-gradient(180deg, #0E2B33 0%, #123840 40%, #0E2B33 100%);
}

/* ---------- header ---------- */
header{
  position:sticky; top:0; z-index:50;
  background:rgba(14,43,51,0.92);
  backdrop-filter:blur(6px);
  border-bottom:1px solid var(--line);
}
.nav{display:flex; align-items:center; justify-content:space-between; gap:24px; padding:18px 28px;}
.brand{display:flex; flex-direction:column; line-height:0.95; flex-shrink:0;}
.brand .amp{color:var(--orange);}
.brand-name{font-family:'Anton'; font-size:22px; letter-spacing:0.5px; white-space:nowrap;}
.brand-sub{font-family:'IBM Plex Mono'; font-size:10px; letter-spacing:3px; color:var(--brass); margin-top:6px; white-space:nowrap;}
nav ul{list-style:none; display:flex; gap:20px; flex-wrap:nowrap;}
nav a{font-family:'IBM Plex Mono'; font-size:12px; letter-spacing:1.5px; text-transform:uppercase; color:var(--paper); opacity:0.8; transition:opacity .2s, color .2s; white-space:nowrap;}
nav a:hover, nav a:focus-visible{opacity:1; color:var(--brass); outline:none;}
.nav-cta{
  font-family:'IBM Plex Mono'; font-size:12px; letter-spacing:1px; text-transform:uppercase;
  background:var(--orange); color:var(--navy); padding:9px 16px; font-weight:600;
  border:1px solid var(--orange);
}
.nav-cta:hover, .nav-cta:focus-visible{background:transparent; color:var(--orange); outline:none;}
.nav-actions{display:flex; align-items:center; gap:12px; flex-shrink:0;}

/* ---------- mobile nav toggle ---------- */
.nav-toggle{
  display:none; align-items:center; justify-content:center;
  width:44px; height:44px; padding:0; flex-shrink:0;
  background:transparent; border:1px solid rgba(242,233,214,0.35); cursor:pointer;
}
.nav-toggle:hover, .nav-toggle:focus-visible{border-color:var(--brass); outline:none;}
.nav-toggle-icon, .nav-toggle-icon::before, .nav-toggle-icon::after{
  display:block; width:18px; height:2px; background:var(--paper); transition:transform .2s ease, opacity .2s ease, background .2s ease;
}
.nav-toggle-icon{position:relative;}
.nav-toggle-icon::before, .nav-toggle-icon::after{content:""; position:absolute; left:0;}
.nav-toggle-icon::before{top:-6px;}
.nav-toggle-icon::after{top:6px;}
.nav-toggle:hover .nav-toggle-icon, .nav-toggle:hover .nav-toggle-icon::before, .nav-toggle:hover .nav-toggle-icon::after,
.nav-toggle:focus-visible .nav-toggle-icon, .nav-toggle:focus-visible .nav-toggle-icon::before, .nav-toggle:focus-visible .nav-toggle-icon::after{
  background:var(--brass);
}
header.nav-open .nav-toggle-icon{background:transparent;}
header.nav-open .nav-toggle-icon::before{transform:translateY(6px) rotate(45deg);}
header.nav-open .nav-toggle-icon::after{transform:translateY(-6px) rotate(-45deg);}

@media (max-width:980px){
  .nav-toggle{display:inline-flex;}
  .nav{flex-wrap:wrap;}
  nav{order:3; flex-basis:100%; width:100%; max-height:0; overflow:hidden; transition:max-height .3s ease;}
  header.nav-open nav{max-height:480px;}
  nav ul{display:flex; flex-direction:column; gap:0; padding:8px 0 4px;}
  nav ul li{border-top:1px solid var(--line);}
  nav a{display:block; padding:14px 4px; font-size:13px;}
}
@media (max-width:480px){
  .nav{padding:14px 16px; gap:8px; flex-wrap:wrap;}
  .brand-name{font-size:17px;}
  .brand-sub{font-size:9px; letter-spacing:2px;}
  .nav-actions{gap:8px; width:100%; justify-content:flex-end;}
  .cart-btn{padding:8px 10px; font-size:11px;}
  .nav-cta{padding:8px 10px; font-size:11px;}
}

/* ---------- hero ---------- */
.hero{padding:96px 0 60px; position:relative; overflow:hidden;}
.hero-photo{
  position:absolute; inset:0; z-index:-1;
  background-image:
    linear-gradient(180deg, rgba(14,43,51,0.88) 0%, rgba(14,43,51,0.65) 45%, rgba(14,43,51,0.97) 100%),
    url('https://images.unsplash.com/photo-1541742425281-c1d3fc8aff96?fm=jpg&q=70&w=1600&auto=format&fit=crop');
  background-size:cover; background-position:center 65%;
}
.eyebrow{
  display:inline-block; font-family:'IBM Plex Mono'; font-size:12px; letter-spacing:3px;
  color:var(--brass); border:1px solid rgba(217,164,65,0.4); padding:6px 12px; margin-bottom:26px;
}
.hero h1{
  font-size:clamp(42px, 8vw, 92px); line-height:0.94; max-width:900px;
}
.hero h1 .line2{color:var(--orange);}
.hero-sub{
  max-width:520px; margin-top:26px; font-size:17px; line-height:1.6; color:rgba(242,233,214,0.82);
}
.hero-actions{display:flex; gap:16px; margin-top:38px; flex-wrap:wrap;}
.btn{
  font-family:'IBM Plex Mono'; font-size:13px; letter-spacing:1px; text-transform:uppercase;
  padding:14px 24px; font-weight:600; display:inline-block; transition:transform .15s ease, background .15s ease, color .15s ease;
}
.btn-primary{background:var(--orange); color:var(--navy); border:1px solid var(--orange);}
.btn-primary:hover, .btn-primary:focus-visible{transform:translateY(-2px); outline:none;}
.btn-ghost{border:1px solid rgba(242,233,214,0.35); color:var(--paper);}
.btn-ghost:hover, .btn-ghost:focus-visible{border-color:var(--brass); color:var(--brass); outline:none;}

/* ---------- signature: the tackle tag ---------- */
.tag-wrap{display:flex; justify-content:center; margin:74px 0 20px;}
.tackle-tag{
  position:relative;
  background:var(--paper); color:var(--ink);
  width:min(380px, 92vw);
  padding:34px 34px 30px 54px;
  transform:rotate(-1.4deg);
  box-shadow:0 22px 40px rgba(0,0,0,0.35);
  align-self:flex-start;
}
.tackle-tag::before{
  content:"";
  position:absolute; left:20px; top:50%; transform:translateY(-50%);
  width:16px; height:16px; border-radius:50%;
  background:var(--navy);
  box-shadow: 0 0 0 3px var(--paper), inset 0 0 0 2px rgba(14,43,51,0.4);
}
.tackle-tag::after{
  content:"";
  position:absolute; left:-46px; top:50%; width:50px; height:2px;
  background:repeating-linear-gradient(90deg, var(--brass) 0 6px, transparent 6px 10px);
  transform:translateY(-50%) rotate(8deg);
}
.tag-row{display:flex; justify-content:space-between; align-items:flex-start; gap:20px; flex-wrap:wrap;}
.tag-label{font-family:'IBM Plex Mono'; font-size:11px; letter-spacing:2px; color:var(--teal); text-transform:uppercase; margin-bottom:6px;}
.tag-value{font-family:'Anton'; font-size:20px; line-height:1.25;}
.tag-value.small{font-family:'Libre Franklin'; font-weight:600; font-size:15px; text-transform:none;}
.tag-divider{border-top:1.5px dashed rgba(21,33,31,0.25); margin:20px 0;}

/* ---------- section shell ---------- */
section{padding:70px 0;}
.section-head{margin-bottom:44px; max-width:600px;}
.section-head .tag-label{color:var(--brass);}
/* 4vw plateaus at its 42px cap by ~1050px and its 28px floor by ~700px,
   so it looked frozen across most normal desktop window widths. This
   keeps the same 28px/42px endpoints but scales continuously from
   ~357px to ~1357px instead. */
.section-head h2{font-size:clamp(28px, 1.4vw + 23px, 42px); margin-top:8px;}
.section-head p{margin-top:14px; color:rgba(242,233,214,0.75); font-size:16px; line-height:1.6;}

/* ---------- stock grid ---------- */
.stock-grid{display:grid; grid-template-columns:repeat(4, 1fr); gap:1px; background:var(--line); border:1px solid var(--line);}
.stock-card{background:var(--navy); padding:30px 24px; min-height:190px; display:flex; flex-direction:column; justify-content:space-between;}
.stock-num{font-family:'IBM Plex Mono'; font-size:11px; color:var(--orange); letter-spacing:1px;}
.stock-card h3{font-size:19px; margin:18px 0 8px;}
.stock-card p{font-size:14px; color:rgba(242,233,214,0.68); line-height:1.5;}
@media (max-width:900px){ .stock-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:560px){ .stock-grid{grid-template-columns:1fr;} }

/* ---------- photo strip ---------- */
.photo-strip{display:grid; grid-template-columns:repeat(3, 1fr); gap:1px; background:var(--line); border-bottom:1px solid var(--line);}
.photo-item{position:relative; aspect-ratio:4/5; overflow:hidden; background:var(--navy);}
.photo-item img{width:100%; height:100%; object-fit:cover; display:block; filter:saturate(0.92) contrast(1.03);}
.photo-item .cap{
  position:absolute; left:0; right:0; bottom:0; padding:16px 18px;
  background:linear-gradient(180deg, transparent, rgba(14,43,51,0.92) 75%);
  font-family:'IBM Plex Mono'; font-size:11px; letter-spacing:1.5px; text-transform:uppercase; color:var(--brass);
}
@media (max-width:760px){ .photo-strip{grid-template-columns:1fr;} .photo-item{aspect-ratio:16/10;} }

/* ---------- waters section ---------- */
.waters{background:var(--teal); border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.waters .wrap{display:grid; grid-template-columns:1.1fr 0.9fr; gap:60px; align-items:center;}
.waters h2{font-size:clamp(26px,4vw,38px);}
.waters p{margin-top:16px; font-size:16px; line-height:1.7; color:rgba(242,233,214,0.85); max-width:480px;}
.waters-list{display:flex; flex-direction:column; gap:0;}
.waters-list .item{padding:18px 0; border-bottom:1px solid rgba(242,233,214,0.15); display:flex; justify-content:space-between; gap:14px;}
.waters-list .item:first-child{border-top:1px solid rgba(242,233,214,0.15);}
.waters-list .name{font-weight:700; font-size:15px;}
.waters-list .dist{font-family:'IBM Plex Mono'; font-size:12px; color:var(--brass);}
@media (max-width:800px){ .waters .wrap{grid-template-columns:1fr;} }

/* ---------- contact / footer ---------- */
.contact{text-align:center;}
.contact h2{font-size:clamp(30px,5vw,50px); max-width:700px; margin:0 auto;}
.contact-details{
  margin-top:40px; display:flex; justify-content:center; gap:60px; flex-wrap:wrap;
}
.contact-item .tag-label{color:var(--brass);}
.contact-item .val{font-family:'Libre Franklin'; font-weight:700; font-size:17px; margin-top:6px;}

/* ---------- contact form ---------- */
.contact-form{max-width:560px; margin:48px auto 0; text-align:left;}
.form-row{margin-bottom:18px;}
.form-row label{display:block; font-family:'IBM Plex Mono'; font-size:11px; letter-spacing:1.5px; text-transform:uppercase; color:var(--brass); margin-bottom:8px;}
.form-row input, .form-row textarea{
  width:100%; background:rgba(242,233,214,0.06); border:1px solid rgba(242,233,214,0.25); color:var(--paper);
  padding:12px 14px; font-family:'Libre Franklin', sans-serif; font-size:15px;
}
.form-row input:focus, .form-row textarea:focus{outline:none; border-color:var(--brass);}
.form-row textarea{resize:vertical; min-height:120px;}
.form-honeypot{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden;}
.form-msg{padding:14px 16px; margin-bottom:24px; font-size:14px; line-height:1.6; text-align:left;}
.form-msg.success{background:rgba(42,98,102,0.2); border:1px solid rgba(42,98,102,0.5); color:#9fd4c9;}
.form-msg.error{background:rgba(228,98,44,0.12); border:1px solid rgba(228,98,44,0.4); color:var(--orange);}

/* ---------- hours table ---------- */
.hours-table{width:100%; border-collapse:collapse; text-align:left;}
.hours-table tr{border-bottom:1px solid rgba(21,33,31,0.14);}
.hours-table tr:last-child{border-bottom:none;}
.hours-table td{padding:9px 0; font-size:14px;}
.hours-table td.day{font-family:'IBM Plex Mono'; letter-spacing:0.5px; color:var(--teal);}
.hours-table td.time{text-align:right; font-weight:600;}
.hours-table tr.today td{color:var(--orange-on-paper); font-weight:800;}
.hours-table tr.today td.day::before{content:"\25B8  ";}
.open-pill{
  display:inline-flex; align-items:center; gap:7px;
  font-family:'IBM Plex Mono'; font-size:11px; letter-spacing:1.5px; text-transform:uppercase;
  padding:6px 12px; border:1px solid rgba(228,98,44,0.4);
}
.open-pill .dot{width:8px; height:8px; border-radius:50%; background:var(--orange);}
.open-pill.closed .dot{background:#8a8a8a;}
.open-pill.closed{border-color:rgba(242,233,214,0.25); color:rgba(242,233,214,0.6);}
.hours-card{
  background:var(--paper); color:var(--ink);
  padding:26px 30px; width:min(340px, 90vw);
  box-shadow:0 18px 34px rgba(0,0,0,0.3);
}
.hours-card-head{display:flex; justify-content:space-between; align-items:center; margin-bottom:14px;}
.hours-card-head .tag-label{margin-bottom:0;}

footer{border-top:1px solid var(--line); padding:56px 0 28px; }
footer .mono{font-size:12px; color:rgba(242,233,214,0.55); letter-spacing:0.5px;}
.footer-grid{display:grid; grid-template-columns:1fr 1fr 0.8fr; gap:48px;}
@media (max-width:900px){ .footer-grid{grid-template-columns:1fr; gap:36px;} }
.footer-col h3{font-family:'IBM Plex Mono'; font-size:12px; letter-spacing:2px; color:var(--brass); text-transform:uppercase; margin-bottom:16px;}
.footer-addr{font-size:15px; line-height:1.7; color:rgba(242,233,214,0.85);}
.footer-addr a{text-decoration:underline; text-decoration-color:rgba(242,233,214,0.3); text-underline-offset:3px;}
.footer-addr a:hover, .footer-addr a:focus-visible{color:var(--brass); outline:none;}
.footer-hours{list-style:none; margin-top:14px; font-size:14px;}
.footer-hours li{display:flex; justify-content:space-between; gap:14px; padding:5px 0; color:rgba(242,233,214,0.75);}
.footer-hours li.early{color:var(--brass); font-weight:700;}
.footer-hours .d{font-family:'IBM Plex Mono'; letter-spacing:0.5px;}
.footer-map{width:100%; aspect-ratio:4/3; border:1px solid var(--line); filter:grayscale(0.3) invert(0.92) contrast(0.88);}
.footer-social{display:flex; gap:14px; margin-top:4px;}
.footer-social a{
  width:38px; height:38px; display:flex; align-items:center; justify-content:center;
  border:1px solid rgba(242,233,214,0.3); font-family:'IBM Plex Mono'; font-size:11px; letter-spacing:0.5px;
  transition:border-color .2s, color .2s;
}
.footer-social a:hover, .footer-social a:focus-visible{border-color:var(--brass); color:var(--brass); outline:none;}
.footer-bottom{
  margin-top:44px; padding-top:24px; border-top:1px solid var(--line);
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:14px;
}

/* ---------- feature badges ---------- */
.badges-row{background:var(--teal); border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.badges-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line);}
.badge-item{background:var(--teal); padding:26px 20px; text-align:center; display:flex; flex-direction:column; align-items:center; gap:10px;}
.badge-item .ico{font-size:26px;}
.badge-item .txt{font-family:'IBM Plex Mono'; font-size:12px; letter-spacing:0.5px; line-height:1.4; color:var(--paper);}
@media (max-width:760px){ .badges-grid{grid-template-columns:1fr 1fr;} }

/* ---------- bait status tracker ---------- */
.bait-updated{font-family:'IBM Plex Mono'; font-size:12px; color:var(--brass); letter-spacing:0.5px; margin-top:-24px; margin-bottom:32px;}
.bait-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); border:1px solid var(--line);}
@media (max-width:900px){ .bait-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:560px){ .bait-grid{grid-template-columns:1fr;} }
.bait-card{background:var(--navy); padding:22px 22px 24px; display:flex; flex-direction:column; gap:10px;}
.bait-card .cat{font-family:'IBM Plex Mono'; font-size:10px; letter-spacing:1.5px; text-transform:uppercase; color:rgba(242,233,214,0.5);}
.bait-card h4{font-family:'Anton'; font-size:17px; font-weight:400; text-transform:uppercase;}
.bait-card .bnote{font-size:13px; color:rgba(242,233,214,0.62); line-height:1.5;}
.status-pill{
  align-self:flex-start; display:inline-flex; align-items:center; gap:6px;
  font-family:'IBM Plex Mono'; font-size:10px; letter-spacing:1px; text-transform:uppercase;
  padding:5px 10px; border:1px solid transparent;
}
.status-pill .dot{width:7px; height:7px; border-radius:50%;}
.status-pill.in-stock{border-color:rgba(42,98,102,0.7); background:rgba(42,98,102,0.35); color:#9fd4c9;}
.status-pill.in-stock .dot{background:#5fbf9e;}
.status-pill.limited{border-color:rgba(217,164,65,0.5); background:rgba(217,164,65,0.14); color:var(--brass);}
.status-pill.limited .dot{background:var(--brass);}
.status-pill.out{border-color:rgba(242,233,214,0.2); background:rgba(242,233,214,0.05); color:rgba(242,233,214,0.62);}
.status-pill.out .dot{background:rgba(242,233,214,0.55);}

/* ---------- services / convenience ---------- */
.services-grid{display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line); border:1px solid var(--line);}
@media (max-width:800px){ .services-grid{grid-template-columns:1fr;} }
.service-card{background:var(--navy); padding:40px 36px;}
.service-card .ico{font-size:32px; margin-bottom:18px; display:block;}
.service-card h3{font-size:22px; margin-bottom:12px;}
.service-card p{color:rgba(242,233,214,0.75); font-size:15px; line-height:1.65; max-width:420px;}
.service-card ul{margin-top:16px; padding-left:0; list-style:none; display:flex; flex-direction:column; gap:8px;}
.service-card li{font-family:'IBM Plex Mono'; font-size:12px; letter-spacing:0.5px; color:var(--brass);}
.service-card li::before{content:"\2022  ";}

/* ---------- featured products & cart ---------- */
.products-head{display:flex; justify-content:space-between; align-items:flex-end; gap:20px; flex-wrap:wrap; margin-bottom:32px;}
.products-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:22px;}
@media (max-width:900px){ .products-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:560px){ .products-grid{grid-template-columns:1fr;} }
.product-card{background:rgba(242,233,214,0.03); border:1px solid var(--line); display:flex; flex-direction:column;}
.product-img{
  aspect-ratio:1/1;
  background:
    repeating-linear-gradient(135deg, rgba(217,164,65,0.10) 0px, rgba(217,164,65,0.10) 10px, transparent 10px, transparent 20px),
    linear-gradient(160deg, var(--teal) 0%, var(--navy) 100%);
  display:flex; align-items:center; justify-content:center;
  font-family:'IBM Plex Mono'; font-size:11px; letter-spacing:1px; text-transform:uppercase; color:rgba(242,233,214,0.35);
  text-align:center; padding:16px;
  overflow:hidden;
}
.product-img img{width:100%; height:100%; object-fit:cover; display:block; filter:saturate(0.92) contrast(1.03);}
.product-body{padding:18px 20px 20px; display:flex; flex-direction:column; gap:10px; flex:1;}
.product-cat{font-family:'IBM Plex Mono'; font-size:10px; letter-spacing:1.5px; text-transform:uppercase; color:var(--brass);}
.product-body h4{font-size:16px; line-height:1.3;}
.product-blurb{font-size:13px; color:rgba(242,233,214,0.6); line-height:1.5; flex:1;}
.product-foot{display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:6px;}
.product-price{font-family:'IBM Plex Mono'; font-size:15px; font-weight:600; color:var(--paper);}
.add-cart-btn{
  font-family:'IBM Plex Mono'; font-size:11px; letter-spacing:0.5px; text-transform:uppercase;
  background:transparent; color:var(--orange); border:1px solid var(--orange); padding:9px 14px; cursor:pointer;
  transition:background .15s ease, color .15s ease;
}
.add-cart-btn:hover, .add-cart-btn:focus-visible{background:var(--orange); color:var(--navy); outline:none;}
.add-cart-btn.added{background:var(--orange); color:var(--navy);}

/* cart button (header) */
.cart-btn{
  position:relative; display:inline-flex; align-items:center; gap:8px;
  font-family:'IBM Plex Mono'; font-size:12px; letter-spacing:1px; text-transform:uppercase;
  background:transparent; color:var(--paper); border:1px solid rgba(242,233,214,0.35); padding:9px 14px; cursor:pointer;
}
.cart-btn:hover, .cart-btn:focus-visible{border-color:var(--brass); color:var(--brass); outline:none;}
.cart-count{
  display:inline-flex; align-items:center; justify-content:center; min-width:18px; height:18px; padding:0 4px;
  background:var(--orange); color:var(--navy); border-radius:50%; font-size:10px; font-weight:700;
}

/* cart drawer */
.cart-overlay{
  position:fixed; inset:0; background:rgba(14,43,51,0.6); z-index:90;
  opacity:0; pointer-events:none; transition:opacity .2s ease;
}
.cart-overlay.open{opacity:1; pointer-events:auto;}
.cart-drawer{
  position:fixed; top:0; right:0; bottom:0; width:min(400px, 92vw); z-index:91;
  background:var(--paper); color:var(--ink);
  box-shadow:-18px 0 40px rgba(0,0,0,0.4);
  transform:translateX(100%); transition:transform .25s ease;
  display:flex; flex-direction:column;
}
.cart-drawer.open{transform:translateX(0);}
.cart-head{display:flex; justify-content:space-between; align-items:center; padding:22px 24px; border-bottom:1px solid rgba(21,33,31,0.14);}
.cart-head h3{font-size:18px;}
.cart-close{background:none; border:none; font-size:22px; line-height:1; cursor:pointer; color:var(--ink);}
.cart-items{flex:1; overflow-y:auto; padding:10px 24px;}
.cart-empty{padding:40px 0; text-align:center; color:rgba(21,33,31,0.55); font-size:14px;}
.cart-item{display:flex; gap:14px; padding:16px 0; border-bottom:1px solid rgba(21,33,31,0.1);}
.cart-item-img{
  width:52px; height:52px; flex-shrink:0; background:var(--teal);
  display:flex; align-items:center; justify-content:center; font-family:'IBM Plex Mono'; font-size:9px; color:rgba(242,233,214,0.5); text-align:center;
}
.cart-item-info{flex:1; min-width:0;}
.cart-item-info h5{font-family:'Libre Franklin'; font-weight:700; font-size:14px;}
.cart-item-price{font-family:'IBM Plex Mono'; font-size:12px; color:var(--teal); margin-top:2px;}
.cart-qty{display:flex; align-items:center; gap:8px; margin-top:8px;}
.qty-btn{
  width:22px; height:22px; border:1px solid rgba(21,33,31,0.25); background:none; cursor:pointer;
  font-family:'IBM Plex Mono'; font-size:13px; line-height:1; color:var(--ink);
}
.qty-btn:hover, .qty-btn:focus-visible{border-color:var(--orange); color:var(--orange); outline:none;}
.cart-item-remove{font-family:'IBM Plex Mono'; font-size:11px; color:rgba(21,33,31,0.45); text-decoration:underline; cursor:pointer; background:none; border:none; margin-left:auto;}
.cart-item-remove:hover{color:var(--orange);}
.cart-item-total{font-family:'IBM Plex Mono'; font-size:13px; font-weight:700; align-self:flex-start; white-space:nowrap;}
.cart-foot{padding:20px 24px 26px; border-top:1px solid rgba(21,33,31,0.14);}
.cart-subtotal{display:flex; justify-content:space-between; font-family:'IBM Plex Mono'; font-size:15px; font-weight:700; margin-bottom:16px;}
.cart-checkout-btn{
  width:100%; text-align:center; background:var(--orange); color:var(--navy); border:1px solid var(--orange);
  font-family:'IBM Plex Mono'; font-size:13px; letter-spacing:1px; text-transform:uppercase; font-weight:600;
  padding:14px; cursor:pointer;
}
.cart-checkout-btn:hover, .cart-checkout-btn:focus-visible{background:transparent; color:var(--orange); outline:none;}
.cart-checkout-msg{
  margin-top:14px; padding:14px 16px; background:rgba(28,75,78,0.08); border:1px solid rgba(28,75,78,0.25);
  font-size:13px; line-height:1.6; color:var(--teal); display:none;
}
.cart-checkout-msg.show{display:block;}