/*
Theme Name: Wearhausse
Theme URI: https://wearhausse.co
Author: Wearhausse
Description: Custom storefront theme for Wearhausse — heavyweight graphic tees.
Version: 1.0
Requires at least: 6.0
Requires PHP: 8.0
License: Proprietary
Text Domain: wearhausse
*/


  :root {
    --paper:#F5F0E6; --cream:#EDE5D2; --bone:#E1D6BE; --ink:#121009; --clay:#6E6656; --signal:#D7261E;
    --ease:cubic-bezier(.16,1,.3,1);
  }
  * { margin:0; padding:0; box-sizing:border-box; }
  body { font-family:"Archivo",system-ui,sans-serif; background:var(--paper); color:var(--ink);
         -webkit-font-smoothing:antialiased; overflow-x:hidden; }
  a { color:inherit; text-decoration:none; }
  img { display:block; width:100%; height:100%; object-fit:cover; }

  /* grain */
  #grain { position:fixed; inset:-50%; z-index:80; pointer-events:none; opacity:.09; mix-blend-mode:multiply;
    background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='360' height='360'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' seed='11' stitchTiles='stitch'/><feColorMatrix type='saturate' values='0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
    animation:grain 7s steps(6) infinite; }
  @keyframes grain { 0%{transform:translate(0,0)} 25%{transform:translate(-4%,3%)} 50%{transform:translate(3%,-2%)} 75%{transform:translate(-2%,-4%)} 100%{transform:translate(4%,2%)} }

  /* reveals — progressive: hidden only when JS is confirmed present */
  .js .reveal { opacity:0; transform:translateY(46px); transition:opacity 1s var(--ease), transform 1s var(--ease); }
  .js .reveal.in { opacity:1; transform:none; }
  .js .reveal-clip { clip-path:inset(0 0 100% 0); transition:clip-path 1.1s var(--ease); }
  .js .reveal-clip.in { clip-path:inset(0 0 0% 0); }

  /* marquee */
  .mq-wrap { position:relative; overflow:hidden; }
  .mq { display:flex; white-space:nowrap; font-weight:800; letter-spacing:.02em; text-transform:uppercase; }
  .mq > span { padding:14px 0; }
  .mq-a { background:var(--signal); color:var(--paper); font-size:30px; }
  .mq-b { background:var(--ink); color:var(--paper); font-size:22px; letter-spacing:.14em; }
  .mq-a .t { animation:mq-a 20s linear infinite; display:inline-block; }
  .mq-b .t { animation:mq-b 26s linear infinite; display:inline-block; }
  @keyframes mq-a { from{transform:translateX(0)} to{transform:translateX(-50%)} }
  @keyframes mq-b { from{transform:translateX(-50%)} to{transform:translateX(0)} }
  .mq .o { color:transparent; -webkit-text-stroke:1.5px currentColor; }

  /* header */
  header { position:fixed; top:0; left:0; right:0; z-index:60; background:var(--paper); color:var(--ink);
           border-bottom:1px solid var(--bone);
           display:grid; grid-template-columns:1fr auto 1fr; align-items:center; padding:22px 40px; }
  .wordmark { font-weight:800; font-size:20px; letter-spacing:.28em; }
  nav { display:flex; gap:34px; }
  nav a { font-size:11px; font-weight:600; letter-spacing:.22em; text-transform:uppercase; opacity:.7; }
  nav a:hover { opacity:1; }
  .cart { justify-self:end; font-size:11px; font-weight:600; letter-spacing:.22em; text-transform:uppercase; }
  .cart b { color:var(--signal); }

  /* hero */
  .hero { position:relative; display:grid; grid-template-columns:1.06fr .94fr; min-height:100vh; overflow:hidden; }
  .ghost { position:absolute; top:6%; left:-2%; z-index:0; font-weight:800; font-size:31vw; line-height:1;
           letter-spacing:-.02em; text-transform:uppercase; color:transparent; -webkit-text-stroke:2px var(--bone); opacity:.42; pointer-events:none;
           -webkit-mask-image:linear-gradient(90deg,#000 62%,transparent); mask-image:linear-gradient(90deg,#000 62%,transparent); }
  .hero-copy { position:relative; z-index:2; padding:20vh 4vw 10vh 40px; display:flex; flex-direction:column; justify-content:center; gap:34px; }
  .eyebrow { font-size:12px; font-weight:600; letter-spacing:.3em; text-transform:uppercase; color:var(--clay); }
  .eyebrow i { font-style:normal; color:var(--signal); }
  .hero h1 { font-weight:800; font-size:clamp(54px,8.4vw,132px); line-height:.92; letter-spacing:-.025em; text-transform:uppercase; }
  .hero h1 .ln { display:block; overflow:hidden; }
  .hero h1 .ln > span { display:block; animation:rise .9s var(--ease) both; }
  .hero h1 .ln:nth-child(2) > span { animation-delay:.12s; }
  .hero h1 .ln:nth-child(3) > span { animation-delay:.24s; }
  @keyframes rise { from { transform:translateY(110%); } to { transform:translateY(0); } }
  .hero h1 .sig { color:var(--signal); }
  .hero p { max-width:38ch; font-size:16px; line-height:1.6; color:var(--clay); animation:fadein 1s var(--ease) .5s both; }
  @keyframes fadein { from{opacity:0} to{opacity:1} }
  .cta-row { display:flex; align-items:center; gap:26px; animation:fadein 1s var(--ease) .66s both; }
  .btn { display:inline-block; background:var(--ink); color:var(--paper); font-size:12px; font-weight:700;
         letter-spacing:.24em; text-transform:uppercase; padding:17px 30px; transition:background .15s; }
  .btn:hover { background:var(--signal); }
  .link { font-size:12px; font-weight:600; letter-spacing:.22em; text-transform:uppercase; border-bottom:1px solid var(--ink); padding-bottom:2px; }
  .hero-media { position:relative; display:flex; align-items:center; justify-content:center; background:var(--cream); overflow:hidden; }
  .hero-media .frame { width:min(76%,430px); aspect-ratio:4/5; overflow:hidden; box-shadow:0 40px 80px -30px rgba(18,16,9,.45); }
  .hero-media .frame img { transform:scale(1.12); }
  .hero-media .orb { position:absolute; top:12%; right:14%; width:120px; height:120px; border-radius:50%;
      background:radial-gradient(circle at 32% 30%, #e6543a, var(--signal) 60%, #8f1c10); box-shadow:0 20px 50px -15px rgba(214,38,30,.6); }
  .hero-media .caption { position:absolute; bottom:6%; left:8%; font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--clay); }

  /* shop */
  .shop { padding:110px 40px 80px; }
  .section-head { display:flex; align-items:end; justify-content:space-between; margin-bottom:46px; border-bottom:1px solid var(--bone); padding-bottom:18px; }
  .section-head h2 { font-weight:800; font-size:38px; letter-spacing:-.01em; text-transform:uppercase; }
  .section-head .count { font-size:12px; font-weight:600; letter-spacing:.22em; text-transform:uppercase; color:var(--clay); }
  .grid { display:grid; grid-template-columns:repeat(4,1fr); gap:40px 26px; }
  .card { display:flex; flex-direction:column; gap:12px; }
  .card-media { position:relative; aspect-ratio:4/5; background:var(--cream); overflow:hidden; }
  .card-media img { transition:transform .6s var(--ease); }
  .card:hover .card-media img { transform:scale(1.06); }
  .wash { position:absolute; inset:0; background:var(--signal); mix-blend-mode:multiply; opacity:0; transition:opacity .4s; }
  .card:hover .wash { opacity:.35; }
  .tag { position:absolute; top:12px; left:12px; background:var(--signal); color:var(--paper);
         font-size:10px; font-weight:700; letter-spacing:.18em; padding:5px 9px; }
  .card-row { display:flex; justify-content:space-between; align-items:baseline; }
  .card-name { font-size:13px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; }
  .card-price { font-size:13px; font-weight:500; color:var(--clay); }

  /* editorial split */
  .editorial { position:relative; background:var(--ink); color:var(--paper); overflow:hidden; }
  .editorial .big { position:absolute; top:50%; left:6%; transform:translateY(-50%); z-index:1; font-weight:800;
      font-size:13vw; line-height:.9; letter-spacing:-.02em; text-transform:uppercase; color:transparent;
      -webkit-text-stroke:2px #4a4436; white-space:nowrap; }
  .editorial .frame { position:relative; z-index:2; width:42%; margin-left:54%; padding:110px 0; }
  .editorial .frame img { aspect-ratio:4/5; object-fit:cover; filter:contrast(1.06); }

  /* manifesto */
  .manifesto { padding:130px 40px; background:var(--paper); }
  .manifesto .m-line { font-weight:800; font-size:clamp(40px,7vw,100px); line-height:.98; letter-spacing:-.02em; text-transform:uppercase; }
  .manifesto .m-line .sig { color:var(--signal); }
  .manifesto .m-meta { margin-top:40px; display:flex; gap:44px; font-size:12px; font-weight:600; letter-spacing:.24em; text-transform:uppercase; color:var(--clay); }

  /* CTA full bleed */
  .cta { background:var(--signal); color:var(--paper); padding:120px 40px; text-align:center; }
  .cta .big { font-weight:800; font-size:clamp(40px,7.5vw,104px); line-height:.95; letter-spacing:-.02em; text-transform:uppercase; }
  .cta .sub { margin-top:18px; font-size:13px; font-weight:600; letter-spacing:.3em; text-transform:uppercase; opacity:.85; }
  .cta .btn { margin-top:40px; background:var(--paper); color:var(--ink); }
  .cta .btn:hover { background:var(--ink); color:var(--paper); }

  footer { display:flex; justify-content:space-between; align-items:center; padding:40px; background:var(--paper); border-top:1px solid var(--bone); }
  .f-word { font-weight:800; font-size:15px; letter-spacing:.28em; }
  .f-meta { font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--clay); }

  @media (prefers-reduced-motion: reduce) {
    .mq .t, #grain, .hero h1 .ln > span, .hero p, .cta-row { animation:none !important; }
    .js .reveal, .js .reveal-clip { opacity:1 !important; transform:none !important; clip-path:none !important; transition:none !important; }
  }
  @media (max-width: 900px) {
    header { grid-template-columns:1fr auto; padding:18px 22px; } nav { display:none; }
    .hero { grid-template-columns:1fr; } .hero-copy { padding:16vh 24px 10vw; }
    .hero-media { order:2; min-height:72vh; } .ghost { font-size:48vw; top:8%; }
    .grid { grid-template-columns:repeat(2,1fr); gap:28px 16px; }
    .cta-row { flex-direction:column; align-items:flex-start; gap:18px; }
    .cta-row .btn { width:100%; text-align:center; }
    .editorial .frame { width:74%; margin-left:24%; }
    .section-head h2 { font-size:30px; }
  }


/* ===== Product page ===== */
.product-page{background:var(--paper);color:var(--ink)}
.p-hero{position:relative;padding:130px 6vw 70px;min-height:82vh;display:flex;flex-direction:column;justify-content:center;overflow:hidden}
.p-ghost{position:absolute;top:6vh;left:-1vw;right:0;font-weight:800;font-size:14vw;line-height:.9;text-transform:uppercase;color:transparent;-webkit-text-stroke:1px var(--bone);opacity:.32;white-space:nowrap;pointer-events:none;user-select:none;z-index:0}
.p-grid{position:relative;display:grid;grid-template-columns:1.05fr 1fr;gap:6vw;align-items:center;z-index:2}
.p-media{background:var(--cream);border:1px solid var(--bone);border-radius:6px;overflow:hidden;aspect-ratio:4/5;display:flex;align-items:center;justify-content:center;box-shadow:0 30px 60px -30px rgba(18,16,9,.25)}
.p-media img{width:100%;height:100%;object-fit:cover}
.p-info .eyebrow{font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--clay);margin-bottom:14px}
.p-title{font-weight:800;font-size:clamp(34px,5vw,62px);text-transform:uppercase;line-height:.94;letter-spacing:-.01em;margin:0 0 18px;color:var(--ink)}
.p-price{font-size:30px;font-weight:800;color:var(--signal);margin-bottom:22px}
.p-price .woocommerce-Price-currencySymbol{font-size:.55em;vertical-align:super;margin-right:2px}
.p-desc{color:var(--clay);line-height:1.65;max-width:58ch;margin-bottom:26px}
.p-desc p{margin:0 0 12px}
.p-desc ul{margin:12px 0;padding-left:1.2em;list-style:disc}
.p-desc li{margin:5px 0}
.p-cart{margin-bottom:26px}
.p-cart form.cart{display:flex;flex-direction:column;gap:14px}
.p-cart table.variations{margin:0 0 6px}
.p-cart table.variations td,.p-cart table.variations th{border:none;background:transparent;padding:0 0 12px}
.p-cart table.variations .label{display:block;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--clay);margin-bottom:6px}
.p-cart table.variations select,.p-cart .qty{background:var(--cream);border:1px solid var(--bone);border-radius:4px;padding:12px 14px;font-family:inherit;font-size:15px;color:var(--ink);min-width:160px}
.p-cart .single_add_to_cart_button,.p-cart button[type=submit]{background:var(--signal);color:#fff;border:none;border-radius:4px;padding:16px 36px;font-family:inherit;font-weight:700;font-size:15px;text-transform:uppercase;letter-spacing:.08em;cursor:pointer;transition:background .18s ease}
.p-cart .single_add_to_cart_button:hover,.p-cart button[type=submit]:hover{background:var(--ink)}
.p-cart .woocommerce-variation-price{color:var(--signal);font-weight:700}
.p-meta{display:flex;gap:10px;flex-wrap:wrap;color:var(--clay);font-size:12px;text-transform:uppercase;letter-spacing:.1em;padding-top:6px;border-top:1px solid var(--bone)}
.p-related{padding:50px 6vw 110px}
.p-related .section-head h2{font-size:clamp(28px,4vw,46px);font-weight:800;text-transform:uppercase;color:var(--ink);margin:0}
.p-related .grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:34px}
.p-related .card{text-decoration:none;color:inherit;display:block}
.p-related .card-media{aspect-ratio:4/5;background:var(--cream);border-radius:4px;overflow:hidden;position:relative;margin-bottom:12px}
.p-related .card-media img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
.p-related .card:hover .card-media img{transform:scale(1.05)}
.p-related .card-media .wash{position:absolute;inset:0;background:linear-gradient(180deg,transparent 60%,rgba(18,16,9,.12))}
.p-related .card-row{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.p-related .card-name{font-weight:700;font-size:14px;color:var(--ink)}
.p-related .card-price{font-weight:700;color:var(--signal);white-space:nowrap}
.woocommerce-notices-wrapper{max-width:1400px;margin:0 auto;padding:20px 6vw 0}
@media(max-width:800px){
  .p-grid{grid-template-columns:1fr;gap:34px}
  .p-hero{padding-top:110px}
  .p-ghost{font-size:19vw}
  .p-related .grid{grid-template-columns:repeat(2,1fr)}
}


/* Product page refinements */
.p-hero{padding-top:96px;min-height:auto;padding-bottom:56px}
.p-media{aspect-ratio:1/1;max-height:60vh;margin:0 auto}

.p-grid{display:grid!important;grid-template-columns:1.05fr 1fr!important}
.p-info{min-width:0}

.p-cart .single_add_to_cart_button,.p-cart button.button.alt{background:var(--signal)!important;color:#fff!important;border:none!important;border-radius:4px!important}
.p-cart table.variations select{background:var(--cream)!important;border:1px solid var(--bone)!important;color:var(--ink)!important}

@media(max-width:800px){
  .p-grid{display:grid!important;grid-template-columns:1fr!important;gap:26px!important}
  .p-hero{padding-top:80px!important;padding-bottom:40px!important;min-height:auto!important}
  .p-ghost{font-size:24vw!important;top:4vh!important;line-height:.85!important}
  .p-media{max-height:none!important;width:100%!important;aspect-ratio:1/1!important;margin:0!important}
  .p-title{font-size:clamp(26px,8.5vw,36px)!important;line-height:1.02!important;overflow-wrap:break-word!important;word-break:break-word!important}
  .p-price{font-size:24px!important}
  .p-cart form.cart,.p-cart table.variations{width:100%!important}
  .p-cart table.variations select{width:100%!important;min-width:0!important}
  .p-cart .single_add_to_cart_button,.p-cart button.button.alt{width:100%!important;padding:16px!important;text-align:center!important}
  .p-meta{font-size:11px!important}
  .p-related .grid{grid-template-columns:repeat(2,1fr)!important;gap:14px!important}
}

@media(max-width:800px){
  .p-cart .quantity{width:100%!important;float:none!important;margin:0 0 12px!important}
  .p-cart .quantity .qty{width:100%!important;padding:14px!important;min-width:0!important}
  .p-cart .variations_button{display:flex!important;flex-direction:column!important;gap:10px!important}
}

@media(max-width:800px){
  .p-cart table.variations tr{display:flex!important;flex-direction:column!important;gap:8px!important}
  .p-cart table.variations td{width:100%!important;display:block!important;padding:0!important}
  .p-cart table.variations td.label{padding-bottom:2px!important}
  .p-cart .single_variation_wrap{margin-top:6px!important}
}

/* ===== Product gallery ===== */
.p-media .woocommerce-product-gallery{width:100%!important;float:none!important;margin:0!important}
.p-media .woocommerce-product-gallery__wrapper{margin:0!important}
.p-media .woocommerce-product-gallery__image{margin:0!important}
.p-media .woocommerce-product-gallery__image a{display:block!important}
.p-media .woocommerce-product-gallery__image img{width:100%!important;aspect-ratio:1/1;object-fit:cover;border-radius:10px;display:block}
.p-media ol.flex-control-thumbs{display:flex!important;flex-wrap:wrap;gap:8px;margin:12px 0 0!important;padding:0!important;list-style:none!important}
.p-media ol.flex-control-thumbs li{width:60px!important;height:60px!important;float:none!important;margin:0!important;padding:0!important;border-radius:6px;overflow:hidden;border:1px solid var(--bone);cursor:pointer;opacity:.8;transition:all .15s}
.p-media ol.flex-control-thumbs li:hover{opacity:1}
.p-media ol.flex-control-thumbs li img{width:100%!important;height:100%!important;object-fit:cover;display:block}
.p-media ol.flex-control-thumbs li img.flex-active{opacity:1;box-shadow:0 0 0 2px var(--signal) inset}

.p-media{aspect-ratio:auto!important;max-height:none!important;max-width:540px!important;margin:0 auto!important;width:100%}
@media(max-width:800px){.p-media{max-width:none!important}}

.p-media ol.flex-control-thumbs li.flex-active{opacity:1!important;box-shadow:0 0 0 2px var(--signal)!important}