/*
Theme Name: Telos Peptides
Theme URI: https://telospeptides.example
Author: Built for the store owner
Description: Custom dark, neon-lime WooCommerce storefront theme matching the TELOS PEPTIDES design. Mobile-first, classic theme with WooCommerce support (shop, product, cart, checkout, account render inside the branded shell).
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
WC requires at least: 7.0
Text Domain: telos
*/

:root{
  --bg:#080a08;--bg2:#0d100d;--panel:#141714;
  --line:rgba(255,255,255,.09);--line-strong:rgba(255,255,255,.16);
  --white:#fff;--muted:#9aa39a;--muted2:#6a716a;
  --lime:#9be000;--lime-hi:#b6f53a;--maxw:1140px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--white);
  font-family:"Inter",system-ui,sans-serif;font-size:15px;line-height:1.55;letter-spacing:.01em;overflow-x:hidden}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
img{max-width:100%;height:auto}
.wrap{width:100%;max-width:var(--maxw);margin:0 auto;padding:0 20px}
.eyebrow{font-family:"Archivo";font-weight:700;text-transform:uppercase;letter-spacing:.26em;font-size:11px;color:var(--lime)}
h1,h2,h3{font-family:"Archivo";font-weight:800;line-height:1.04;letter-spacing:-.01em;margin:0}
.display{font-size:clamp(40px,11vw,76px);font-weight:900;letter-spacing:-.025em}
.display em{font-style:italic;font-weight:800;color:var(--lime)}
h2.section-title{font-size:clamp(28px,7vw,46px);font-weight:800;letter-spacing:-.02em}
.muted{color:var(--muted)}

/* buttons */
.btn,.button,button.single_add_to_cart_button,#place_order,.wc-block-components-button{
  display:inline-flex;align-items:center;gap:9px;font-family:"Archivo"!important;font-weight:700!important;
  text-transform:uppercase;letter-spacing:.12em;font-size:12px;padding:15px 22px;border-radius:2px;transition:.18s;border:none}
.btn-primary,.button.alt,button.single_add_to_cart_button,#place_order{background:var(--lime)!important;color:#08120a!important}
.btn-primary:hover,.button.alt:hover,button.single_add_to_cart_button:hover,#place_order:hover{background:var(--lime-hi)!important;transform:translateY(-1px)}
.btn-ghost{border:1px solid var(--line-strong);color:#fff}
.btn-ghost:hover{border-color:#fff;background:rgba(255,255,255,.04)}
.button:not(.alt){background:#1a1d1a;color:#fff;border:1px solid var(--line-strong)}
.button:not(.alt):hover{background:var(--lime);color:#08120a;border-color:var(--lime)}
.btn .ar,.link-arrow .ar{transition:transform .18s}
.btn:hover .ar,.link-arrow:hover .ar{transform:translateX(4px)}
.link-arrow{display:inline-flex;align-items:center;gap:7px;font-family:"Archivo";font-weight:700;
  text-transform:uppercase;letter-spacing:.14em;font-size:11px;color:var(--lime)}

/* announcement + header */
.anno{background:var(--lime);color:#08120a;font-family:"Archivo";font-weight:700;text-transform:uppercase;
  letter-spacing:.1em;font-size:10.5px;text-align:center;padding:8px 36px 8px 14px;position:relative}
.anno .x{position:absolute;right:10px;top:50%;transform:translateY(-50%);width:22px;height:22px;display:grid;place-items:center;color:#08120a}
.anno.hide{display:none}
.site-header{position:sticky;top:0;z-index:40;background:rgba(8,10,8,.86);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.hbar{display:flex;align-items:center;justify-content:space-between;height:60px}
.icobtn{width:40px;height:40px;display:grid;place-items:center;color:#fff;border-radius:3px}
.icobtn:hover{background:rgba(255,255,255,.06)}
.hright{display:flex;align-items:center;gap:2px}
.baglink{position:relative}
.bagcount{position:absolute;top:4px;right:2px;min-width:16px;height:16px;padding:0 4px;background:var(--lime);
  color:#08120a;border-radius:9px;font-family:"Archivo";font-weight:800;font-size:10px;display:none;
  align-items:center;justify-content:center;line-height:16px}
.bagcount.on{display:flex}
.logo{display:flex;align-items:center;gap:8px}
.logo svg{width:26px;height:26px;flex:none}
.logo .wm{display:flex;flex-direction:column;line-height:1}
.logo .wm b{font-family:"Archivo";font-style:italic;font-weight:900;font-size:19px;letter-spacing:.02em;color:var(--lime)}
.logo .wm span{font-family:"Archivo";font-weight:700;text-transform:uppercase;letter-spacing:.34em;font-size:8px;color:#cfe9a0;margin-top:2px}

/* drawers */
.scrim{position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:50;opacity:0;pointer-events:none;transition:.25s}
.scrim.on{opacity:1;pointer-events:auto}
.drawer{position:fixed;top:0;bottom:0;left:0;width:min(82vw,340px);background:#0a0c0a;z-index:60;
  transform:translateX(-100%);transition:transform .28s cubic-bezier(.4,0,.2,1);border-right:1px solid var(--line);
  padding:18px 22px;display:flex;flex-direction:column}
.drawer.on{transform:none}
.drawer-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:26px;padding-bottom:16px;border-bottom:1px solid var(--line)}
.drawer-head .t{font-family:"Archivo";font-weight:800;text-transform:uppercase;letter-spacing:.16em;font-size:13px}
.navlist,.navlist ul{list-style:none;margin:0;padding:0}
.navlist a{display:block;font-family:"Archivo";font-weight:800;font-size:24px;letter-spacing:-.01em;padding:13px 0;border-bottom:1px solid var(--line);color:#fff}
.navlist a:hover{color:var(--lime)}

/* vial art */
.shot{position:relative;border-radius:4px;overflow:hidden;
  background:radial-gradient(120% 90% at 50% 0%, #2a2e2a 0%, rgba(22,25,22,0) 55%),linear-gradient(180deg,#202320 0%,#0c0e0c 100%);
  border:1px solid var(--line)}
.shot::after{content:"";position:absolute;inset:0;background:radial-gradient(80% 60% at 50% 120%, rgba(155,224,0,.10), transparent 70%);pointer-events:none}
.vials{position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:center;gap:6px;padding:14% 8% 12%}
.vial{flex:1 1 0;max-width:58px;aspect-ratio:.34;position:relative;align-self:flex-end;filter:drop-shadow(0 10px 14px rgba(0,0,0,.5))}
.vial .cap{height:15%;border-radius:3px 3px 1px 1px;background:linear-gradient(180deg,#e9ede9,#9aa09a 45%,#5d625d);border:.5px solid #6a6f6a}
.vial .glass{height:85%;border-radius:1px 1px 7px 7px;position:relative;
  background:linear-gradient(100deg,rgba(255,255,255,.16),rgba(255,255,255,.03) 30%,rgba(255,255,255,.10) 55%,rgba(255,255,255,.02));
  border:.5px solid rgba(255,255,255,.14);border-top:none;overflow:hidden}
.vial .lab{position:absolute;left:0;right:0;top:30%;bottom:8%;background:linear-gradient(180deg,#0e110e,#070907);
  border-top:1px solid rgba(255,255,255,.08);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}
.vial .lab .bolt{width:9px;height:9px;color:var(--lime)}
.vial .lab .code{font-family:"Archivo";font-weight:800;font-size:7px;letter-spacing:.04em;color:#dfeecb;line-height:1}
.vial .lab .ruo{font-family:"Archivo";font-weight:600;font-size:4.2px;letter-spacing:.06em;color:var(--muted2);text-transform:uppercase}

/* hero */
.hero{position:relative;padding:40px 0 30px;background:radial-gradient(90% 70% at 18% 0%, rgba(155,224,0,.10), transparent 60%)}
@media(min-width:760px){.hero{padding:64px 0 40px}}
.hero .eyebrow{margin-bottom:18px;display:block}
.hero p.sub{color:var(--muted);font-size:16px;max-width:30em;margin:22px 0 26px}
.hero .cta-row{display:flex;flex-wrap:wrap;gap:12px}
.stats{display:flex;gap:26px;margin-top:34px;flex-wrap:wrap}
.stat .n{font-family:"Archivo";font-weight:900;font-size:30px;color:var(--lime);line-height:1}
.stat .l{font-family:"Archivo";font-weight:700;text-transform:uppercase;letter-spacing:.16em;font-size:9.5px;color:var(--muted);margin-top:6px}
.hero-shot{margin-top:36px;aspect-ratio:1.35;width:100%}
.hero-shot .vials{padding:16% 6% 12%}.hero-shot .vial{max-width:64px}

/* features */
.features{padding:34px 0;border-top:1px solid var(--line)}
.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:30px 26px}
.feat .fi{width:26px;height:26px;color:var(--lime);margin-bottom:13px}
.feat h3{font-size:16px;font-weight:800;margin-bottom:7px}
.feat p{color:var(--muted);font-size:13px;margin:0}

/* categories */
.cats{padding:46px 0}
.cats .head{text-align:center;margin-bottom:30px}
.cats .head .eyebrow{margin-bottom:14px;display:inline-block}
.cats .head p{color:var(--muted);max-width:34em;margin:14px auto 0;font-size:15px}
.catgrid{display:grid;gap:16px}
.catcard{position:relative;border-radius:5px;overflow:hidden;min-height:230px;display:flex;align-items:flex-end;border:1px solid var(--line);isolation:isolate}
.catcard .shot{position:absolute;inset:0;border:none;border-radius:0;z-index:-1}
.catcard .shade{position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(8,10,8,.1) 30%,rgba(8,10,8,.92))}
.catcard .ct{padding:22px}
.catcard h3{font-size:26px;font-weight:800;margin-bottom:7px}
.catcard p{color:#cdd3cd;font-size:13.5px;margin:0 0 14px;max-width:24em}
.catcard:hover{border-color:var(--line-strong)}

/* standard + dispatch */
.standard{padding:48px 0;border-top:1px solid var(--line);background:var(--bg2)}
.standard .eyebrow{margin-bottom:16px;display:block}
.standard h2{margin-bottom:18px}
.standard p{color:var(--muted);font-size:15.5px;max-width:40em;margin:0 0 22px}
.standard .std-shot{margin-top:30px;aspect-ratio:1.5;width:100%}
.dispatch{padding:54px 0;text-align:center;background:radial-gradient(80% 100% at 50% 0%, rgba(155,224,0,.07), transparent 65%)}
.dispatch .eyebrow{display:inline-block;margin-bottom:16px}
.dispatch h2{margin-bottom:14px}
.dispatch p{color:var(--muted);max-width:32em;margin:0 auto 26px;font-size:15px}
.sub-form{display:flex;gap:8px;max-width:430px;margin:0 auto;width:100%}
.sub-form input{flex:1;min-width:0;background:#0d0f0d;border:1px solid var(--line-strong);color:#fff;padding:14px 16px;border-radius:2px;font-family:"Inter";font-size:14px}
.sub-form input:focus{outline:none;border-color:var(--lime)}

/* footer */
.site-footer{border-top:1px solid var(--line);padding:44px 0 30px;background:#060806}
.foot-top{display:grid;gap:34px;margin-bottom:34px}
.foot-brand p{color:var(--muted);font-size:13.5px;max-width:30em;margin:16px 0 0}
.foot-cols{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.fcol h4{font-family:"Archivo";font-weight:800;text-transform:uppercase;letter-spacing:.16em;font-size:10.5px;color:var(--muted2);margin:0 0 14px}
.fcol ul{list-style:none;margin:0;padding:0}
.fcol a{display:block;color:var(--muted);font-size:14px;padding:6px 0}
.fcol a:hover{color:#fff}
.foot-bottom{border-top:1px solid var(--line);padding-top:20px;display:flex;flex-wrap:wrap;gap:8px;justify-content:space-between;color:var(--muted2);font-size:11.5px}

/* ---------- WooCommerce ---------- */
.woo-wrap{padding:30px 20px 60px}
.woocommerce-products-header__title,.woocommerce .page-title,h1.entry-title{font-family:"Archivo";font-weight:900;font-size:clamp(34px,9vw,56px);letter-spacing:-.02em;margin:14px 0 4px}
.woocommerce-breadcrumb{color:var(--muted2);font-size:12px;margin-bottom:18px}
.woocommerce-breadcrumb a:hover{color:#fff}
.woocommerce-result-count{color:var(--muted2);font-family:"Archivo";text-transform:uppercase;letter-spacing:.12em;font-size:10px}
.woocommerce-ordering select{background:#0d0f0d;border:1px solid var(--line-strong);color:#fff;padding:9px 12px;border-radius:2px;font-family:"Archivo";font-weight:600;font-size:12px}
ul.products{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:14px 12px;margin:24px 0 0;padding:0}
ul.products li.product{margin:0;text-align:left}
ul.products li.product a img{border-radius:4px;border:1px solid var(--line);background:#10130f}
ul.products li.product .woocommerce-loop-product__title{font-family:"Archivo";font-weight:700;font-size:14px;color:#fff;padding:12px 0 3px}
ul.products li.product:hover .woocommerce-loop-product__title{color:var(--lime)}
ul.products li.product .price{color:var(--muted);font-size:13.5px;font-weight:500}
ul.products li.product .price del{opacity:.5;margin-right:6px}
ul.products li.product .button{margin-top:10px;font-size:11px;padding:11px 16px}
.onsale{background:var(--lime);color:#08120a;font-family:"Archivo";font-weight:800;text-transform:uppercase;
  letter-spacing:.08em;font-size:10px;padding:4px 10px;border-radius:2px;position:absolute;top:8px;left:8px}

/* single product */
.single-product div.product{display:grid;gap:28px}
.single-product div.product .woocommerce-product-gallery{border:1px solid var(--line);border-radius:5px;overflow:hidden;background:#10130f}
.single-product div.product .product_title{font-family:"Archivo";font-weight:900;font-size:clamp(30px,8vw,44px);letter-spacing:-.02em}
.single-product div.product p.price,.single-product div.product span.price{font-family:"Archivo";font-weight:700;font-size:22px;color:#fff!important;margin:10px 0 20px}
.single-product .quantity input.qty{background:#0d0f0d;border:1px solid var(--line-strong);color:#fff;height:48px;width:64px;text-align:center;font-family:"Archivo";font-weight:700;border-radius:2px}
.single-product form.cart{display:flex;gap:10px;align-items:center;margin-bottom:22px}
.single-product button.single_add_to_cart_button{flex:1;justify-content:center}
.woocommerce-product-details__short-description{color:var(--muted);font-size:14.5px}

/* product tabs -> accordion look */
.woocommerce-tabs ul.tabs{list-style:none;margin:0;padding:0;border:none}
.woocommerce-tabs ul.tabs li{border:none;background:none;margin:0;border-top:1px solid var(--line);display:block}
.woocommerce-tabs ul.tabs li a{font-family:"Archivo";font-weight:700;font-size:14.5px;color:#fff;padding:17px 2px;display:block}
.woocommerce-tabs ul.tabs li a:hover{color:var(--lime)}
.woocommerce-tabs .panel{color:var(--muted);font-size:14px;padding:0 2px 18px}
.woocommerce-tabs .panel h2{display:none}

/* notices */
.woocommerce-message,.woocommerce-info,.woocommerce-error{background:var(--panel);border-top:3px solid var(--lime);color:#fff;border-radius:3px;padding:14px 16px;list-style:none}
.woocommerce-message .button{margin-left:10px}

/* cart / checkout tables */
.woocommerce table.shop_table{border:1px solid var(--line);border-radius:4px;background:var(--bg2)}
.woocommerce table.shop_table th{font-family:"Archivo";text-transform:uppercase;letter-spacing:.1em;font-size:11px;color:var(--muted)}
.woocommerce table.shop_table td{border-top:1px solid var(--line)}
.cart_totals h2,#order_review_heading{font-family:"Archivo";font-weight:800}
#payment{background:var(--bg2);border:1px solid var(--line);border-radius:4px}
.woocommerce form .form-row input.input-text,.woocommerce form .form-row textarea,.select2-container .select2-selection{
  background:#0d0f0d;border:1px solid var(--line-strong);color:#fff;border-radius:2px}

/* pagination */
.woocommerce-pagination ul{border:none;display:flex;gap:6px;justify-content:center}
.woocommerce-pagination ul li{border:none}
.woocommerce-pagination ul li a,.woocommerce-pagination ul li span{border:1px solid var(--line-strong);border-radius:2px;color:#fff;padding:8px 14px}
.woocommerce-pagination ul li span.current{background:var(--lime);color:#08120a;border-color:var(--lime)}

@media(min-width:760px){
  .hbar{height:68px}
  .fgrid{grid-template-columns:repeat(4,1fr)}
  .catgrid{grid-template-columns:repeat(3,1fr)}
  ul.products{grid-template-columns:repeat(4,1fr);gap:22px 18px}
  .foot-top{grid-template-columns:1.4fr 2fr}
  .foot-cols{grid-template-columns:repeat(3,1fr)}
  .hero-shot,.std-shot{max-width:720px}
  .single-product div.product{grid-template-columns:1fr 1fr;gap:40px;align-items:start}
  .single-product div.product .woocommerce-product-gallery{position:sticky;top:90px}
}

/* header: mark only on mobile */

/* tablet+: swap to full lockup */
@media(min-width:760px){
}

/* footer: full lockup, always */

.site-header{overflow:hidden}
.hbar{overflow:hidden;align-items:center}

.icobtn{width:44px;height:44px}            /* comfortable 44px tap targets */
a,button{-webkit-tap-highlight-color:transparent}
html{scroll-behavior:smooth}
.pcard,ul.products li.product a{ -webkit-tap-highlight-color:transparent }

/* ---------- header mark (mobile-optimized) ---------- */
