/* nexxion.ai — Bold (Monochrome Technical) · shared styles for vertical subpages */
:root{
  --black:#0b0b0b; --off:#151515; --ash:#2a2a2a; --dim:#6b6b6b; --line:#2e2e2e;
  --paper:#f4f2ef; --acid:#d9ff2a;
  --sans:'Geist',-apple-system,BlinkMacSystemFont,sans-serif;
  --mono:'Geist Mono','JetBrains Mono',ui-monospace,monospace;
  --pad:clamp(20px,5vw,64px);
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;background:var(--black);color:var(--paper);font-family:var(--sans);-webkit-font-smoothing:antialiased;}
a{color:inherit;text-decoration:none;}
.wrap{max-width:1280px;margin:0 auto;padding-left:var(--pad);padding-right:var(--pad);}
.mono{font-family:var(--mono);}

/* keyboard focus — visible indicator for accessibility (WCAG 2.4.7) */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,label.hamburger:focus-visible{outline:2px solid var(--acid);outline-offset:2px;}
/* on the light contact-form band, keep an outline on focused fields rather than removing it */
.cf-in:focus-visible{outline:2px solid var(--black);outline-offset:1px;}

/* nav */
header.nav{position:sticky;top:0;z-index:40;background:rgba(11,11,11,0.85);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--ash);}
.nav .bar{display:flex;align-items:center;justify-content:space-between;padding:18px 0;}
.brand{display:flex;align-items:center;gap:12px;}
.brand .word{font-family:var(--mono);font-weight:500;font-size:20px;letter-spacing:-0.04em;}
.menu{display:flex;align-items:center;gap:30px;font-family:var(--mono);font-size:13px;}
.menu a:hover{color:var(--acid);}
.menu a.cta{background:var(--acid);color:var(--black);padding:6px 14px;font-weight:500;}
.menu a.cta:hover{color:var(--black);}
.navtoggle,.hamburger{display:none;}

/* subpage hero */
.sub-hero{padding:clamp(40px,6vw,72px) 0 clamp(32px,4vw,48px);border-bottom:1px solid var(--ash);}
.crumb{font-family:var(--mono);font-size:12px;letter-spacing:.06em;color:var(--dim);}
.crumb a:hover{color:var(--acid);}
.kick{font-family:var(--mono);font-size:12px;letter-spacing:.2em;color:var(--acid);text-transform:uppercase;}
.sub-hero h1{font-size:clamp(48px,9vw,108px);font-weight:500;letter-spacing:-0.05em;line-height:0.95;margin:20px 0 0;}
.sp-promise{font-size:clamp(20px,2.6vw,26px);font-weight:500;color:var(--paper);margin:18px 0 0;letter-spacing:-0.01em;}
.sp-lead{font-size:clamp(16px,2vw,18px);color:rgba(244,242,239,0.7);line-height:1.6;max-width:680px;margin:20px 0 0;}

/* sections */
.sp{padding:clamp(56px,8vw,88px) 0;}
.sp-head{font-family:var(--mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--acid);margin-bottom:28px;}

/* capabilities */
.caps{display:grid;gap:0;border-top:1px solid var(--ash);}
.cap{display:grid;grid-template-columns:0.9fr 2fr;gap:clamp(16px,4vw,48px);padding:26px 0;border-bottom:1px solid var(--ash);}
.cap h3{font-size:clamp(20px,2.4vw,26px);font-weight:500;letter-spacing:-0.02em;margin:0;}
.cap p{font-size:16px;color:rgba(244,242,239,0.68);line-height:1.6;margin:0;max-width:640px;}

/* approach */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid var(--ash);}
.step{padding:24px 28px 24px 0;border-right:1px solid var(--ash);}
.step:last-child{border-right:none;}
.step .n{font-family:var(--mono);font-size:12px;color:var(--dim);letter-spacing:.12em;}
.step h4{font-size:20px;font-weight:500;letter-spacing:-0.02em;margin:8px 0 0;}
.step p{font-size:14px;color:var(--dim);line-height:1.55;margin:8px 0 0;}

/* outcomes — acid band */
.outcomes{background:var(--acid);color:var(--black);}
.outcomes .sp-head{color:var(--black);opacity:.7;}
.out-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,56px);align-items:start;}
.out-grid h2{font-size:clamp(34px,5.5vw,56px);font-weight:500;letter-spacing:-0.04em;line-height:0.98;margin:14px 0 0;}
.out-list{display:flex;flex-direction:column;gap:14px;}
.out-list .o{display:flex;gap:14px;align-items:baseline;font-size:18px;font-weight:500;line-height:1.4;border-top:1px solid rgba(0,0,0,0.2);padding-top:14px;}
.out-list .o b{font-family:var(--mono);font-size:13px;font-weight:500;}

/* CTA — paper band */
.cta{background:var(--paper);color:var(--black);}
.cta .kick{color:var(--black);opacity:.7;}
.cta-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(28px,5vw,56px);align-items:start;}
.cta h2{font-size:clamp(40px,7vw,80px);font-weight:500;letter-spacing:-0.05em;line-height:0.95;margin:16px 0 0;}
.cta-actions{display:flex;flex-direction:column;gap:12px;font-family:var(--mono);font-size:14px;}
.cta-actions a{padding:16px 22px;font-weight:500;}
.cta-actions a.solid{background:var(--black);color:var(--paper);}
.cta-actions a.ghost{border:1px solid var(--black);color:var(--black);}
.cta-lead{font-size:16px;line-height:1.6;color:rgba(11,11,11,0.72);margin:18px 0 0;max-width:560px;}
.cta-goal{font-size:16px;line-height:1.6;color:var(--black);font-weight:500;margin:22px 0 0;max-width:560px;}
.cta .cs-bullets{margin:20px 0 0;}
.cta .cs-bullets li{color:rgba(11,11,11,0.72);}
.cta .cs-bullets b{color:var(--black);}

/* footer */
footer.site{background:var(--black);color:var(--paper);font-family:var(--mono);font-size:12px;border-top:1px solid var(--ash);padding:48px 0 36px;}
.fgrid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:36px;}
.fcol h4{color:var(--dim);letter-spacing:.14em;font-size:10px;font-weight:400;margin:0;}
.fcol .links{margin-top:12px;display:flex;flex-direction:column;gap:8px;}
.fcol .links a:hover{color:var(--acid);}
.faddr{color:var(--dim);line-height:1.6;margin-top:14px;}
.fbar{margin-top:48px;padding-top:20px;border-top:1px solid var(--ash);display:flex;justify-content:space-between;color:var(--dim);flex-wrap:wrap;gap:12px;}
.fsocial{display:flex;gap:14px;align-items:center}
.fsocial a{color:var(--dim);display:inline-flex;transition:color .15s}
.fsocial a:hover{color:var(--acid)}
.fsocial svg{width:18px;height:18px;fill:currentColor;display:block}

/* case study template */
.cs-meta{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(16px,3vw,32px);margin-top:36px;border-top:1px solid var(--ash);padding-top:24px;}
.cs-meta .l{font-family:var(--mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--acid);}
.cs-meta .v{font-size:16px;margin-top:8px;line-height:1.4;color:var(--paper);}
.cs-metrics{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--ash);}
.cs-metric{padding:28px 28px 28px 0;border-right:1px solid var(--ash);}
.cs-metric:last-child{border-right:none;}
.cs-metric .v{font-family:var(--mono);font-size:clamp(40px,6vw,68px);font-weight:500;letter-spacing:-0.04em;line-height:1;color:var(--acid);}
.cs-metric .l{font-family:var(--mono);font-size:12px;color:var(--dim);margin-top:12px;letter-spacing:.04em;}
.cs-prose{max-width:680px;}
.cs-prose p{font-size:17px;line-height:1.7;color:rgba(244,242,239,0.75);margin:0 0 18px;}
.cs-prose p:last-child{margin-bottom:0;}
.cs-quote{max-width:900px;}
.cs-quote blockquote{margin:0;font-size:clamp(24px,3.5vw,40px);font-weight:500;letter-spacing:-0.03em;line-height:1.2;}
.cs-quote .by{font-family:var(--mono);font-size:13px;color:var(--dim);margin-top:22px;letter-spacing:.04em;}

/* case study: smb automation page */
.cs-line{font-size:clamp(18px,2.3vw,24px);line-height:1.5;font-weight:500;max-width:780px;margin:0;letter-spacing:-0.01em;color:var(--paper);}
.cs-bullets{list-style:none;padding:0;margin:26px 0 0;max-width:780px;display:grid;gap:14px;}
.cs-bullets li{position:relative;padding-left:26px;font-size:16px;line-height:1.6;color:rgba(244,242,239,0.75);}
.cs-bullets li::before{content:"→";position:absolute;left:0;color:var(--acid);font-family:var(--mono);}
.cs-bullets b{font-weight:600;color:var(--paper);}
.cs-cap{font-family:var(--mono);font-size:12px;color:var(--dim);margin:18px 0 0;letter-spacing:.02em;line-height:1.5;}
.cs-diagram{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;gap:clamp(8px,1.6vw,18px);align-items:stretch;margin-top:26px;}
.cs-col{border:1px solid var(--ash);padding:18px;}
.cs-col.brain{background:var(--off);border-color:var(--acid);}
.cs-col h5{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--acid);margin:0 0 12px;}
.cs-col ul{list-style:none;margin:0;padding:0;display:grid;gap:8px;font-size:14px;line-height:1.4;color:var(--paper);}
.cs-arrow{font-family:var(--mono);color:var(--acid);font-size:22px;display:flex;align-items:center;justify-content:center;}
.cs-metrics.cols-4{grid-template-columns:repeat(4,1fr);}
.cs-auto{border-top:1px solid var(--ash);padding-top:30px;margin-top:44px;}
.cs-auto:first-of-type{margin-top:0;}
.cs-auto-head{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;}
.cs-auto-head .num{font-family:var(--mono);font-size:13px;color:var(--acid);letter-spacing:.06em;}
.cs-auto-head h3{font-size:clamp(22px,2.6vw,30px);font-weight:500;letter-spacing:-0.02em;margin:0;}
.cs-trigger{font-family:var(--mono);font-size:11px;letter-spacing:.06em;color:var(--dim);border:1px solid var(--ash);padding:4px 9px;}
.cs-auto .what{font-size:17px;line-height:1.6;color:rgba(244,242,239,0.75);max-width:780px;margin:16px 0 0;}
.cs-shots{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:24px;align-items:start;}
.cs-shot{margin:24px 0 0;border:1px solid var(--ash);background:var(--off);}
.cs-shots .cs-shot{margin:0;}
.cs-shot img{display:block;width:100%;height:auto;}
.cs-shot figcaption{font-family:var(--mono);font-size:11px;color:var(--dim);padding:10px 12px;border-top:1px solid var(--ash);}
.cs-run{margin:22px 0 0;border-left:2px solid var(--acid);padding:2px 0 2px 18px;font-size:15px;line-height:1.65;color:rgba(244,242,239,0.8);max-width:820px;}
.cs-run b{color:var(--paper);font-weight:600;}
.cs-repo{display:inline-block;margin-top:24px;font-family:var(--mono);font-size:14px;color:var(--acid);border-bottom:1px solid var(--acid);padding-bottom:3px;}
.cs-repo:hover{opacity:.7;}
.cs-defs{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:26px;}
.cs-def{border:1px solid var(--ash);padding:22px;}
.cs-def .tool{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--acid);}
.cs-def h4{font-size:20px;font-weight:500;letter-spacing:-0.02em;margin:8px 0 12px;color:var(--paper);}
.cs-def p{font-size:14px;line-height:1.6;color:rgba(244,242,239,0.75);margin:0;}
.cs-services{font-family:var(--mono);font-size:13px;color:var(--dim);margin:26px 0 0;}
.cs-services a{color:var(--acid);border-bottom:1px solid var(--acid);padding-bottom:1px;}
.cs-services a:hover{opacity:.7;}

@media(max-width:900px){
  .cs-diagram{grid-template-columns:1fr;}
  .cs-defs{grid-template-columns:1fr;}
  .cs-arrow{transform:rotate(90deg);}
  .cs-shots{grid-template-columns:1fr;}
  .cs-metrics.cols-4{grid-template-columns:1fr 1fr;}
  .cap{grid-template-columns:1fr;gap:8px;}
  .steps{grid-template-columns:1fr 1fr;}
  .step{border-right:none;border-bottom:1px solid var(--ash);padding-right:0;}
  .out-grid,.cta-grid{grid-template-columns:1fr;}
  .fgrid{grid-template-columns:1fr 1fr;}
  .cta-actions{flex-direction:row;flex-wrap:wrap;}
  .cs-meta{grid-template-columns:1fr 1fr;}
  .cs-metrics{grid-template-columns:1fr;}
  .cs-metric{border-right:none;border-bottom:1px solid var(--ash);padding-right:0;}
  .cs-metric:last-child{border-bottom:none;}
}
@media(max-width:760px){
  .hamburger{display:flex;flex-direction:column;gap:5px;cursor:pointer;padding:6px;}
  .hamburger span{width:24px;height:2px;background:var(--paper);display:block;}
  .menu{position:fixed;inset:60px 0 auto 0;flex-direction:column;align-items:flex-start;gap:0;background:var(--black);border-bottom:1px solid var(--ash);padding:8px var(--pad) 20px;transform:translateY(-160%);transition:transform .25s ease;}
  .menu a{padding:12px 0;width:100%;}
  .menu a.cta{width:auto;margin-top:8px;}
  .navtoggle:checked ~ .menu{transform:translateY(0);}
}
@media(max-width:520px){ .steps,.fgrid,.cs-meta,.cs-metrics.cols-4{grid-template-columns:1fr;} }

/* image zoom (lightbox) */
.cs-shot img{cursor:zoom-in;}
.cs-lightbox{position:fixed;inset:0;z-index:200;background:rgba(0,0,0,0.92);display:flex;align-items:center;justify-content:center;padding:24px;cursor:zoom-out;opacity:0;transition:opacity .15s;}
.cs-lightbox.open{opacity:1;}
.cs-lightbox img{max-width:96vw;max-height:92vh;object-fit:contain;box-shadow:0 12px 48px rgba(0,0,0,0.6);cursor:zoom-out;}
.cs-lightbox .x{position:fixed;top:16px;right:22px;font-family:var(--mono);font-size:24px;color:#fff;line-height:1;opacity:.85;cursor:pointer;}
.cs-lightbox .x:hover{opacity:1;}

/* work listing (the Receipts page) — distinct, separated cards */
.work-list{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;}
.work-list .case{border:1px solid var(--ash);background:var(--off);padding:32px;min-height:220px;border-radius:3px;transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease;}
.work-list .case .ck{color:var(--acid);}
.work-list .case h3{font-size:clamp(22px,2.6vw,26px);}
.work-list .case .foot{justify-content:flex-end;}
.work-list .case:hover{transform:translateY(-5px);border-color:var(--acid);box-shadow:0 18px 44px rgba(0,0,0,.5);}
.work-list .case:hover .arr{color:var(--acid);}
@media(max-width:760px){ .work-list{grid-template-columns:1fr;} }

/* card tech/service tags — prominent */
.case .tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px;}
.case .tags span{font-family:var(--mono);font-size:12px;font-weight:500;color:var(--paper);background:rgba(217,255,42,0.07);border:1px solid var(--acid);padding:5px 11px;border-radius:3px;letter-spacing:.02em;}


/* lovable → aws landing: hero primary button */
.hero-cta{margin-top:30px;}
.btn-primary{display:inline-block;font-family:var(--mono);font-size:14px;font-weight:500;background:var(--acid);color:var(--black);padding:14px 22px;border-radius:2px;transition:transform .12s ease;}
.btn-primary:hover{transform:translateY(-2px);color:var(--black);}

/* lovable → aws landing: service mapping table */
.maptable{border-top:1px solid var(--ash);margin-top:6px;}
.mhead{display:grid;grid-template-columns:1fr 1fr;gap:clamp(14px,3vw,36px);padding:14px 0 0;}
.mhead span{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--dim);}
.mhead span:last-child{color:var(--acid);}
.mrow{display:grid;grid-template-columns:1fr 1fr;gap:clamp(14px,3vw,36px);padding:20px 0;border-bottom:1px solid var(--ash);}
.mrow .svc{font-size:clamp(15px,1.8vw,17px);font-weight:500;letter-spacing:-0.01em;line-height:1.4;margin:0;}
.mrow .from .svc{color:rgba(244,242,239,0.82);}
.mrow .to .svc::before{content:"→ ";color:var(--acid);font-family:var(--mono);}
.mrow .note{grid-column:1 / -1;font-size:13.5px;color:rgba(244,242,239,0.7);line-height:1.6;margin:10px 0 0;max-width:920px;}
.mrow .note b{color:rgba(244,242,239,0.82);font-weight:600;}
.mrow .note code{font-family:var(--mono);font-size:0.9em;color:rgba(244,242,239,0.72);}

/* lovable → aws landing: sample timeline */
.timeline{border-top:1px solid var(--ash);margin-top:6px;}
.tphase{display:grid;grid-template-columns:150px 1fr;gap:clamp(16px,3vw,44px);padding:24px 0;border-bottom:1px solid var(--ash);}
.tphase .wk{font-family:var(--mono);font-size:13px;color:var(--acid);letter-spacing:.06em;padding-top:4px;}
.tphase h4{font-size:clamp(18px,2.1vw,22px);font-weight:500;letter-spacing:-0.02em;margin:0;}
.tphase p{font-size:15px;color:rgba(244,242,239,0.7);line-height:1.65;margin:10px 0 0;max-width:780px;}
.tnote{font-family:var(--mono);font-size:12px;color:var(--dim);margin:22px 0 0;letter-spacing:.02em;line-height:1.6;}

@media(max-width:760px){
  .mhead{display:none;}
  .mrow{grid-template-columns:1fr;gap:6px;}
  .tphase{grid-template-columns:1fr;gap:4px;}
  .tphase .wk{padding-top:0;}
}

/* contact form (subpage CTA sections) */
.cform{display:flex;flex-direction:column;gap:12px;width:100%;}
.cf-row{display:flex;gap:12px;flex-wrap:wrap;}
.cf-in{flex:1;min-width:150px;font-family:var(--mono);font-size:14px;color:var(--black);background:rgba(11,11,11,0.02);border:1px solid rgba(11,11,11,0.28);padding:13px 14px;border-radius:2px;}
.cf-in::placeholder{color:rgba(11,11,11,0.62);}
.cf-in:focus{outline:none;border-color:var(--black);background:#fff;}
.cf-sel{cursor:pointer;}
.cf-msg{width:100%;resize:vertical;min-height:104px;line-height:1.5;}
.cf-hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;}
.cf-foot{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:2px;}
.cf-send{font-family:var(--mono);font-size:14px;font-weight:500;background:var(--black);color:var(--paper);border:none;padding:14px 22px;cursor:pointer;border-radius:2px;transition:transform .12s ease,opacity .12s;}
.cf-send:hover{transform:translateY(-2px);}
.cf-send:disabled{opacity:0.5;cursor:default;transform:none;}
.cf-status{font-family:var(--mono);font-size:13px;color:rgba(11,11,11,0.7);}
.cf-status.ok{color:#0a7d33;}
.cf-status.err{color:#c0271a;}
.cf-fallback{font-family:var(--mono);font-size:12px;color:rgba(11,11,11,0.55);}
.cf-fallback a{text-decoration:underline;}


/* scroll reveal (opt-in: html.reveal-on added by reveal.js only when JS runs) */
html.reveal-on main .wrap > *{opacity:0;transform:translateY(26px);transition:opacity .7s cubic-bezier(.16,.7,.3,1),transform .7s cubic-bezier(.16,.7,.3,1);}
html.reveal-on main .wrap > *.in{opacity:1;transform:none;}
@media (prefers-reduced-motion:reduce){ html.reveal-on main .wrap > *{opacity:1!important;transform:none!important;transition:none!important;} }