/* ─────────────────────────────────────────────
   KXCO shared parchment design system
   Black ink on aged paper. Used by content pages
   (products, trust, audiences, corporate, developers).
   The homepage keeps its own inline styles for the
   engraved hero. Keep tokens in sync with index.html.
───────────────────────────────────────────── */

:root{
  /* paper */
  --bg:#E8DCBE;--bg2:#E3D6B4;--bg3:#DED0AA;--panel:#EFE6CC;
  /* ink: alphas set so small text clears 4.5:1 over the darkest mottled paper */
  --ink:#0B0A08;--ink2:rgba(11,10,8,.80);--ink3:rgba(11,10,8,.66);--ink4:rgba(11,10,8,.62);
  --border:rgba(11,10,8,.16);--border2:rgba(11,10,8,.28);
  /* accents all collapse to ink, aliases kept so no rule needs rewriting */
  --gold:#0B0A08;--gold2:#1A1712;--gold-d:rgba(11,10,8,.55);--gold-f:rgba(11,10,8,.06);
  --gold-bar:linear-gradient(to right,transparent 0%,rgba(11,10,8,.55) 18%,#0B0A08 50%,rgba(11,10,8,.55) 82%,transparent 100%);
  --teal:#0B0A08;--teal-br:#0B0A08;--teal-d:rgba(11,10,8,.14);--green:#0B0A08;
  --press:0 1px 0 rgba(255,252,240,.45),0 2px 8px -3px rgba(48,36,12,.30);
  --mono:'JetBrains Mono',monospace;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;background:var(--bg);}
body{background:var(--bg);color:var(--ink);font-family:'DM Sans',sans-serif;font-size:16px;line-height:1.72;-webkit-font-smoothing:antialiased;overflow-x:hidden;position:relative;}
/* paper: uneven tone across the sheet */
body::before{content:'';position:fixed;inset:0;z-index:0;pointer-events:none;mix-blend-mode:multiply;background:
  radial-gradient(1400px 900px at 78% 4%,rgba(150,120,62,.10),transparent 62%),
  radial-gradient(1100px 800px at 8% 88%,rgba(138,108,54,.10),transparent 64%),
  radial-gradient(900px 1200px at 46% 44%,rgba(160,132,74,.06),transparent 70%),
  radial-gradient(700px 500px at 96% 62%,rgba(126,98,48,.07),transparent 66%);}
/* paper: fibre grain */
body::after{content:'';position:fixed;inset:0;z-index:1;pointer-events:none;opacity:.055;mix-blend-mode:multiply;background-repeat:repeat;background-size:180px 180px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='f'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23f)'/%3E%3C/svg%3E");}
::selection{background:rgba(11,10,8,.20);color:#0B0A08;}
img{max-width:100%;}
/* the UA's blue underline is invisible on black but glaring on paper: reset it once */
a{color:inherit;text-decoration:none;}

/* ─── NAV ─── */
nav{position:fixed;top:0;left:0;right:0;z-index:200;height:72px;padding:0 2.6rem;display:flex;align-items:center;justify-content:space-between;gap:2rem;border-bottom:.5px solid transparent;transition:background .35s,border-color .35s,backdrop-filter .35s;}
nav.scrolled{background:rgba(232,220,190,.88);backdrop-filter:blur(20px) saturate(140%);-webkit-backdrop-filter:blur(20px) saturate(140%);border-color:var(--border);}
.n-logo{display:flex;align-items:center;gap:.7rem;text-decoration:none;flex-shrink:0;}
.n-logo .mark{width:38px;height:38px;border:1px solid rgba(11,10,8,.38);border-radius:7px;display:flex;align-items:center;justify-content:center;background:rgba(11,10,8,.05);overflow:hidden;}
.n-logo .mark img{width:30px;height:30px;display:block;border-radius:4px;}
.n-name{font-family:'Cormorant Garamond',serif;font-size:26px;font-weight:600;color:var(--gold);letter-spacing:.16em;}
.n-links{display:flex;align-items:center;gap:2.1rem;list-style:none;flex:1;justify-content:center;}
.n-links a{display:inline-flex;align-items:center;gap:.35rem;font-size:13.5px;color:var(--ink2);text-decoration:none;transition:color .2s;}
.n-links a:hover,.n-links a.active{color:var(--ink);}
/* dropdown submenu (Infrastructure) */
.n-links li{position:relative;}
.has-menu>a::after{content:'';width:5px;height:5px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:rotate(45deg) translateY(-1px);opacity:.6;transition:transform .25s;}
.has-menu:hover>a::after{transform:rotate(225deg) translateY(-1px);}
.submenu{position:absolute;top:calc(100% + 16px);left:50%;transform:translateX(-50%) scale(.97);transform-origin:top center;min-width:250px;background:rgba(239,230,204,.97);backdrop-filter:blur(20px) saturate(140%);-webkit-backdrop-filter:blur(20px) saturate(140%);border:.5px solid var(--border2);border-radius:10px;padding:.45rem;display:flex;flex-direction:column;opacity:0;visibility:hidden;transition:opacity .2s cubic-bezier(.23,1,.32,1),transform .2s cubic-bezier(.23,1,.32,1);box-shadow:0 18px 44px -20px rgba(48,36,12,.45);}
.submenu::before{content:'';position:absolute;top:-16px;left:0;right:0;height:16px;}
.has-menu:hover .submenu,.has-menu:focus-within .submenu{opacity:1;visibility:visible;transform:translateX(-50%) scale(1);}
.submenu a{padding:.6rem .85rem;border-radius:7px;font-size:13px;color:var(--ink2);display:flex;flex-direction:column;gap:1px;transition:background .18s,color .18s;}
.submenu a:hover{background:rgba(11,10,8,.09);color:var(--ink);}
.submenu a small{font-size:10.5px;color:var(--ink4);letter-spacing:.02em;}
@media(max-width:980px){.submenu{position:static;transform:none;opacity:1;visibility:visible;background:none;border:none;box-shadow:none;padding:.2rem 0 .2rem 1rem;min-width:0;}.has-menu>a::after{display:none;}}
.n-right{display:flex;align-items:center;gap:1.5rem;flex-shrink:0;}
.n-sep{width:1px;height:24px;background:var(--border2);}
.n-cta{display:flex;align-items:center;gap:.55rem;font-size:11px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:#EFE6CC;background:#0B0A08;border:.5px solid var(--gold);padding:.7rem 1.5rem;border-radius:4px;text-decoration:none;white-space:nowrap;transition:filter .2s,box-shadow .2s;}
.n-cta:hover{background:#241F16;box-shadow:0 2px 12px -4px rgba(48,36,12,.5);}
.n-burger{display:none;flex-direction:column;gap:4px;background:none;border:none;cursor:pointer;padding:6px;}
.n-burger span{width:22px;height:1.5px;background:var(--ink);display:block;}

/* ─── LAYOUT ─── */
.wrap{max-width:1280px;margin:0 auto;padding:0 4rem;position:relative;z-index:2;}
.wrap-sm{max-width:1000px;}
section{padding:6rem 0;border-top:.5px solid var(--border);position:relative;z-index:2;}
section.first{border-top:none;padding-top:9rem;}
.s-eye{display:inline-flex;align-items:center;gap:.65rem;font-size:11px;font-weight:500;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);margin-bottom:1rem;}
.s-eye::before{content:'';display:block;width:24px;height:1px;background:var(--gold-d);}
.s-title{font-family:'Cormorant Garamond',serif;font-size:clamp(32px,4.2vw,52px);font-weight:400;line-height:1.08;letter-spacing:-.018em;color:var(--ink);}
.s-title .au{color:inherit;}/* two-tone headings BANNED — .au must never recolour heading text */
.s-lead{font-size:16.5px;color:var(--ink2);max-width:640px;line-height:1.74;margin-top:1.2rem;}
.s-head{margin-bottom:3.2rem;max-width:780px;}
.g-rule{width:56px;height:2px;background:var(--gold-bar);margin:1.5rem 0;border:none;border-radius:1px;}
.prose p{font-size:15.5px;color:var(--ink2);line-height:1.78;max-width:680px;}
.prose p+p{margin-top:1.1rem;}

/* page hero (no animation) */
.phero{padding:9rem 0 4rem;position:relative;z-index:2;}
.phero h1{font-family:'Cormorant Garamond',serif;font-size:clamp(38px,5vw,68px);font-weight:500;line-height:1.04;letter-spacing:-.022em;color:var(--ink);margin-bottom:1.3rem;}
.phero h1 .au{color:inherit;}
.phero .lead{font-size:18px;color:var(--ink2);line-height:1.6;max-width:600px;margin-bottom:1.6rem;}
.phero .proof{font-size:13.5px;color:var(--ink3);line-height:1.55;max-width:560px;}

/* ─── BULLETS ─── */
.blist{list-style:none;display:flex;flex-direction:column;gap:.55rem;}
.blist li{font-size:13.5px;color:var(--ink2);line-height:1.55;padding-left:1.7rem;position:relative;}
.blist li::before{content:'';position:absolute;left:0;top:1px;width:15px;height:15px;border-radius:50%;border:1px solid rgba(11,10,8,.45);background:rgba(11,10,8,.08);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 15 15'%3E%3Cpath d='M4 7.6l2.2 2.2L11 5' stroke='%230B0A08' stroke-width='1.3' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");}
.blist li strong{color:var(--ink);font-weight:500;}

/* ─── BUTTONS ─── */
.btn-fill{display:inline-flex;align-items:center;gap:.6rem;font-size:12px;font-weight:500;letter-spacing:.11em;text-transform:uppercase;color:#EFE6CC;background:#0B0A08;padding:1.05rem 2rem;border-radius:4px;border:1px solid var(--gold);text-decoration:none;transition:filter .2s,box-shadow .25s;cursor:pointer;}
.btn-fill:hover{background:#241F16;box-shadow:0 3px 14px -5px rgba(48,36,12,.55);}
.btn-out{display:inline-flex;align-items:center;gap:.6rem;font-size:12px;font-weight:500;letter-spacing:.11em;text-transform:uppercase;color:var(--ink);background:transparent;padding:1.05rem 1.9rem;border:1px solid var(--border2);border-radius:4px;text-decoration:none;transition:border-color .2s,color .2s;}
.btn-out:hover{border-color:var(--gold-d);color:var(--gold2);}
.btn-sm{display:inline-flex;align-items:center;gap:.5rem;font-size:10.5px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--ink2);background:transparent;padding:.6rem 1.1rem;border:.5px solid var(--border2);border-radius:4px;text-decoration:none;white-space:nowrap;transition:border-color .2s,color .2s;}
.btn-sm:hover{border-color:var(--gold-d);color:var(--gold2);}
.acts{display:flex;gap:1rem;flex-wrap:wrap;align-items:center;}

/* ─── ISO TILE ─── */
.iso{position:relative;width:56px;height:56px;flex-shrink:0;border:1px solid rgba(11,10,8,.3);border-radius:10px;background:linear-gradient(145deg,rgba(255,250,235,.85),rgba(222,208,170,.7));display:flex;align-items:center;justify-content:center;color:var(--ink);box-shadow:0 6px 14px -10px rgba(48,36,12,.4),inset 0 0 18px rgba(11,10,8,.05);}

/* ─── PANEL / CARD ─── */
.panel{border:.5px solid var(--border);border-radius:10px;background:linear-gradient(160deg,rgba(255,250,235,.5),rgba(222,208,170,.4));}
.card-grid{display:grid;gap:1.1rem;}
.cols-2{grid-template-columns:repeat(2,1fr);}
.cols-3{grid-template-columns:repeat(3,1fr);}
.card{border:.5px solid var(--border);border-radius:10px;background:linear-gradient(160deg,rgba(255,250,235,.5),rgba(222,208,170,.4));padding:1.9rem 1.9rem;transition:border-color .25s,box-shadow .25s,transform .25s;}
a.card{text-decoration:none;display:flex;flex-direction:column;}
a.card:hover{border-color:rgba(11,10,8,.42);box-shadow:0 3px 16px -8px rgba(48,36,12,.3);transform:translateY(-2px);}
.card .c-ic{margin-bottom:1.1rem;}
.card .c-eye{font-size:10.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin-bottom:.5rem;}
.card .c-t{font-family:'Cormorant Garamond',serif;font-size:21px;font-weight:500;color:var(--ink);line-height:1.2;margin-bottom:.7rem;}
.card .c-d{font-size:13.5px;color:var(--ink2);line-height:1.6;}
.card .c-keys{font-size:11.5px;color:var(--ink3);line-height:1.5;border-top:.5px solid var(--border);padding-top:.95rem;margin-top:auto;}
.card .c-more{font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--teal);margin-top:1rem;display:inline-flex;gap:.4rem;}

/* ─── REVEAL ─── */
.rv{opacity:0;transform:translateY(20px);transition:opacity .8s,transform .8s;}
.rv.on{opacity:1;transform:none;}
.d1{transition-delay:.08s;}.d2{transition-delay:.17s;}.d3{transition-delay:.26s;}.d4{transition-delay:.35s;}

/* ─── CTA STRIP ─── */
.cta{border:.5px solid var(--border2);border-radius:10px;background:linear-gradient(135deg,rgba(255,250,235,.55),rgba(222,208,170,.45));padding:3.2rem;box-shadow:0 2px 14px -8px rgba(48,36,12,.28);display:flex;justify-content:space-between;align-items:center;gap:2.5rem;flex-wrap:wrap;}
.cta h2{font-family:'Cormorant Garamond',serif;font-size:clamp(28px,3.2vw,40px);font-weight:400;line-height:1.1;color:var(--ink);}
.cta h2 .au{color:inherit;}
.cta p{font-size:14.5px;color:var(--ink2);margin-top:.6rem;max-width:480px;}

/* ─── FOOTER ─── */
footer{padding:3.5rem 0 2.5rem;border-top:.5px solid var(--border);position:relative;z-index:2;}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:2.5rem;margin-bottom:2.5rem;}
.foot-col h4{font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin-bottom:1.1rem;}
.foot-col ul{list-style:none;display:flex;flex-direction:column;gap:.6rem;}
.foot-col a{font-size:13px;color:var(--ink3);text-decoration:none;transition:color .2s;}
.foot-col a:hover{color:var(--ink);}
.foot-brand .n-name{font-size:24px;}
.foot-brand p{font-size:12.5px;color:var(--ink3);line-height:1.6;margin-top:.9rem;max-width:280px;}
.foot-bar{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem;border-top:.5px solid var(--border);padding-top:1.6rem;}
.foot-c{font-size:12.5px;color:var(--ink3);}
.foot-mini{display:flex;gap:1.6rem;list-style:none;}
.foot-mini a{font-size:12px;color:var(--ink3);text-decoration:none;}
.foot-mini a:hover{color:var(--ink);}

/* ─── RESPONSIVE ─── */
@media(max-width:1080px){
  .cols-2,.cols-3{grid-template-columns:1fr;}
  .foot-grid{grid-template-columns:1fr 1fr;gap:2rem;}
}
@media(max-width:980px){
  nav{padding:0 1.4rem;}
  .n-links{position:fixed;top:72px;left:0;right:0;flex-direction:column;background:rgba(232,220,190,.98);backdrop-filter:blur(16px);padding:1.5rem 2rem;gap:1.3rem;border-bottom:.5px solid var(--border);display:none;}
  .n-links.open{display:flex;}
  .n-sep{display:none;}
  .n-burger{display:flex;}
  .wrap{padding:0 1.4rem;}
  section{padding:4.5rem 0;}
  .phero{padding:7rem 0 3rem;}
  .cta{padding:2rem;}
}
@media(max-width:560px){
  .foot-grid{grid-template-columns:1fr;}
  nav{gap:.6rem;}
  .n-right{gap:.8rem;}
  .n-cta{padding:.6rem 1rem;font-size:10px;letter-spacing:.08em;}
}