@font-face{font-family:"Montserrat";font-weight:800;font-style:normal;font-display:swap;src:url("/assets/fonts/montserrat-latin-800-normal.woff2") format("woff2")}
@font-face{font-family:"Montserrat";font-weight:900;font-style:normal;font-display:swap;src:url("/assets/fonts/montserrat-latin-900-normal.woff2") format("woff2")}
@font-face{font-family:"Poppins";font-weight:400;font-style:normal;font-display:swap;src:url("/assets/fonts/poppins-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"Poppins";font-weight:500;font-style:normal;font-display:swap;src:url("/assets/fonts/poppins-latin-500-normal.woff2") format("woff2")}
@font-face{font-family:"Poppins";font-weight:600;font-style:normal;font-display:swap;src:url("/assets/fonts/poppins-latin-600-normal.woff2") format("woff2")}

:root{
  --bg:#0E0E10;
  --panel:#18181B;
  --panel-hover:#202024;
  --line:#2A2A2F;
  --text:#FFFFFF;
  --muted:#B3B3B8;
  --dim:#9D9DA3;
  --brand:#BE1534;
  --brand-hover:#D21C3E;
  --accent:#FF5C6C;
  --radius:16px;
  --display:"Montserrat",system-ui,sans-serif;
  --body:"Poppins",system-ui,sans-serif;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--body);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:var(--text)}
a:hover{color:var(--accent)}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:6px}
.accent{color:var(--accent)}

.wrap{max-width:1120px;margin:0 auto;padding:40px 24px 32px;min-height:100vh;display:flex;flex-direction:column;gap:56px}
.wrap--narrow{max-width:720px}

/* Top bar */
.top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px}
.brand{display:flex;align-items:center;gap:14px;text-decoration:none}
.brand img{width:52px;height:52px;border-radius:50%}
.brand__name{display:block;font-family:var(--display);font-weight:800;font-size:16px;line-height:1.3}
.brand__handle{display:block;font-size:13px;color:var(--muted)}
.pill{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 18px;border:1.5px solid var(--line);border-radius:999px;text-decoration:none;font-weight:600;font-size:14px}
.pill:hover{border-color:var(--accent)}

/* Hero + links */
.main{display:flex;flex-wrap:wrap;gap:56px;align-items:center;flex:1}
.hero{flex:1 1 420px;min-width:0;display:flex;flex-direction:column;gap:20px}
.eyebrow{font-family:var(--display);font-weight:800;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);margin:0}
h1,h2{font-family:var(--display);font-weight:900;text-transform:uppercase;margin:0;line-height:1.04}
h1{font-size:clamp(2.1rem,5vw,4rem)}
h2{font-size:clamp(1.4rem,3vw,1.9rem)}
.lede{margin:0;font-size:18px;color:#C9C9CE;max-width:480px}

.links{flex:1 1 420px;min-width:0;display:flex;flex-direction:column;gap:12px;margin:0;padding:0;list-style:none}
.link{display:flex;align-items:center;gap:16px;min-height:76px;padding:14px 20px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);text-decoration:none;transition:background .15s,border-color .15s,transform .15s}
.link:hover{background:var(--panel-hover);border-color:var(--brand);color:var(--text);transform:translateY(-1px)}
.link svg{flex:none}
.link__text{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.link__title{font-weight:600;font-size:17px;line-height:1.35}
.link__sub{font-size:14px;color:var(--muted);line-height:1.4}
.link__arrow{color:var(--muted)}
.link:hover .link__arrow{color:var(--accent)}

/* Footer */
.foot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;padding-top:20px;border-top:1px solid var(--line);font-size:13px;color:var(--dim)}
.foot nav{display:flex;gap:20px}
.foot a{color:var(--dim)}
.foot a:hover{color:var(--accent)}

/* Inner pages */
.back{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-weight:500;font-size:14px;color:var(--muted);text-decoration:none}
.page-head{display:flex;flex-direction:column;gap:14px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:22px;padding:32px}

/* Form */
.form{display:flex;flex-direction:column;gap:20px}
.field{display:flex;flex-direction:column;gap:8px}
.field label{font-weight:600;font-size:15px}
.field .hint{font-size:13px;color:var(--dim);font-weight:400}
.field input,.field textarea{width:100%;font:inherit;font-size:16px;color:var(--text);background:var(--bg);border:1.5px solid var(--line);border-radius:12px;padding:13px 14px;min-height:50px}
.field textarea{min-height:150px;resize:vertical}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--accent)}
.field input::placeholder,.field textarea::placeholder{color:#6E6E75}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:56px;padding:0 28px;border:0;border-radius:14px;background:var(--brand);color:#fff;font-family:var(--display);font-weight:800;font-size:15px;letter-spacing:.05em;text-transform:uppercase;text-decoration:none;cursor:pointer}
.btn:hover{background:var(--brand-hover);color:#fff}
.btn[disabled]{opacity:.6;cursor:wait}
.fineprint{margin:0;font-size:13px;color:var(--dim)}
.status{margin:0;padding:14px 16px;border-radius:12px;font-size:15px}
.status--ok{background:#13261B;border:1px solid #2E6B45;color:#BDEBCB}
.status--err{background:#2A1216;border:1px solid #7A2230;color:#FFC2C9}

/* Prose (privacy) */
.prose{display:flex;flex-direction:column;gap:6px;color:#D6D6DA}
.prose h2{font-size:18px;margin-top:22px;text-transform:none;letter-spacing:0;line-height:1.3}
.prose p,.prose ul{margin:0 0 8px}
.prose li{margin-bottom:4px}

@media (max-width:640px){
  .wrap{padding:28px 20px 24px;gap:32px}
  .top{flex-direction:column;text-align:center}
  .brand{flex-direction:column;gap:12px}
  .brand img{width:84px;height:84px}
  .brand__name{font-size:18px}
  .main{gap:28px}
  .hero{text-align:center;align-items:center;gap:14px}
  .hero .eyebrow{font-size:11px}
  .hero h1{font-size:1.75rem}
  .lede{font-size:16px}
  .link{min-height:68px;padding:12px 16px}
  .link__title{font-size:16px}
  .link__sub{font-size:13px}
  .card{padding:22px}
  .foot{flex-direction:column;align-items:center;text-align:center}
}
@media (prefers-reduced-motion:reduce){.link{transition:none}.link:hover{transform:none}}
.check{display:flex;gap:12px;align-items:flex-start;font-size:14px;color:#C9C9CE;line-height:1.5;cursor:pointer}
.check input{flex:none;width:20px;height:20px;margin:2px 0 0;accent-color:var(--brand)}

/* v4: image tiles + CTAs */
.tile{display:flex;flex-direction:column;gap:14px;padding:16px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);text-decoration:none;transition:background .15s,border-color .15s,transform .15s}
.tile:hover{background:var(--panel-hover);border-color:var(--brand);color:var(--text);transform:translateY(-1px)}
.tile:hover .link__arrow{color:var(--accent)}
.tile__head{display:flex;align-items:center;gap:16px;padding:0 4px}
.tile__head svg{flex:none}
.posts{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.post{position:relative;margin:0;aspect-ratio:4/5;border-radius:12px;overflow:hidden;background:#000}
.post img{width:100%;height:100%;object-fit:cover;display:block}
.post__tag{position:absolute;left:6px;top:6px;padding:3px 8px;border-radius:999px;background:rgba(14,14,16,.78);font-size:11px;font-weight:600;letter-spacing:.02em;color:#fff}
.post:first-child .post__tag{background:var(--brand)}
.tile--res{flex-direction:row;align-items:center;gap:16px;padding:18px 20px;min-height:120px;overflow:hidden}
.tile--res .link__text{gap:4px}
.tile--res .eyebrow{font-size:11px}
.covers{position:relative;flex:none;width:118px;height:96px}
.covers img{position:absolute;width:64px;height:auto;border-radius:6px;box-shadow:0 6px 18px rgba(0,0,0,.5);transition:transform .2s}
.covers img:first-child{right:0;top:2px;transform:rotate(7deg)}
.covers img:last-child{right:44px;top:6px;transform:rotate(-6deg)}
.tile--res:hover .covers img:first-child{transform:rotate(10deg) translateY(-3px)}
.tile--res:hover .covers img:last-child{transform:rotate(-9deg) translateY(-3px)}
.ctas{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.cta{display:flex;flex-direction:column;gap:6px;padding:20px;border-radius:var(--radius);text-decoration:none;transition:transform .15s,box-shadow .15s}
.cta:hover{transform:translateY(-2px);box-shadow:0 10px 30px rgba(0,0,0,.35)}
.cta__eyebrow{font-family:var(--display);font-weight:800;font-size:11px;letter-spacing:.12em;text-transform:uppercase;opacity:.85}
.cta__title{font-family:var(--display);font-weight:900;font-size:18px;line-height:1.15;text-transform:uppercase}
.cta__sub{font-size:14px;opacity:.85;line-height:1.4}
.cta__btn{display:inline-flex;align-items:center;gap:8px;align-self:flex-start;margin-top:auto;padding:11px 16px;border-radius:12px;font-family:var(--display);font-weight:800;font-size:13px;letter-spacing:.05em;text-transform:uppercase}
.cta__sub{margin-bottom:10px}
.cta--work{background:linear-gradient(135deg,#D21C3E 0%,#8E0F27 100%);color:#fff}
.cta--work:hover{color:#fff}
.cta--work .cta__btn{background:#fff;color:#8E0F27}
.cta--collab{background:#F3ECE2;color:#141416}
.cta--collab:hover{color:#141416}
.cta--collab .cta__btn{background:#141416;color:#F3ECE2}
.link--guide{min-height:104px}
.link__cover{flex:none;width:58px;height:auto;border-radius:6px;box-shadow:0 4px 14px rgba(0,0,0,.45)}
.page-head--guide{display:flex;flex-direction:row;align-items:center;gap:28px}
.guide-cover{flex:none;width:150px;height:auto;border-radius:10px;box-shadow:0 12px 36px rgba(0,0,0,.55);transform:rotate(-3deg)}
@media (max-width:640px){
  .ctas{grid-template-columns:1fr}
  .tile{padding:12px}
  .posts{gap:6px}
  .tile--res{padding:14px 16px;min-height:104px}
  .covers{width:100px}
  .covers img{width:56px}
  .covers img:last-child{right:38px}
  .page-head--guide{flex-direction:column;align-items:flex-start;gap:20px}
  .guide-cover{width:120px}
  .cta__title{font-size:17px}
}
@media (prefers-reduced-motion:reduce){.tile,.cta,.covers img{transition:none}.tile:hover,.cta:hover{transform:none}}
.tile__head .link__sub{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (max-width:640px){
  .hide-sm{display:none}
  .links{width:100%}
  .tile__head{gap:12px;padding:2px 2px 0}
  .post{border-radius:10px}
  .post__tag{left:5px;top:5px;padding:2px 7px;font-size:10px}
  .tile--res .link__title{font-size:16px}
  .cta{padding:18px}
  .cta__sub{margin-bottom:8px}
}
/* tags covered post headlines: use an outline for the newest post instead */
.post__tag{display:none}
.post:first-child{outline:2px solid var(--brand);outline-offset:2px}
@media (max-width:380px){.covers{width:84px}.covers img{width:48px}.covers img:last-child{right:32px}}

/* v7: shop */
.wrap--shop{max-width:1040px}
.tile--shop .shop-thumb{flex:none;width:132px;height:auto;border-radius:10px;box-shadow:0 6px 18px rgba(0,0,0,.5);transition:transform .2s}
.tile--shop:hover .shop-thumb{transform:translateY(-3px) rotate(-1deg)}
.bundle{display:grid;grid-template-columns:1.1fr 1fr;gap:28px;align-items:center;padding:20px;background:var(--panel);border:1.5px solid var(--brand);border-radius:22px}
.bundle__img img,.product__img img{width:100%;height:auto;border-radius:14px}
.bundle__body{display:flex;flex-direction:column;gap:12px}
.products{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin:0;padding:0;list-style:none}
.product{display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;transition:border-color .15s,transform .15s}
.product:hover{border-color:var(--brand);transform:translateY(-1px)}
.product__img{display:block}
.product__img img{border-radius:0}
.product__body{display:flex;flex-direction:column;gap:8px;padding:18px 20px 20px;flex:1}
.product__name{font-size:18px;line-height:1.2}
.product__desc{margin:0;font-size:15px;color:#C9C9CE;line-height:1.5}
.product__meta{margin:0;font-size:13px;color:var(--dim)}
.product__buy{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:auto;padding-top:10px}
.price{font-family:var(--display);font-weight:900;font-size:26px}
.price s{font-size:16px;color:var(--dim);font-weight:800;margin-left:6px}
.btn--sm{min-height:46px;padding:0 18px;font-size:13px}
.shop-note{text-align:center}
.shop-note a{color:var(--muted)}
@media (max-width:760px){
  .bundle{grid-template-columns:1fr;padding:14px;gap:18px}
  .products{grid-template-columns:1fr}
}
@media (max-width:640px){
  .tile--shop .shop-thumb{width:100px}
  .price{font-size:22px}
}
@media (prefers-reduced-motion:reduce){.product,.tile--shop .shop-thumb{transition:none}.product:hover{transform:none}}

/* v8: featured product on home */
.feature{display:flex;flex-direction:column;background:var(--panel);border:1.5px solid var(--brand);border-radius:var(--radius);overflow:hidden}
.feature__img img{width:100%;height:auto;display:block}
.feature__body{display:flex;flex-direction:column;gap:6px;padding:16px 20px 18px}
.feature__body .eyebrow{font-size:11px}
.feature__buy{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:8px}
.feature__more{display:flex;align-items:center;justify-content:center;gap:8px;min-height:48px;margin-top:8px;border:1.5px solid var(--line);border-radius:12px;font-family:var(--display);font-weight:800;font-size:13px;letter-spacing:.05em;text-transform:uppercase;text-decoration:none}
.feature__more:hover{border-color:var(--accent)}

.nl-list{list-style:none;margin:0 0 22px;padding:0;display:grid;gap:10px}
.nl-list li{display:flex;gap:12px;align-items:center;font-weight:500}
.nl-list span{font-size:20px}
.tile--nl{flex-direction:row;align-items:center;gap:16px;padding:18px 20px}
.tile--nl .nl-badge{flex:none;width:58px;height:58px;border-radius:16px;background:var(--brand);display:flex;align-items:center;justify-content:center;font-size:28px}

/* v17: proper desktop home (mobile layout unchanged below 961px) */
.dsk{display:none}
@media (min-width:961px){
  .dsk{display:revert}
  .wrap--home{max-width:1200px;padding:0 40px 36px;gap:0}
  /* sticky header with nav */
  .wrap--home .top{position:sticky;top:0;z-index:20;flex-wrap:nowrap;padding:16px 0}
  .wrap--home .top::before{content:"";position:absolute;z-index:-1;top:0;bottom:0;left:50%;width:100vw;transform:translateX(-50%);background:rgba(14,14,16,.86);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
  .wrap--home .brand img{width:44px;height:44px}
  .wrap--home .dnav{display:flex;gap:30px;margin-left:auto;margin-right:28px}
  .wrap--home .dnav a{font-weight:500;font-size:15px;color:#D6D6DA;text-decoration:none}
  .wrap--home .dnav a:hover{color:var(--accent)}
  /* page grid */
  .wrap--home .main{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;row-gap:24px;align-items:start;padding:72px 0 88px;flex:1}
  .wrap--home .main > .links{display:contents}
  .wrap--home .hero{grid-column:1 / 8;grid-row:1;align-self:center;gap:22px}
  .wrap--home .hero h1{font-size:clamp(2.6rem,3.5vw,3.5rem);line-height:1.02}
  .wrap--home .lede{font-size:19px;max-width:520px}
  .wrap--home .hero__actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:6px}
  .wrap--home .btn--ghost{background:transparent;border:1.5px solid var(--line);color:#fff}
  .wrap--home .btn--ghost:hover{background:transparent;border-color:var(--accent);color:#fff}
  .wrap--home .stats{display:flex;gap:0;list-style:none;margin:14px 0 0;padding:0}
  .wrap--home .stats li{display:flex;flex-direction:column;padding:0 28px;border-left:1px solid var(--line)}
  .wrap--home .stats li:first-child{padding-left:0;border-left:0}
  .wrap--home .stats strong{font-family:var(--display);font-weight:900;font-size:28px;line-height:1.1}
  .wrap--home .stats span{font-size:13px;color:var(--muted)}
  .wrap--home .tile--ig{grid-column:8 / 13;grid-row:1;padding:20px;align-self:center}
  .wrap--home .tile--ig .posts{gap:10px}
  .wrap--home .dsec{grid-column:1 / -1;display:flex;flex-direction:column;gap:10px;margin:64px 0 8px;font-size:clamp(1.8rem,2.6vw,2.4rem);text-transform:uppercase}
  .wrap--home .dsec .eyebrow{font-size:13px}
  .wrap--home .dsec--shop{grid-row:2}
  .wrap--home .feature{grid-column:1 / -1;grid-row:3;flex-direction:row;align-items:stretch}
  .wrap--home .feature__img{flex:0 0 52%;display:block;overflow:hidden}
  .wrap--home .feature__img img{width:100%;height:100%;object-fit:cover}
  .wrap--home .feature__body{flex:1;justify-content:center;gap:12px;padding:40px 48px}
  .wrap--home .feature__buy{margin-top:12px}
  .wrap--home .feature__body .btn--sm{min-height:52px;padding:0 24px;font-size:14px}
  .wrap--home .feature__body .link__title{font-family:var(--display);font-weight:900;text-transform:uppercase;font-size:30px;line-height:1.1}
  .wrap--home .feature__body .link__sub{font-size:16px;max-width:440px}
  .wrap--home .feature__body .price{font-size:34px}
  .wrap--home .tile--res{grid-column:1 / 7;grid-row:4;align-self:stretch;padding:24px 28px;min-height:132px}
  .wrap--home .tile--nl{grid-column:7 / 13;grid-row:4;align-self:stretch;padding:24px 28px}
  .wrap--home .dsec--ctas{grid-row:5}
  .wrap--home .ctas{grid-column:1 / -1;grid-row:6;gap:24px}
  .wrap--home .cta{padding:40px;min-height:240px;gap:10px}
  .wrap--home .cta__title{font-size:28px;max-width:460px}
  .wrap--home .cta__sub{font-size:16px}
  .wrap--home .cta__btn{padding:14px 20px;font-size:14px}
  /* footer */
  .wrap--home .foot{display:grid;grid-template-columns:1fr auto;align-items:center;row-gap:24px;padding-top:44px}
  .wrap--home .foot__cols{grid-column:1 / -1;display:grid;grid-template-columns:2fr 1fr 1fr;gap:40px;padding-bottom:28px;border-bottom:1px solid var(--line)}
  .wrap--home .foot__brand{display:flex;gap:16px;align-items:flex-start}
  .wrap--home .foot__brand img{width:40px;height:40px;border-radius:50%}
  .wrap--home .foot__brand p{margin:0;font-size:14px;color:var(--muted);max-width:320px;line-height:1.6}
  .wrap--home .foot__brand strong{color:#fff;font-family:var(--display);font-weight:800}
  .wrap--home .foot__cols nav{display:flex;flex-direction:column;gap:10px}
  .wrap--home .foot__cols nav span{font-family:var(--display);font-weight:800;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#fff;margin-bottom:4px}
  .wrap--home .foot__cols nav a{font-size:14px;color:var(--muted);text-decoration:none}
  .wrap--home .foot__cols nav a:hover{color:var(--accent)}
  .wrap--home .foot > nav{display:flex;gap:20px}
}
@media (min-width:961px) and (max-width:1120px){
  .wrap--home .dnav{gap:20px;margin-right:18px}
  .wrap--home .dnav a{font-size:14px}
  .wrap--home .stats li{padding:0 18px}
}

/* v18: six latest posts on desktop, three on mobile */
@media (max-width:960px){.posts .post:nth-child(n+4){display:none}}
@media (min-width:961px){
  .wrap--home .hero{grid-column:1 / 7}
  .wrap--home .hero h1{font-size:clamp(2.4rem,3.2vw,3.1rem)}
  .wrap--home .tile--ig{grid-column:7 / 13;padding:22px;gap:16px}
  .wrap--home .tile--ig .posts{grid-template-columns:repeat(3,1fr);gap:12px}
  .wrap--home .tile__head .link__title{font-size:18px}
  .wrap--home .stats li{padding:0 22px}
  .wrap--home .stats li:first-child{padding-left:0}
  .wrap--home .stats span{white-space:nowrap}
}