
/* =====================================================================
   INNER PAGES — shared design system extensions (A1 body + A2 chrome)
   ===================================================================== */
.skip{position:absolute;left:-9999px;top:0;background:var(--blood);color:var(--scar);padding:10px 16px;z-index:100;font-family:'Archivo Black',sans-serif;font-size:12px;letter-spacing:.2em;text-transform:uppercase}
.skip:focus{left:12px;top:12px}
nav.top ul a[aria-current="page"]{color:var(--scar)}

/* ---- page header (3 tones) ---- */
.page-head{position:relative;overflow:hidden;padding:84px 0 72px}
.page-head .crumbs{font-family:'Archivo Black',sans-serif;font-size:10px;letter-spacing:.3em;text-transform:uppercase;margin-bottom:26px}
.page-head .crumbs a{text-decoration:none}
.page-head .crumbs a:hover,.page-head .crumbs a:focus-visible{text-decoration:underline}
.page-head .kicker{font-family:'Archivo Black',sans-serif;font-size:11px;letter-spacing:.38em;text-transform:uppercase;margin-bottom:22px;display:flex;align-items:center;gap:14px}
.page-head .kicker::before{content:"";width:36px;height:1px;background:var(--blood)}
.page-head h1{max-width:1000px;margin-bottom:26px}
.page-head .deck{font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:500;font-size:22px;line-height:1.5;max-width:760px}
.page-head .deck p+p{margin-top:14px}
.page-head .deck b,.page-head .deck strong{font-weight:600}
.page-head .deck a{color:inherit;text-decoration:underline;text-underline-offset:3px}
.page-head .deck a:hover,.page-head .deck a:focus-visible{color:var(--blood);outline:none}
.page-head .meta{margin-top:26px;font-family:'Archivo Black',sans-serif;font-size:10px;letter-spacing:.3em;text-transform:uppercase}
.page-head .meta span+span::before{content:"·";margin:0 12px;color:var(--blood)}

/* loud — A2 DNA: dark red takeover */
.page-head.loud{color:var(--scar)}
.page-head.loud h1{font-family:'Anton',sans-serif;font-size:clamp(52px,8vw,128px);line-height:.9;text-transform:uppercase;color:var(--scar);text-shadow:0 0 40px rgba(0,0,0,.6)}
.page-head.loud h1 .red{color:var(--blood);text-shadow:0 0 40px rgba(227,23,10,.55)}
.page-head.loud .deck{color:#E8D8D1}
.page-head.loud .kicker,.page-head.loud .crumbs,.page-head.loud .crumbs a,.page-head.loud .meta{color:#F3B9B2}
.page-head.loud::after{content:"";position:absolute;left:0;right:0;bottom:0;height:14px;background:var(--mist);
  clip-path:polygon(0 60%,6% 20%,14% 70%,24% 10%,34% 60%,46% 20%,58% 70%,70% 10%,82% 60%,92% 20%,100% 50%,100% 100%,0 100%)}

/* product — char with blood accent (hybrid) */
.page-head.product{background:linear-gradient(158deg,#1D0605,var(--char) 55%);color:var(--scar);border-bottom:4px solid var(--blood)}
.page-head.product::before{content:"";position:absolute;top:0;right:0;width:38%;height:100%;
  background:repeating-linear-gradient(-32deg,transparent 0 9px,rgba(227,23,10,.14) 9px 10px,transparent 10px 26px),radial-gradient(120% 90% at 80% 10%,rgba(227,23,10,.38),transparent 60%);
  clip-path:polygon(22% 0,100% 0,100% 100%,8% 100%,18% 82%,6% 64%,20% 46%,8% 28%,20% 12%)}
.page-head.product .wrap{position:relative;z-index:1}
.page-head.product h1{font-family:'Anton',sans-serif;font-size:clamp(46px,6.4vw,96px);line-height:.95;text-transform:uppercase;color:var(--scar)}
.page-head.product h1 .red{color:var(--blood)}
.page-head.product .deck{color:#E8D8D1}
.page-head.product .kicker,.page-head.product .crumbs,.page-head.product .crumbs a,.page-head.product .meta{color:#C9B6B0}

/* serious — A1 mirror (sage) */
.page-head.serious{background:var(--sage);border-bottom:1px solid rgba(92,110,96,.25);color:var(--char)}
.page-head.serious h1{font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:500;font-size:clamp(42px,5.6vw,78px);line-height:1.04;color:var(--char)}
.page-head.serious .deck{color:#3F4D42}
.page-head.serious .kicker,.page-head.serious .crumbs,.page-head.serious .crumbs a,.page-head.serious .meta{color:#4F6153}

/* legal — calm mist */
.page-head.legal{background:var(--mist);border-bottom:1px solid rgba(92,110,96,.2);color:var(--char);padding:70px 0 48px}
.page-head.legal h1{font-family:'Cormorant Garamond',serif;font-weight:500;font-size:clamp(38px,5vw,64px);line-height:1.05;color:var(--char)}
.page-head.legal .deck{color:#3F4D42;font-size:19px}
.page-head.legal .kicker,.page-head.legal .crumbs,.page-head.legal .crumbs a,.page-head.legal .meta{color:#4F6153}
@media(max-width:768px){.page-head{padding:56px 0 48px}.page-head .deck{font-size:19px}}

/* ---- prose ---- */
.content{padding:72px 0 96px}
.prose{max-width:760px;margin:0 auto;color:#3F4D42;font-family:'Cormorant Garamond',serif;font-size:20px;line-height:1.62}
.prose > *+*{margin-top:1.05em}
.prose h2{font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:600;font-size:clamp(30px,3.6vw,42px);line-height:1.12;color:var(--char);margin-top:2.1em;padding-top:.9em;border-top:1px solid rgba(92,110,96,.22);position:relative}
.prose h2::before{content:"";position:absolute;top:-1px;left:0;width:56px;height:3px;background:var(--blood)}
.prose h3{font-family:'Anton',sans-serif;font-weight:400;font-size:22px;letter-spacing:.03em;text-transform:uppercase;color:var(--char);margin-top:1.8em}
.prose h4{font-family:'Archivo Black',sans-serif;font-size:13px;letter-spacing:.2em;text-transform:uppercase;color:var(--char);margin-top:1.6em}
.prose a{color:#B3120A;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.prose a:hover,.prose a:focus-visible{color:var(--char);outline:none;text-decoration-thickness:2px}
.prose strong{color:var(--char);font-weight:600}
.prose em{font-style:italic}
.prose ul,.prose ol{padding-left:1.3em}
.prose li+li{margin-top:.45em}
.prose li::marker{color:var(--blood)}
.prose hr{border:0;height:0;margin:2.4em 0;border-top:1px dashed rgba(92,110,96,.3)}
.prose blockquote{background:var(--char);color:var(--scar);padding:24px 28px;border-left:4px solid var(--blood);font-family:'Archivo Black',sans-serif;font-size:15px;line-height:1.6;letter-spacing:.01em}
.prose blockquote p+p{margin-top:.6em}
.prose blockquote strong{color:var(--scar)}
.prose blockquote a{color:#FFB4AA}
.prose code{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:.82em;background:rgba(92,110,96,.12);padding:1px 6px}
.prose table{width:100%;border-collapse:collapse;font-size:17px;line-height:1.4;display:block;overflow-x:auto}
.prose thead th{background:var(--char);color:var(--scar);font-family:'Archivo Black',sans-serif;font-size:11px;letter-spacing:.18em;text-transform:uppercase;text-align:left;padding:12px 14px;white-space:nowrap}
.prose td{padding:12px 14px;border-bottom:1px solid rgba(92,110,96,.22);vertical-align:top;color:#3F4D42}
.prose tbody tr:nth-child(even) td{background:rgba(221,232,220,.45)}
.prose .lead{font-style:italic;font-weight:500;font-size:24px;line-height:1.5;color:var(--char)}
.prose .lead strong{font-weight:600}
@media(max-width:768px){.prose{font-size:19px}.content{padding:48px 0 72px}}

/* ---- callouts / boxes ---- */
.box{background:var(--blush);border:1px solid rgba(92,110,96,.2);padding:26px 28px}
.box h2,.box h3{margin-top:0;border:0;padding:0}
.box h2::before{display:none}
.box.dark{background:var(--char);color:#E8D8D1;border:0}
.box.dark h2,.box.dark h3,.box.dark strong{color:var(--scar)}
.box.dark a{color:#FFB4AA}
.notice{background:#FFF3CF;border:1px solid #C9A227;color:#4A3A07;padding:16px 20px;font-family:'Cormorant Garamond',serif;font-size:18px;line-height:1.5}
.notice strong{color:#2F2504}
.notice a{color:#7A1B10}
.related{margin-top:3em;background:var(--sage);padding:28px 30px;border-left:4px solid var(--blood)}
.related h2{margin:0 0 14px;padding:0;border:0;font-size:28px}
.related h2::before{display:none}
.related ul{list-style:none;padding:0}
.related li{padding:6px 0;border-bottom:1px solid rgba(92,110,96,.2)}
.related li:last-child{border-bottom:0}
.backlink{margin-top:1.4em;font-family:'Archivo Black',sans-serif;font-size:12px;letter-spacing:.2em;text-transform:uppercase}
.backlink a{text-decoration:none;color:var(--blood)}

/* ---- FAQ accordion ---- */
.faq{margin-top:1.2em}
.faq details{border-bottom:1px solid rgba(92,110,96,.25);padding:4px 0}
.faq details:first-of-type{border-top:1px solid rgba(92,110,96,.25)}
.faq summary{cursor:pointer;list-style:none;padding:16px 40px 16px 0;position:relative;font-family:'Cormorant Garamond',serif;font-weight:600;font-size:22px;line-height:1.3;color:var(--char)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:6px;top:12px;font-family:'Anton',sans-serif;font-size:26px;color:var(--blood)}
.faq details[open] summary::after{content:"–"}
.faq summary:focus-visible{outline:2px solid var(--blood);outline-offset:2px}
.faq .a{padding:0 0 18px;color:#3F4D42}
.faq .a > *+*{margin-top:.8em}
.chips{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 10px}
.chips a{font-family:'Archivo Black',sans-serif;font-size:11px;letter-spacing:.18em;text-transform:uppercase;text-decoration:none;color:var(--char);border:1px solid var(--char);padding:9px 14px}
.chips a:hover,.chips a:focus-visible{background:var(--char);color:var(--scar);outline:none}

/* ---- card grid (blog index, hubs) ---- */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:28px}
@media(max-width:1000px){.cards{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.cards{grid-template-columns:1fr}}
.card{background:var(--mist);border:1px solid rgba(92,110,96,.22);padding:26px 24px;display:flex;flex-direction:column;gap:12px;position:relative;transition:transform .2s,box-shadow .2s}
.card:hover,.card:focus-within{transform:translateY(-3px);box-shadow:0 14px 30px rgba(11,5,6,.12)}
.card .cat{font-family:'Archivo Black',sans-serif;font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:#B3120A}
.card h3{font-family:'Anton',sans-serif;font-weight:400;font-size:21px;line-height:1.15;text-transform:uppercase;color:var(--char);margin:0}
.card h3 a{color:inherit;text-decoration:none}
.card h3 a::after{content:"";position:absolute;inset:0}
.card p{font-family:'Cormorant Garamond',serif;font-size:17px;line-height:1.5;color:#3F4D42}
.card .date{margin-top:auto;font-family:'Archivo Black',sans-serif;font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:#6B6360}
.wide{max-width:1180px;margin:0 auto}
.series-title{font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:600;font-size:clamp(30px,3.6vw,44px);color:var(--char);margin-top:64px}
.series-title:first-child{margin-top:0}
.series-title + p{font-family:'Cormorant Garamond',serif;font-size:19px;color:#3F4D42;max-width:760px;margin-top:8px}

/* ---- 18+ soft gate ---- */
.gate{background:var(--char);color:var(--scar);padding:30px;border:1px solid var(--blood);margin-top:1.2em}
.gate p{color:#E8D8D1;font-family:'Cormorant Garamond',serif;font-size:19px}
.gate .gate-btn{margin-top:16px;font-family:'Archivo Black',sans-serif;font-size:12px;letter-spacing:.24em;text-transform:uppercase;background:var(--blood);color:var(--scar);border:1px solid var(--blood);padding:16px 22px;cursor:pointer}
.gate .gate-btn:hover,.gate .gate-btn:focus-visible{background:var(--scar);color:var(--char);outline:none}
.gate-body[hidden]{display:none}
.gate-body{margin-top:18px}

/* ---- in-page CTA band ---- */
.cta-band{background:linear-gradient(158deg,#1D0605,var(--char) 62%);color:var(--scar);padding:72px 0;text-align:center;position:relative;overflow:hidden}
.cta-band::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(-32deg,transparent 0 9px,rgba(227,23,10,.12) 9px 10px,transparent 10px 26px)}
.cta-band .wrap{position:relative}
.cta-band h2{font-family:'Anton',sans-serif;font-weight:400;font-size:clamp(34px,5vw,64px);line-height:1;text-transform:uppercase;margin-bottom:18px}
.cta-band h2 .red{color:var(--blood)}
.cta-band p{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:21px;color:#E8D8D1;max-width:620px;margin:0 auto 30px}
.cta-band .btn-primary{background:var(--blood);border-color:var(--blood)}
.cta-band .btn-primary:hover,.cta-band .btn-primary:focus-visible{background:var(--scar);color:var(--char);border-color:var(--scar)}
.cta-band .btn-secondary{color:var(--scar);border-color:var(--scar)}
.cta-band .btn-secondary:hover,.cta-band .btn-secondary:focus-visible{background:var(--scar);color:var(--char)}

/* ---- footer: 5 columns ---- */
footer .cols{grid-template-columns:1.6fr 1fr 1fr 1fr 1fr}
@media(max-width:1000px){footer .cols{grid-template-columns:1fr 1fr 1fr}}
@media(max-width:640px){footer .cols{grid-template-columns:1fr 1fr}}
@media(max-width:420px){footer .cols{grid-template-columns:1fr}}
footer .base .tag18{color:#B29B96}

/* ---- passive privacy notice (no tracking) ---- */
.cc-notice{position:fixed;right:20px;bottom:20px;z-index:80;max-width:360px;background:var(--char);color:var(--scar);border:1px solid rgba(227,23,10,.45);box-shadow:0 18px 40px rgba(0,0,0,.35);padding:20px 22px;transform:translateY(140%);opacity:0;transition:transform .5s cubic-bezier(.2,.7,.2,1),opacity .5s}
.cc-notice.show{transform:translateY(0);opacity:1}
.cc-notice p{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:17px;line-height:1.45;color:#E8D8D1}
.cc-notice .row{display:flex;align-items:center;gap:16px;margin-top:14px}
.cc-notice button{font-family:'Archivo Black',sans-serif;font-size:11px;letter-spacing:.22em;text-transform:uppercase;background:var(--blood);color:var(--scar);border:1px solid var(--blood);padding:11px 16px;cursor:pointer}
.cc-notice button:hover,.cc-notice button:focus-visible{background:var(--scar);color:var(--char);outline:none}
.cc-notice a{color:#FFB4AA;font-family:'Archivo Black',sans-serif;font-size:11px;letter-spacing:.16em;text-transform:uppercase}
@media(max-width:480px){.cc-notice{left:12px;right:12px;bottom:12px;max-width:none}}
@media(prefers-reduced-motion:reduce){.cc-notice{transition:none}.rise{animation:none}.ticker .track{animation:none}}
footer h2.fh{font-family:'Archivo Black',sans-serif;font-weight:400;font-size:11px;letter-spacing:.3em;color:var(--scar);text-transform:uppercase;margin-bottom:16px}
