/* Peptide Research Storefront — styles */
:root{
  --psf-accent:#2E7DD1;
  --psf-navy:#0F2A4A;
  --psf-ink:#16233A;
  --psf-muted:#5A6B82;
  --psf-line:#E3EAF2;
  --psf-bg:#F7F9FC;
  --psf-sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  --psf-head:'Poppins','Inter',sans-serif;
}

/* ---------- compliance bars ---------- */
.psf-ruo-bar{
  background:var(--psf-navy); color:#fff; text-align:center; padding:9px 14px;
  font-family:var(--psf-head); font-weight:600; font-size:12px; letter-spacing:.06em; text-transform:uppercase;
}
.psf-ruo-foot{
  background:#0b1c31; color:#9fb1c8; text-align:center; padding:18px 22px;
  font-size:12px; line-height:1.7; font-family:var(--psf-sans);
}

/* ---------- 21+ entry gate ---------- */
body.psf-locked{overflow:hidden !important;height:100vh !important;}
.psf-gate{
  position:fixed; inset:0; z-index:999999; background:rgba(8,20,38,.94);
  display:flex; align-items:center; justify-content:center; padding:20px;
  font-family:var(--psf-sans);
}
.psf-gate.psf-hide{display:none;}
.psf-gate-card{
  background:#fff; border-radius:8px; max-width:620px; width:100%;
  padding:42px 44px; text-align:center; box-shadow:0 30px 80px rgba(8,20,38,.5);
}
@media(max-width:560px){ .psf-gate-card{padding:28px 22px;} }
.psf-gate-brand{font-family:var(--psf-head); font-weight:800; font-size:22px; color:var(--psf-navy); margin-bottom:20px;}
.psf-gate-msg{font-size:18px; line-height:1.6; color:var(--psf-ink); margin:0 0 30px;}
.psf-gate-btns{display:flex; gap:14px; justify-content:center; flex-wrap:wrap;}
.psf-gate-yes{
  background:var(--psf-accent); color:#fff; border:none; border-radius:4px;
  padding:15px 40px; font-family:var(--psf-head); font-weight:700; font-size:16px; cursor:pointer;
}
.psf-gate-yes:hover{filter:brightness(.93);}
.psf-gate-no{
  background:#fff; color:var(--psf-accent); border:1px solid var(--psf-accent); border-radius:4px;
  padding:15px 40px; font-family:var(--psf-head); font-weight:700; font-size:16px; cursor:pointer;
}
.psf-gate-legal{margin-top:22px; font-size:11px; color:var(--psf-muted); line-height:1.6;}

/* ---------- hero ---------- */
.psf-hero{
  position:relative; overflow:hidden; color:#fff;
  background:
    radial-gradient(60% 60% at 78% 38%, rgba(46,125,209,.30), transparent 60%),
    radial-gradient(50% 50% at 12% 20%, rgba(46,125,209,.18), transparent 60%),
    linear-gradient(160deg,#12325A,var(--psf-navy) 60%,#061225);
  margin:0 calc(50% - 50vw); padding:0 0 40px;
}
.psf-hero-in{
  max-width:1320px; margin:0 auto; padding:70px 26px 30px;
  display:grid; grid-template-columns:1.05fr .95fr; gap:34px; align-items:center;
}
@media(max-width:920px){ .psf-hero-in{grid-template-columns:1fr;} }
.psf-eyebrow{font-family:var(--psf-head); letter-spacing:.24em; text-transform:uppercase; color:#79C0FF; font-size:13px; margin-bottom:16px;}
.psf-hero h1{font-family:var(--psf-head); font-weight:900; font-size:clamp(32px,5vw,54px); line-height:1.08; color:#fff; margin:0;}
.psf-hero p{margin-top:20px; max-width:520px; font-size:17px; line-height:1.7; color:#CFE0F2;}
.psf-btn-primary{
  display:inline-block; margin-top:28px; background:var(--psf-accent); color:#fff;
  padding:16px 36px; border-radius:40px; font-family:var(--psf-head); font-weight:700;
  font-size:15px; letter-spacing:.06em; text-transform:uppercase; text-decoration:none;
}
.psf-btn-primary:hover{filter:brightness(.93); color:#fff;}
.psf-hero-vials{display:flex; align-items:flex-end; justify-content:center; gap:0;}
.psf-hero-vials img{width:25%; margin-left:-3%; filter:drop-shadow(0 22px 38px rgba(0,0,0,.5));}
.psf-hero-vials img:first-child{margin-left:0;}
.psf-trust{
  position:relative; max-width:1320px; margin:0 auto; padding:0 26px;
  display:grid; grid-template-columns:repeat(4,1fr); gap:18px;
}
@media(max-width:920px){ .psf-trust{grid-template-columns:1fr 1fr;} }
@media(max-width:560px){ .psf-trust{grid-template-columns:1fr;} }
.psf-tcard{background:#fff; color:var(--psf-navy); border-radius:12px; padding:20px 22px; box-shadow:0 16px 36px rgba(0,0,0,.28);}
.psf-tcard h3{font-family:var(--psf-head); font-weight:800; font-size:16px; margin:0 0 6px;}
.psf-tcard p{color:var(--psf-muted); font-size:14px; line-height:1.5; margin:0;}

/* ---------- shop ---------- */
.psf-shop{font-family:var(--psf-sans); color:var(--psf-ink); padding:26px 0;}
.psf-coa-info{
  display:block; background:#EFF5FC; border:1px solid #D8E6FA; border-radius:12px;
  padding:16px 18px; margin-bottom:22px;
}
.psf-coa-info strong{font-family:var(--psf-head); display:block; margin-bottom:4px;}
.psf-coa-info span{color:var(--psf-muted); font-size:13.5px; line-height:1.55;}

.psf-shop-grid{display:grid; grid-template-columns:270px 1fr; gap:26px;}
@media(max-width:880px){ .psf-shop-grid{grid-template-columns:1fr;} .psf-sidebar{display:none;} }
.psf-panel{background:#fff; border:1px solid var(--psf-line); border-radius:12px; padding:18px; margin-bottom:16px;}
.psf-count{font-family:var(--psf-head); font-weight:700; margin-bottom:14px;}
.psf-count b{color:var(--psf-accent); font-size:20px;}
.psf-lbl{font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--psf-muted); font-weight:700; margin-bottom:10px;}
.psf-panel input[type=search]{width:100%; padding:11px 13px; border:1px solid var(--psf-line); border-radius:8px; font-size:14px;}
.psf-cats label{display:flex; align-items:center; gap:10px; padding:6px 0; font-size:14px; cursor:pointer;}
.psf-cats input{width:17px; height:17px; accent-color:var(--psf-accent);}
.psf-reset{width:100%; border:1px solid var(--psf-line); background:#fff; border-radius:10px; padding:12px; cursor:pointer; color:var(--psf-muted); font-family:var(--psf-head); font-weight:600;}
.psf-reset:hover{border-color:var(--psf-accent); color:var(--psf-accent);}

.psf-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:20px;}
.psf-cols-3 .psf-grid{grid-template-columns:repeat(3,1fr);}
.psf-cols-2 .psf-grid{grid-template-columns:repeat(2,1fr);}
@media(max-width:1100px){ .psf-grid,.psf-cols-3 .psf-grid{grid-template-columns:repeat(2,1fr);} }
@media(max-width:600px){ .psf-grid,.psf-cols-3 .psf-grid,.psf-cols-2 .psf-grid{grid-template-columns:1fr;} }

.psf-card{background:#fff; border:1px solid var(--psf-line); border-radius:12px; overflow:hidden; display:flex; flex-direction:column; transition:.18s;}
.psf-card:hover{box-shadow:0 12px 30px rgba(31,41,55,.10); transform:translateY(-2px);}
.psf-card.psf-hidden{display:none;}
.psf-card-media{display:block; aspect-ratio:1/1; background:#fff; overflow:hidden;}
.psf-card-media img{width:100%; height:100%; object-fit:contain;}
.psf-card-body{padding:16px; display:flex; flex-direction:column; flex:1;}
.psf-cat{font-family:var(--psf-head); font-size:10px; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  color:var(--psf-accent); background:#EFF5FC; align-self:flex-start; padding:5px 10px; border-radius:6px; margin-bottom:10px;}
.psf-card-body h3{font-family:var(--psf-head); font-size:17px; font-weight:700; margin:0 0 8px; line-height:1.3;}
.psf-card-body h3 a{color:var(--psf-ink); text-decoration:none;}
.psf-card-body h3 a:hover{color:var(--psf-accent);}
.psf-price{margin-bottom:12px; font-family:var(--psf-head); font-weight:800; color:var(--psf-accent);}
.psf-price del{color:var(--psf-muted); font-weight:400; margin-right:6px;}
.psf-price ins{text-decoration:none;}
.psf-learn{display:block; text-align:center; border:1.5px solid var(--psf-accent); color:var(--psf-accent);
  border-radius:10px; padding:10px; font-family:var(--psf-head); font-weight:700; font-size:14px; text-decoration:none; margin-bottom:8px;}
.psf-learn:hover{background:#EFF5FC; color:var(--psf-accent);}
.psf-card-body .button, .psf-card-body a.add_to_cart_button{
  display:block !important; width:100%; text-align:center; background:var(--psf-accent) !important; color:#fff !important;
  border:none !important; border-radius:10px !important; padding:12px !important;
  font-family:var(--psf-head) !important; font-weight:700 !important; font-size:14px !important; margin:0 0 8px !important;
}
.psf-card-body .added_to_cart{display:block; text-align:center; font-size:13px; margin-bottom:8px;}
.psf-coa-btn{
  width:100%; background:#fff; color:var(--psf-navy); border:1px solid var(--psf-line);
  border-radius:10px; padding:10px; font-family:var(--psf-head); font-weight:600; font-size:12.5px; cursor:pointer; margin-top:auto;
}
.psf-coa-btn:hover{border-color:var(--psf-accent); color:var(--psf-accent);}
.psf-coa-single{width:auto; padding:12px 24px; margin-top:14px; font-size:14px;}

/* ---------- COA modal ---------- */
.psf-modal{position:fixed; inset:0; background:rgba(15,42,74,.6); display:none; align-items:center; justify-content:center; padding:20px; z-index:999998;}
.psf-modal.psf-open{display:flex;}
.psf-modal-card{background:#fff; border-radius:14px; max-width:460px; width:100%; padding:28px; position:relative; font-family:var(--psf-sans);}
.psf-modal-x{position:absolute; top:12px; right:14px; background:none; border:none; font-size:24px; cursor:pointer; color:var(--psf-muted);}
.psf-modal-eyebrow{color:var(--psf-accent); font-family:var(--psf-head); font-weight:700; font-size:12px; letter-spacing:.1em; text-transform:uppercase; margin-bottom:8px;}
.psf-modal-card h3{font-family:var(--psf-head); font-weight:800; font-size:22px; margin:0 0 10px; color:var(--psf-ink);}
.psf-modal-card p{color:var(--psf-muted); font-size:14px; line-height:1.6; margin:0 0 16px;}
.psf-modal-card input[type=email]{width:100%; padding:13px; border:1px solid var(--psf-line); border-radius:9px; font-size:14px; margin-bottom:12px;}
.psf-modal-submit{width:100%; background:var(--psf-accent); color:#fff; border:none; border-radius:10px; padding:13px; font-family:var(--psf-head); font-weight:800; cursor:pointer;}
.psf-modal-note{color:var(--psf-muted); font-size:12px; margin-top:12px; line-height:1.6;}

/* ---------- checkout acknowledgment ---------- */
.psf-ack{background:#EFF5FC; border:1px solid #D8E6FA; border-radius:10px; padding:14px 16px; margin:14px 0;}
.psf-ack label{font-size:14px; line-height:1.6; color:var(--psf-ink);}
