/* Threadz public site. Layout: full-width bands, content held in a centered .inner column. */
:root{
  --ink:#141a2b; --paper:#fbfaf7; --navy:#17234a; --gold:#c89b2c; --gold-soft:#f3e7c6; --line:#e3e1da; --muted:#5d6273; --card:#ffffff; --bad:#b4372f;
  --display:"Archivo","Arial Narrow",system-ui,sans-serif; --body:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0}
body{background:var(--paper);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.6}
img{max-width:100%}
[hidden]{display:none!important}
a{color:var(--navy)}
h1,h2,h3{font-family:var(--display);line-height:1.1;text-wrap:balance;margin:0 0 .5em}
h1{font-size:clamp(34px,6vw,64px);font-weight:900;letter-spacing:-.01em}
h2{font-size:clamp(24px,3vw,34px);font-weight:800}
h3{font-size:18px;font-weight:700}
.inner{max-width:1180px;margin:0 auto;padding-left:max(20px,env(safe-area-inset-left));padding-right:max(20px,env(safe-area-inset-right))}
.skip{position:absolute;left:-999px}.skip:focus{left:12px;top:12px;background:#fff;padding:8px;z-index:50}
.eyebrow{font-size:12px;text-transform:uppercase;letter-spacing:.14em;font-weight:600;color:var(--gold);margin:0 0 12px}
.small{font-size:13px}.muted{color:var(--muted)}.center{text-align:center;margin:32px 0}
.row{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.btn{display:inline-block;font:inherit;font-weight:600;font-size:15px;padding:12px 20px;border-radius:999px;border:2px solid var(--navy);background:transparent;color:var(--navy);text-decoration:none;cursor:pointer}
.btn.primary{background:var(--gold);border-color:var(--gold);color:var(--navy)}
.btn.ghost{border-color:rgba(255,255,255,.6);color:#fff}
.btn:hover{filter:brightness(1.05)}
:focus-visible{outline:3px solid var(--gold);outline-offset:2px}

/* header */
.site-head{background:#fff;color:var(--ink);position:sticky;top:0;z-index:10;border-bottom:1px solid var(--line)}
.site-head .inner{display:flex;align-items:center;gap:20px;min-height:68px;flex-wrap:wrap}
.logo img{display:block;height:42px;width:auto}
.site-head nav{display:flex;gap:4px;margin-left:auto;flex-wrap:wrap}
.site-head nav a{color:var(--navy);text-decoration:none;font-weight:500;font-size:14px;padding:8px 12px;border-radius:999px}
.site-head nav a:hover,.site-head nav a[aria-current="page"]{background:var(--gold-soft)}
.menu-btn{display:none;margin-left:auto;font:inherit;font-weight:600;background:transparent;color:var(--navy);border:1px solid var(--line);border-radius:999px;padding:6px 14px}
@media (max-width:860px){
  .menu-btn{display:block}
  .site-head nav{display:none;width:100%;flex-direction:column;padding-bottom:12px}
  .site-head nav.open{display:flex}
}

/* hero */
.hero{background:var(--navy);color:#fff;overflow:hidden}
.hero-inner{display:grid;grid-template-columns:1.2fr 1fr;gap:40px;align-items:center;padding-block:72px 88px}
.hero h1 em{font-style:normal;color:var(--gold);display:block}
.lede{font-size:19px;max-width:34em;opacity:.9;margin:0 0 28px}
.hero-art{display:flex;justify-content:center}
.tee{width:min(320px,80%);aspect-ratio:1/1.05;background:var(--paper);position:relative;
  clip-path:polygon(30% 0,70% 0,78% 4%,100% 14%,92% 34%,82% 30%,82% 100%,18% 100%,18% 30%,8% 34%,0 14%,22% 4%);
  display:flex;align-items:center;justify-content:center;transform:rotate(-4deg);max-width:100%}
.tee span{font-family:"Arial Black","Arial Bold",Arial,sans-serif;font-weight:900;font-size:clamp(48px,8vw,92px);color:var(--navy);letter-spacing:.06em}
@media (max-width:760px){.hero-inner{grid-template-columns:1fr;padding-block:48px 56px}.hero-art{display:none}}

.props{display:grid;grid-template-columns:repeat(4,1fr);gap:28px;padding-block:64px}
.props div{border-top:3px solid var(--gold);padding-top:16px}
.props p{margin:0;color:var(--muted)}
@media (max-width:860px){.props{grid-template-columns:1fr 1fr}}
@media (max-width:480px){.props{grid-template-columns:1fr}}

.strip{overflow:hidden;padding-block:8px}
.strip-track{display:flex;gap:12px;width:max-content;animation:scroll 60s linear infinite}
.strip-track img{height:220px;width:220px;object-fit:cover;border-radius:10px;background:var(--gold-soft)}
@keyframes scroll{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.strip-track{animation:none}}

.split{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;padding-block:72px}
.how-mini{display:grid;gap:10px}
.how-mini div{display:flex;gap:14px;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:14px 16px}
.how-mini b{font-family:var(--display);font-size:22px;color:var(--gold);width:24px}
@media (max-width:760px){.split{grid-template-columns:1fr}}

.brands{background:var(--gold-soft);padding-block:36px}
.brand-row{display:flex;flex-wrap:wrap;gap:12px 36px;font-family:var(--display);font-weight:800;font-size:22px;color:var(--navy);opacity:.85}
.ig{text-align:center;padding-block:64px}

/* inner pages */
.page-head{background:var(--navy);color:#fff;padding-block:56px 48px}
.page-head p{opacity:.85;margin:0;max-width:40em}
.page-head a{color:var(--gold)}
.steps{display:grid;gap:20px;padding-block:48px}
.steps article{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:28px}
.step{font-size:12px;text-transform:uppercase;letter-spacing:.14em;font-weight:700;color:var(--gold)}
.choice{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.choice>div{border:1px solid var(--line);border-radius:10px;padding:18px}
@media (max-width:600px){.choice{grid-template-columns:1fr}}
.licensed{color:var(--muted);text-align:center;margin-bottom:56px}
.prose{max-width:760px;padding-block:40px 64px}
.prose h2{font-size:22px;margin-top:28px}

/* gallery */
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px;padding-top:40px}
.gallery button{all:unset;cursor:pointer;display:flex;flex-direction:column;gap:8px}
.gallery img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:10px;background:var(--gold-soft)}
.gallery span{font-weight:600;font-size:14px}
.lightbox{position:fixed;inset:0;background:rgba(10,15,30,.9);z-index:40;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px;color:#fff}
.lightbox img{max-height:80vh;border-radius:8px}
.lightbox button{position:absolute;top:16px;right:20px;font-size:36px;background:none;border:0;color:#fff;cursor:pointer}

/* forms */
.form-section{padding-block:40px 72px;max-width:860px}
.tz-form{display:flex;flex-direction:column;gap:24px}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.grid .full{grid-column:1/-1}
@media (max-width:600px){.grid{grid-template-columns:1fr}}
.tz-form label{display:flex;flex-direction:column;gap:6px;font-weight:600;font-size:14px}
.tz-form input,.tz-form select,.tz-form textarea{font:inherit;font-weight:400;padding:11px 12px;border:1px solid #cfccc2;border-radius:8px;background:#fff;color:var(--ink);width:100%}
.tz-form input[type=file]{padding:9px;background:var(--card)}
.tz-form input[type=checkbox]{width:auto}
.hint{font-weight:400;color:var(--muted);font-size:13px}
fieldset{border:1px solid var(--line);border-radius:12px;padding:20px;margin:0;background:var(--card);display:flex;flex-direction:column;gap:14px}
legend{font-family:var(--display);font-weight:800;font-size:18px;padding:0 6px}
.item{border:1px dashed #cfccc2;border-radius:10px;padding:16px;display:flex;flex-direction:column;gap:12px}
.sizes{display:grid;grid-template-columns:repeat(7,1fr);gap:8px}
.sizes label{font-size:12px;align-items:center}
.sizes input{text-align:center;padding:8px 4px}
@media (max-width:600px){.sizes{grid-template-columns:repeat(4,1fr)}}
.item-total,.grand-total{margin:0;font-weight:600;color:var(--muted)}
.grand-total{color:var(--ink)}
.link{all:unset;cursor:pointer;color:var(--bad);font-size:13px;font-weight:600;align-self:flex-start}
.confirm{flex-direction:row!important;align-items:flex-start;gap:10px!important;font-weight:500!important}
.confirm input{margin-top:5px}
.form-error{color:var(--bad);font-weight:600;margin:0}
.form-done{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:32px;text-align:center}
.hp{position:absolute;left:-5000px;width:1px;height:1px;opacity:0}

/* footer */
.site-foot{background:var(--ink);color:#d8dbe4;padding-block:48px 32px;margin-top:0}
.site-foot .inner{display:flex;flex-direction:column;gap:16px}
.site-foot a{color:#fff;text-decoration:none}
.site-foot a:hover{text-decoration:underline}
.foot-brand p{margin:8px 0 0;color:#a6abba}
.foot-links{display:flex;flex-wrap:wrap;gap:8px 22px}
.brand-row img{height:64px;width:auto;object-fit:contain;mix-blend-mode:multiply}
.ig-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:24px}
.ig-grid img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:10px}
@media (max-width:600px){.ig-grid{grid-template-columns:1fr 1fr}}
.licensed img{display:block;margin:0 auto 8px;background:var(--navy);border-radius:8px;padding:8px}
.foot-brand img{background:transparent}
.brand-row{align-items:center}
.brand-row img{height:56px;width:120px;object-fit:contain;background:#fff;border-radius:8px;padding:6px 10px;mix-blend-mode:normal}
.ig-grid a{display:block}