/*
Theme Name: AeroShade
Description: Minimal editorial storefront for aeroglasses.co — matches the Whop storefront design language. WooCommerce-aware.
Version: 1.0.0
*/

:root {
  --ink: #111111;
  --paper: #ffffff;
  --line: #e5e5e5;
  --soft: #6b6b6b;
  --gap: 1.25rem;
  --maxw: 1200px;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
  color: var(--ink);
  background: var(--paper);
  -webkit-font-smoothing: antialiased;
  letter-spacing: 0.01em;
}

a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }

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

/* ---------- header ---------- */
.site-header { border-bottom: 1px solid var(--ink); }
.topbar {
  display: grid; grid-template-columns: 1fr auto 1fr; align-items: center;
  padding: 14px 24px; font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase;
}
.topbar .left { justify-self: start; }
.topbar .right { justify-self: end; }
.topbar a:hover { text-decoration: underline; }

.masthead { text-align: center; padding: 28px 0 22px; border-top: 1px solid var(--line); }
.masthead .wordmark {
  font-family: 'Snell Roundhand', 'Brush Script MT', cursive;
  font-size: 64px; line-height: 1; letter-spacing: 0; text-transform: none;
}
.masthead .wordmark img { max-height: 90px; width: auto; margin: 0 auto; }

.main-nav { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.main-nav ul {
  display: flex; justify-content: center; gap: 42px;
  list-style: none; margin: 0; padding: 14px 0;
}
.main-nav a {
  font-size: 11.5px; letter-spacing: 0.24em; text-transform: uppercase; font-weight: 500;
}
.main-nav a:hover { opacity: 0.6; }

/* ---------- hero ---------- */
.hero { text-align: center; padding: 72px 24px 64px; }
.hero h1 {
  font-size: clamp(34px, 5.4vw, 64px); font-weight: 400; letter-spacing: -0.015em;
  margin: 0 0 18px; line-height: 1.06;
}
.hero p { color: var(--soft); font-size: 17px; margin: 0 auto 28px; max-width: 560px; line-height: 1.55; }
.btn {
  display: inline-block; background: var(--ink); color: var(--paper);
  padding: 15px 42px; font-size: 12px; letter-spacing: 0.24em; text-transform: uppercase;
  border: 1px solid var(--ink); transition: all .18s ease;
}
.btn:hover { background: var(--paper); color: var(--ink); }
.btn.ghost { background: transparent; color: var(--ink); }
.btn.ghost:hover { background: var(--ink); color: var(--paper); }

.marquee {
  border-top: 1px solid var(--line); border-bottom: 1px solid var(--line);
  padding: 12px 0; font-size: 11px; letter-spacing: 0.3em; text-transform: uppercase;
  color: var(--soft); text-align: center; overflow: hidden;
}
.marquee span { display: inline-block; animation: slide 22s linear infinite; }
@keyframes slide { from { transform: translateX(60%); } to { transform: translateX(-60%); } }

/* ---------- product grid ---------- */
.products { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 28px; }
@media (max-width: 980px) { .products { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .products { grid-template-columns: 1fr; } }

.products li { position: relative; }
.products li a { display: block; }
.products .product-image { background: #f6f6f4; overflow: hidden; }
.products .product-image img { width: 100%; height: auto; transition: transform .5s ease; }
.products li:hover .product-image img { transform: scale(1.045); }

.products h2.woocommerce-loop-product__title,
.products .woocommerce-loop-product__title {
  font-size: 13px; letter-spacing: 0.16em; text-transform: uppercase; font-weight: 500;
  margin: 14px 0 6px; text-align: center;
}
.products .price { text-align: center; font-size: 13.5px; color: var(--soft); letter-spacing: 0.06em; }
.products .price del { opacity: .45; margin-right: 6px; }
.products .price ins { text-decoration: none; color: var(--ink); }
.products .button {
  display: block; text-align: center; margin: 12px auto 0; width: fit-content;
  border: 1px solid var(--ink); background: transparent; color: var(--ink);
  font-size: 10.5px; letter-spacing: 0.22em; text-transform: uppercase; padding: 10px 22px;
  transition: all .18s ease; border-radius: 0;
}
.products .button:hover { background: var(--ink); color: var(--paper); }
.products .onsale {
  position: absolute; top: 12px; left: 12px; background: var(--ink); color: var(--paper);
  font-size: 10px; letter-spacing: 0.18em; padding: 6px 10px; text-transform: uppercase; margin: 0;
}

/* ---------- sections ---------- */
.section { padding: 72px 24px; }
.section-head { text-align: center; margin-bottom: 36px; }
.section-head h2 { font-size: 13px; letter-spacing: 0.3em; text-transform: uppercase; font-weight: 500; margin: 0 0 10px; }
.section-head p { color: var(--soft); font-size: 15px; margin: 0; }

.rule-label { display: flex; align-items: center; gap: 18px; margin: 60px 0; padding: 0 24px; }
.rule-label::before, .rule-label::after { content: ''; height: 1px; background: var(--line); flex: 1; }
.rule-label span { font-size: 11px; letter-spacing: 0.3em; text-transform: uppercase; color: var(--soft); }

/* ---------- single product ---------- */
.single-product .product { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; padding: 56px 24px; max-width: var(--maxw); margin: 0 auto; }
@media (max-width: 860px) { .single-product .product { grid-template-columns: 1fr; } }
.single-product .product > .woocommerce-tabs, .single-product .product > .related { grid-column: 1 / -1; }
.single-product .summary h1.product_title {
  font-size: 26px; font-weight: 400; letter-spacing: 0.02em; margin: 0 0 12px;
}
.single-product .summary .price { font-size: 18px; letter-spacing: 0.04em; }
.single-product .summary .price del { opacity: .4; }
.single-product .summary .price ins { text-decoration: none; }
.single-product div.product form.cart { margin: 26px 0; display: flex; flex-wrap: wrap; gap: 14px; align-items: stretch; }
.single-product div.product form.cart .variations { width: 100%; border: 0; }
.single-product div.product form.cart .variations td { padding: 6px 0; }
.single-product div.product form.cart .variations select,
.single-product div.product form.cart input.qty {
  border: 1px solid var(--ink); border-radius: 0; padding: 12px 14px; font-size: 13px;
  letter-spacing: 0.08em; background: #fff; appearance: none; min-width: 130px;
}
.single-product div.product form.cart .button {
  background: var(--ink); color: var(--paper); border: 1px solid var(--ink); border-radius: 0;
  padding: 15px 40px; font-size: 11.5px; letter-spacing: 0.24em; text-transform: uppercase;
}
.single-product div.product form.cart .button:hover { background: var(--paper); color: var(--ink); }
.single-product div.product form.cart .single_variation_wrap .woocommerce-variation-price { font-size: 17px; margin: 14px 0; }
.single-product .woocommerce-product-gallery img { width: 100%; }
.single-product .product_meta { display: none; }
.single-product .woocommerce-tabs ul.tabs { list-style: none; display: flex; gap: 26px; padding: 0; border-bottom: 1px solid var(--line); margin: 0 0 22px; }
.single-product .woocommerce-tabs ul.tabs li { font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; padding: 12px 0; }
.single-product .woocommerce-tabs ul.tabs li.active { border-bottom: 1px solid var(--ink); }
.single-product .woocommerce-tabs ul.tabs li a { color: inherit; }

/* ---------- cart / checkout ---------- */
.woocommerce-cart-form, .checkout.woocommerce-checkout, .woocommerce-order-received { max-width: 860px; margin: 0 auto; padding: 48px 24px; }
.woocommerce table.shop_table { border: 1px solid var(--line); border-radius: 0; border-collapse: collapse; width: 100%; }
.woocommerce table.shop_table th { font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; border-bottom: 1px solid var(--line); padding: 14px 12px; }
.woocommerce table.shop_table td { padding: 14px 12px; border-bottom: 1px solid var(--line); }
.woocommerce a.remove { color: var(--soft) !important; }
.wc-proceed-to-checkout .checkout-button, .woocommerce button.button, .woocommerce a.button,
.woocommerce input.button, #place_order {
  background: var(--ink) !important; color: var(--paper) !important; border-radius: 0 !important;
  font-size: 11.5px !important; letter-spacing: 0.24em; text-transform: uppercase; padding: 16px 36px !important;
  border: 1px solid var(--ink);
}
.wc-proceed-to-checkout .checkout-button:hover, .woocommerce button.button:hover, #place_order:hover { background: var(--paper) !important; color: var(--ink) !important; }
.woocommerce form .form-row input.input-text, .woocommerce form .form-row textarea, .woocommerce form .form-row select,
.woocommerce-checkout .select2-container .select2-selection--single .select2-selection__rendered {
  border: 1px solid var(--line) !important; border-radius: 0 !important; padding: 13px 14px !important; font-size: 14px;
}
.woocommerce-checkout .select2-container--default .select2-selection--single { border: 1px solid var(--line) !important; border-radius: 0 !important; height: 46px; }
#payment ul.payment_methods { list-style: none; padding: 0; border-bottom: 1px solid var(--line); }
#payment ul.payment_methods li { padding: 16px 0; border-bottom: 1px solid var(--line); font-size: 14px; }
#payment ul.payment_methods li label { font-weight: 500; }
.woocommerce-info, .woocommerce-error, .woocommerce-message { border-top: 1px solid var(--ink); border-radius: 0; background: #f8f8f6; font-size: 14px; }

/* ---------- page / posts ---------- */
.page-content, .entry-content { max-width: 720px; margin: 0 auto; padding: 56px 24px; font-size: 16px; line-height: 1.7; }
.page-content h1, .entry-content h1, .page-title { font-size: 30px; font-weight: 400; text-align: center; margin: 0 0 28px; letter-spacing: 0.02em; }
.page-content h2, .entry-content h2 { font-size: 13px; letter-spacing: 0.28em; text-transform: uppercase; margin: 40px 0 14px; }
.page-content table, .entry-content table { width: 100%; border-collapse: collapse; font-size: 14px; }
.page-content th, .entry-content th { border-bottom: 1px solid var(--ink); padding: 10px; text-align: left; font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; }
.page-content td, .entry-content td { border-bottom: 1px solid var(--line); padding: 12px 10px; }
.page-content ul, .entry-content ul { line-height: 1.9; }

/* ---------- footer ---------- */
.site-footer { border-top: 1px solid var(--ink); margin-top: 48px; }
.footer-top { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; padding: 48px 24px; max-width: var(--maxw); margin: 0 auto; }
@media (max-width: 820px) { .footer-top { grid-template-columns: repeat(2, 1fr); } }
.footer-top h3 { font-size: 11px; letter-spacing: 0.26em; text-transform: uppercase; margin: 0 0 14px; }
.footer-top ul { list-style: none; margin: 0; padding: 0; }
.footer-top li { margin-bottom: 9px; font-size: 13.5px; color: var(--soft); }
.footer-top li a:hover { color: var(--ink); text-decoration: underline; }
.footer-bottom { border-top: 1px solid var(--line); padding: 18px 24px; text-align: center; font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--soft); }

/* misc cleanup */
.screen-reader-text, .woocommerce-result-count { font-size: 12px; color: var(--soft); }
.woocommerce-ordering select { border: 1px solid var(--line); border-radius: 0; padding: 9px 12px; font-size: 12px; }
.woocommerce-breadcrumb { display: none; }
.woocommerce-pagination { text-align: center; padding: 30px 0; }
.woocommerce-pagination ul { list-style: none; display: inline-flex; gap: 14px; padding: 0; font-size: 12px; letter-spacing: 0.1em; }
.stock.in-stock { color: #1a7f37; font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase; }
.wc-block-components-product-title, .wc-block-grid__product-title { letter-spacing: 0.14em; text-transform: uppercase; font-size: 13px !important; }