/* CHI homepage (index.html only). Page-local; styles.css / site.js untouched.
   Desktop geometry is authored on the 1536px approved reference and scaled with --u. */
.hp-page{--u:min(1px,calc(100vw / 1536));--hp-bg:#00080d;--hp-volt:#d8ff3e;--hp-line:rgba(255,255,255,.09);background:var(--hp-bg)}
.hp-page .site-header{background:rgba(3,4,5,.96)}
@media(min-width:1200px){.hp-page .site-header .container{width:calc(1346 * var(--u))}}
.hp-main{background:var(--hp-bg);color:#f4f1ea;font-family:"Figtree",Arial,Helvetica,sans-serif;overflow:hidden}
.hp-frame{position:relative;width:calc(1536 * var(--u));margin:0 auto}

/* HERO */
.hp-hero{position:relative;border-bottom:1px solid var(--hp-line);background:radial-gradient(ellipse at 70% 30%,#071721 0,var(--hp-bg) 70%)}
.hp-hero .hp-frame{height:calc(530 * var(--u))}
.hp-hero-art{position:absolute;top:0;right:0;width:calc(806 * var(--u));height:100%;-webkit-mask-image:linear-gradient(90deg,transparent 0,rgba(0,0,0,.35) calc(110 * var(--u)),#000 calc(260 * var(--u)));mask-image:linear-gradient(90deg,transparent 0,rgba(0,0,0,.35) calc(110 * var(--u)),#000 calc(260 * var(--u)))}
@media(min-width:1537px){.hp-hero-art{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 150px,#000 calc(100% - 90px),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 150px,#000 calc(100% - 90px),transparent 100%)}}
.hp-hero-art img{display:block;width:100%;height:100%;object-fit:cover;object-position:left top}
.hp-hero-copy{position:relative;z-index:2;padding:calc(46 * var(--u)) 0 0 calc(98 * var(--u))}
.hp-hero h1{font-family:"Source Serif 4",Georgia,"Times New Roman",serif;font-optical-sizing:auto;font-variation-settings:"opsz" 60;font-weight:700;font-size:calc(65.5 * var(--u));line-height:calc(55.5 * var(--u));letter-spacing:-.018em;color:#fff;margin:0;text-shadow:0 2px 18px rgba(0,0,0,.45)}
.hp-hero h1 span{display:block}
.hp-hero h1 em{font-style:normal;color:var(--hp-volt)}
.hp-lede{font-size:calc(18 * var(--u));line-height:calc(23.6 * var(--u));color:#f1f2ef;max-width:calc(500 * var(--u));margin:calc(17 * var(--u)) 0 0}
.hp-ctas{display:flex;align-items:center;gap:calc(30 * var(--u));margin-top:calc(22 * var(--u))}
.hp-btn{display:inline-flex;align-items:center;justify-content:center;gap:calc(12 * var(--u));height:calc(49 * var(--u));padding:0 calc(28 * var(--u));background:var(--hp-volt);color:#07090a;font-weight:800;font-size:calc(14.5 * var(--u));letter-spacing:.14em;text-transform:uppercase;border-radius:2px;box-shadow:0 0 0 1px rgba(216,255,62,.4),0 8px 24px rgba(0,0,0,.35);transition:transform .15s ease,filter .15s ease}
.hp-btn svg,.hp-link svg{width:1.15em;height:1.15em}
.hp-btn:hover{transform:translateY(-1px);filter:brightness(1.05)}
.hp-link{display:inline-flex;gap:calc(10 * var(--u));color:#fff;font-weight:700;font-size:calc(13.5 * var(--u));letter-spacing:.14em;text-transform:uppercase;padding-bottom:calc(5 * var(--u));border-bottom:1px solid rgba(255,255,255,.75)}
.hp-link:hover{color:var(--hp-volt);border-color:var(--hp-volt)}
.hp-btn:focus-visible,.hp-link:focus-visible,.hp-q:focus-visible,.hp-card:focus-visible{outline:2px solid var(--hp-volt);outline-offset:3px}

/* FOUR QUESTIONS */
.hp-questions{border-bottom:1px solid var(--hp-line)}
.hp-q-grid{display:grid;grid-template-columns:repeat(4,1fr);padding:calc(17 * var(--u)) calc(14 * var(--u)) calc(16 * var(--u)) calc(25 * var(--u));min-height:calc(149 * var(--u))}
.hp-q{position:relative;display:grid;grid-template-columns:auto 1fr auto;align-items:start;column-gap:calc(16 * var(--u));padding:0 calc(20 * var(--u)) 0 calc(31 * var(--u));border-left:1px solid var(--hp-line)}
.hp-q:first-child{border-left:0}
.hp-q-num{font-family:"Figtree",Arial,sans-serif;font-weight:800;font-size:calc(36 * var(--u));line-height:1;color:#fff;letter-spacing:-.01em;padding-top:calc(4 * var(--u))}
.hp-q-text{font-family:"Kalam","Segoe Print","Bradley Hand",sans-serif;font-weight:700;font-size:calc(26 * var(--u));line-height:calc(32 * var(--u));color:var(--hp-volt);letter-spacing:-.005em;padding-top:calc(2 * var(--u))}
.hp-q .hp-circle{align-self:center}
.hp-q-text>span{display:block;white-space:nowrap}
.hp-circle{display:inline-grid;place-items:center;width:calc(27 * var(--u));height:calc(27 * var(--u));border:1.5px solid rgba(255,255,255,.85);border-radius:50%;color:#fff;flex-shrink:0;transition:background .15s ease,color .15s ease,border-color .15s ease}
.hp-circle svg{width:52%;height:52%}
.hp-q:hover .hp-circle,.hp-card:hover .hp-circle{background:var(--hp-volt);border-color:var(--hp-volt);color:#000}
.hp-q:hover .hp-q-text{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:5px}

/* FEATURED CARDS (reusable slots) */
.hp-card-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:calc(24 * var(--u));padding:calc(17 * var(--u)) calc(42 * var(--u)) calc(40 * var(--u)) calc(43 * var(--u))}
.hp-card{display:flex;flex-direction:column;background:#03090e;border:1px solid rgba(255,255,255,.08);transition:border-color .15s ease,transform .15s ease}
.hp-card:hover{border-color:rgba(216,255,62,.55);transform:translateY(-2px)}
.hp-card-img{display:block;aspect-ratio:343/114;overflow:hidden;background:#0a1116}
.hp-card-img img{display:block;width:100%;height:100%;object-fit:cover}
.hp-card-body{display:flex;flex-direction:column;align-items:flex-start;padding:calc(14 * var(--u)) calc(16 * var(--u)) calc(14 * var(--u)) calc(22 * var(--u));flex:1}
.hp-card-label{font-weight:800;font-size:calc(12 * var(--u));letter-spacing:.13em;text-transform:uppercase;color:var(--hp-volt)}
.hp-card-title{font-family:"Source Serif 4",Georgia,serif;font-variation-settings:"opsz" 40;font-weight:700;font-size:calc(22 * var(--u));line-height:calc(25.5 * var(--u));letter-spacing:-.02em;color:#fff;margin:calc(7 * var(--u)) 0 calc(14 * var(--u))}
.hp-card .hp-circle{margin-top:auto}

/* TABLET / MOBILE: fixed sizes, stacked */
@media(max-width:1000px){
  .hp-page{--u:1px}
  .hp-frame{width:auto}
  .hp-hero .hp-frame{height:auto;padding:0 0 32px}
  .hp-hero-art{position:relative;width:100%;height:auto;aspect-ratio:806/530;max-height:420px;margin-left:auto;-webkit-mask-image:linear-gradient(180deg,#000 75%,transparent 100%),linear-gradient(90deg,transparent 0,#000 18%);-webkit-mask-composite:source-in;mask-image:linear-gradient(180deg,#000 75%,transparent 100%);order:2}
  .hp-hero .hp-frame{display:flex;flex-direction:column}
  .hp-hero-copy{padding:34px 22px 8px}
  .hp-hero h1{font-size:clamp(38px,8.2vw,62px);line-height:1.02}
  .hp-lede{font-size:17px;line-height:1.45;max-width:560px}
  .hp-ctas{flex-wrap:wrap;gap:18px 26px}
  .hp-btn{height:50px;font-size:13.5px;padding:0 24px}
  .hp-link{font-size:13px}
  .hp-q-grid{grid-template-columns:1fr 1fr;padding:8px 22px;row-gap:0}
  .hp-q{padding:22px 14px 22px 0;border-left:0;border-top:1px solid var(--hp-line);column-gap:14px}
  .hp-q:nth-child(-n+2){border-top:0}
  .hp-q:nth-child(2n){padding-left:18px;border-left:1px solid var(--hp-line)}
  .hp-q-num{font-size:30px}
  .hp-q-text{font-size:30px;line-height:29px;transform:none}
  .hp-q-text>span{display:inline;white-space:normal}
  .hp-card-title br{display:none}
  .hp-circle{width:28px;height:28px}
  .hp-card-grid{grid-template-columns:1fr 1fr;gap:16px;padding:24px 22px 40px}
  .hp-card-body{padding:14px 18px 16px}
  .hp-card-label{font-size:11.5px}
  .hp-card-title{font-size:21px;line-height:1.18}
}
@media(max-width:600px){
  .hp-hero-copy{padding:28px 16px 4px}
  .hp-hero h1{font-size:clamp(34px,10.4vw,46px)}
  .hp-hero h1 span{display:inline}
  .hp-hero h1 span:nth-child(3)::after{content:"\A";white-space:pre}
  .hp-lede{font-size:16px}
  .hp-btn{width:100%}
  .hp-hero-art{max-height:none;margin-top:6px}
  .hp-q-grid{grid-template-columns:1fr;padding:4px 16px}
  .hp-q,.hp-q:nth-child(2n){padding:18px 0;border-left:0;border-top:1px solid var(--hp-line)}
  .hp-q:first-child{border-top:0}
  .hp-q:nth-child(2){border-top:1px solid var(--hp-line)}
  .hp-q-text{font-size:28px;line-height:27px}
  .hp-card-grid{grid-template-columns:1fr;padding:20px 16px 36px}
}
