/*
Theme Name: Assiduity
Theme URI: https://assiduity.example.com/
Author: Assiduity
Author URI: https://assiduity.example.com/
Description: Assiduity — minimal streetwear theme. Fully compatible with Elementor (incl. Pro Theme Builder), WooCommerce, Contact Form 7, Yoast SEO and other standard WordPress plugins. Includes Full Width and Blank Canvas page templates for drag-and-drop editing.
Version: 1.1.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: assiduity
Tags: e-commerce, fashion, minimal, one-column, two-columns, right-sidebar, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready, block-styles, wide-blocks
*/

/* ---------- Reset / base ---------- */
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:'Inter',ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  background:#fff;color:#111;-webkit-font-smoothing:antialiased;line-height:1.5;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer;border:0;background:none;color:inherit}

:root{
  --bg:#ffffff;
  --fg:#111111;
  --muted:#f5f5f5;
  --muted-fg:#737373;
  --border:#e5e5e5;
  --accent:#d63852;
}

/* ---------- Layout helpers ---------- */
.container{max-width:1400px;margin:0 auto;padding:0 24px}
.uppercase{text-transform:uppercase;letter-spacing:.18em}
.btn{display:inline-block;padding:14px 22px;background:#000;color:#fff;text-transform:uppercase;letter-spacing:.18em;font-size:12px;font-weight:600}
.btn:hover{opacity:.85}

/* ---------- Marquee ---------- */
.marquee{overflow:hidden;border-bottom:1px solid var(--border);padding:10px 0;font-size:11px;letter-spacing:.2em}
.marquee-track{display:inline-flex;white-space:nowrap;animation:marquee 40s linear infinite}
.marquee-track span{margin:0 48px;font-weight:500;text-transform:uppercase}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ---------- Header ---------- */
.site-header{position:absolute;inset:0 0 auto 0;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:24px 32px;color:#fff}
.site-header nav a{font-size:12px;text-transform:uppercase;letter-spacing:.18em;margin-right:32px;font-weight:500}
.site-header nav a:hover{opacity:.7}
.site-brand{font-weight:700;font-size:18px}
.site-brand sup{font-size:8px}
.header-icons{display:flex;gap:20px;align-items:center}
.header-icons button{position:relative}
.cart-count{position:absolute;top:-8px;right:-8px;background:#fff;color:#000;border-radius:999px;font-size:10px;font-weight:700;padding:0 6px}

/* ---------- Hero ---------- */
.hero{position:relative;height:100vh;width:100%;overflow:hidden;color:#fff}
.hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,rgba(0,0,0,.6),transparent 40%,rgba(0,0,0,.7))}
.hero-copy{position:absolute;left:0;right:0;bottom:0;padding:56px 32px;z-index:2}
.hero-copy .eyebrow{font-size:12px;letter-spacing:.3em;text-transform:uppercase;opacity:.8}
.hero-copy h1{font-size:clamp(40px,7vw,96px);line-height:1;margin:12px 0 24px;text-transform:uppercase;font-weight:800;letter-spacing:-.02em}
.hero-copy a{border-bottom:1px solid rgba(255,255,255,.7);padding-bottom:4px;margin-right:24px;font-size:14px}

/* ---------- Categories ---------- */
.categories{padding:80px 32px}
.cat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.cat{position:relative;aspect-ratio:3/4;overflow:hidden;display:block}
.cat img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .7s}
.cat:hover img{transform:scale(1.05)}
.cat::after{content:"";position:absolute;inset:0;background:rgba(0,0,0,.2)}
.cat .label{position:absolute;left:24px;right:24px;bottom:24px;color:#fff;z-index:2}
.cat .label h3{font-size:28px;text-transform:uppercase;font-weight:800;margin:0}

/* ---------- Products ---------- */
.products{padding:0 32px 80px}
.products-head{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:32px}
.products-head h2{font-size:clamp(28px,4vw,48px);text-transform:uppercase;font-weight:800;margin:0}
.product-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px 16px;row-gap:40px}
.product-card{display:block}
.product-media{position:relative;aspect-ratio:3/4;background:var(--muted);overflow:hidden}
.product-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity .5s}
.product-media .img-back{opacity:0}
.product-card:hover .img-back{opacity:1}
.product-card:hover .img-front{opacity:0}
.product-meta{margin-top:12px}
.product-meta h3{font-size:14px;margin:0 0 4px;font-weight:500}
.product-meta .price{font-size:14px;color:var(--muted-fg)}
.product-meta .colors{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted-fg)}
.sold-out{position:absolute;left:12px;top:12px;background:rgba(255,255,255,.9);padding:4px 8px;font-size:10px;font-weight:600;text-transform:uppercase}

/* ---------- Product page ---------- */
.product-page{display:grid;grid-template-columns:1.2fr 1fr;gap:48px;padding:120px 32px 80px;max-width:1400px;margin:0 auto}
.product-gallery img{margin-bottom:8px}
.product-info h1{font-size:32px;text-transform:uppercase;font-weight:700;margin:0 0 12px}
.product-info .price{font-size:20px;margin-bottom:24px}
.size-row{display:flex;gap:8px;margin:16px 0 24px;flex-wrap:wrap}
.size-row button{border:1px solid var(--border);padding:10px 14px;min-width:48px}
.size-row button.active{border-color:#000;background:#000;color:#fff}
.add-to-cart{width:100%;padding:16px;background:#000;color:#fff;text-transform:uppercase;letter-spacing:.2em;font-weight:600}

/* ---------- Checkout ---------- */
.checkout{display:grid;grid-template-columns:1.1fr 1fr;max-width:1100px;margin:0 auto;padding:60px 24px;gap:60px}
.checkout h2{font-size:18px;font-weight:600;margin:0 0 16px}
.field{margin-bottom:14px}
.field input{width:100%;padding:14px;border:1px solid var(--border);font-size:14px;background:#fff}
.summary{background:var(--muted);padding:24px}
.summary-row{display:flex;justify-content:space-between;margin:8px 0;font-size:14px}
.summary-row.total{font-weight:700;font-size:18px;margin-top:16px;padding-top:16px;border-top:1px solid var(--border)}

/* ---------- Thank you ---------- */
.thanks{max-width:720px;margin:0 auto;padding:80px 24px;text-align:left}
.thanks .check{width:56px;height:56px;border-radius:999px;background:#16a34a;color:#fff;display:flex;align-items:center;justify-content:center;font-size:28px;margin-bottom:16px}
.thanks h1{font-size:28px;margin:0 0 8px}

/* ---------- Footer ---------- */
.site-footer{border-top:1px solid var(--border);padding:48px 32px;margin-top:40px}
.footer-inner{display:flex;justify-content:space-between;gap:32px;flex-wrap:wrap}
.footer-inner h4{font-size:12px;text-transform:uppercase;letter-spacing:.18em;margin:0 0 12px}
.footer-inner a{display:block;color:var(--muted-fg);font-size:12px;text-transform:uppercase;letter-spacing:.18em;margin-bottom:6px}
.footer-cols{display:grid;grid-template-columns:repeat(3,minmax(120px,1fr));gap:40px}
.copyright{margin-top:32px;font-size:12px;color:var(--muted-fg)}

/* ---------- Responsive ---------- */
@media (max-width: 900px){
  .cat-grid{grid-template-columns:1fr}
  .product-grid{grid-template-columns:repeat(2,1fr)}
  .product-page,.checkout{grid-template-columns:1fr;padding-top:90px}
  .site-header nav{display:none}
}
