

body .ix-hero{display:grid;grid-template-columns:1.05fr 1fr;gap:3rem;align-items:center;padding-block:4rem}
body .ix-hero h1{font-size:clamp(3rem,6vw,5.3rem);line-height:1.05;margin:1rem 0 1.5rem}
body .ix-hero p{line-height:1.8;max-width:48ch}
.ix-art{background:var(--surface-raised);padding:1rem;border:1px solid var(--border-subtle);margin:0}
.ix-art img{display:block;width:100%;height:auto}
.ix-art figcaption{font-size:.85rem;color:var(--text-secondary);text-align:center;padding:.5rem}
.ix-prototype{background:linear-gradient(145deg,color-mix(in srgb,var(--ids-periwinkle) 48%,white),color-mix(in srgb,var(--ids-celadon) 44%,white));padding-block:4rem;text-align:center}
body .ix-prototype h2{font-size:clamp(2.4rem,4vw,3.6rem);margin:.5rem 0 1.5rem}
body .ix-prototype p{max-width:65ch;margin:1rem auto;line-height:1.8}
.ix-gallery{display:grid;grid-template-columns:1fr 1fr;gap:2rem;margin-block:2rem}
.ix-gallery figure{margin:0;background:var(--surface-raised);border:1px solid var(--border-subtle)}
.ix-gallery img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:contain}
.ix-gallery figcaption{font-size:.85rem;padding:1rem;color:var(--text-secondary)}
.ix-credits{padding:1.5rem;border-block:1px solid var(--border-strong);margin:2rem 0}
.ix-credits p{font-size:1.05rem}
body .ix-prototype .ix-disclosure{font-size:.9rem;color:var(--text-secondary)}



@media(max-width:760px){body .ix-hero{grid-template-columns:1fr;gap:2rem;padding-block:2.5rem;text-align:center}body .ix-hero p{margin-inline:auto}.ix-gallery{grid-template-columns:1fr}}

.ix-mission{background:linear-gradient(135deg,var(--ids-periwinkle),var(--ids-celadon));padding-block:4rem;text-align:center}
body .ix-mission h2{font-size:clamp(2.1rem,4vw,3.3rem);line-height:1.2;max-width:22ch;margin:1rem auto 1.5rem}
body .ix-mission p{line-height:1.8;max-width:65ch;margin:1rem auto}
.ix-qr{display:grid;grid-template-columns:1fr 18rem;gap:3rem;align-items:center;text-align:left;border-block:1px solid var(--border-strong);padding:2rem 0;margin:2rem 0}
body .ix-qr h3{font-size:2.2rem;line-height:1.15;margin:1rem 0}
.ix-qr figure{margin:0;text-align:center}
.ix-qr img{width:100%;height:auto;display:block;background:white}
.ix-qr figcaption{font-size:.85rem;padding:.75rem}
.ix-qr .qr-link{display:block;overflow-wrap:anywhere;min-height:44px;padding:.6rem 0}
.ix-qr .qr-downloads{display:flex;flex-wrap:wrap;gap:1rem}
.ix-qr .qr-downloads a{min-height:44px;display:inline-flex;align-items:center}
@media(max-width:760px){.ix-qr{grid-template-columns:1fr;text-align:center;gap:1.5rem}.ix-qr figure{max-width:18rem;margin:auto}.ix-qr .qr-downloads{justify-content:center}}

/* Founder-approved direction: homepage blue/mint atmosphere, without the
   retired burgundy/tan palette. Overrides are confined to Ingress Express pages. */
body.ing-public.ing-ingress-express main,
body.ing-public.ing-ingress-express .express-intro {
 --surface-primary:#ffffff;
 --surface-raised:#ffffff;
 --surface-soft:var(--ids-celadon);
 --surface-accent:var(--ids-periwinkle);
 --surface-inverse:var(--ids-cobalt);
 --interactive-primary:var(--ids-cobalt);
 --interactive-subtle:var(--ids-cobalt);
 --interactive-hover:color-mix(in srgb,var(--ids-cobalt) 78%,#000);
 --focus-ring:var(--ids-cobalt);
 --text-primary:#182b3d;
 --text-secondary:#384858;
 --border-subtle:rgba(49,94,168,.22);
 --border-strong:rgba(49,94,168,.55);
}
body .ix-hero h1 em{color:var(--ids-cobalt);font-weight:500}
body ::selection{background:var(--ids-cobalt);color:#fff}



/* Ethereal, whimsical, professional luxury. No motion is required to read. */
body .ix-hero{position:relative;padding-block:5rem;gap:4rem}
.ix-art{position:relative;isolation:isolate;background:radial-gradient(ellipse at 62% 30%,#ffffff 20%,color-mix(in srgb,var(--ids-periwinkle) 34%,white) 66%,color-mix(in srgb,var(--ids-celadon) 30%,white));border:1px solid rgba(49,94,168,.16);border-radius:48% 48% 1.5rem 1.5rem;padding:2.25rem 1.25rem 1.25rem;box-shadow:0 26px 65px -45px rgba(49,94,168,.5)}
.ix-art::before{content:"";position:absolute;inset:-1rem;border:1px solid rgba(49,94,168,.13);border-radius:inherit;z-index:-1;pointer-events:none}
.ix-art::after{content:"";position:absolute;inset:1.25rem;border:1px solid rgba(49,94,168,.08);border-radius:46% 46% .7rem .7rem;pointer-events:none}
.ix-sparkles{position:absolute;inset:0;pointer-events:none;color:var(--ids-cobalt);font-family:Georgia,serif}
.ix-sparkles span{position:absolute;font-size:1.3rem}
.ix-sparkles span:nth-child(1){top:17%;left:11%}
.ix-sparkles span:nth-child(2){top:34%;right:8%;font-size:.8rem}
.ix-sparkles span:nth-child(3){bottom:23%;left:8%;font-size:.8rem}
body .ix-hero h1{letter-spacing:-.03em;font-weight:500}
body .ix-hero h1 em{font-weight:500}
body .ing-eyebrow{letter-spacing:.18em}
.ix-prototype{background:linear-gradient(160deg,color-mix(in srgb,var(--ids-periwinkle) 45%,white),#ffffff 48%,color-mix(in srgb,var(--ids-celadon) 30%,white));padding-block:5rem}
.ix-mission{background:radial-gradient(ellipse at 18% 50%,color-mix(in srgb,var(--ids-celadon) 68%,white),transparent 70%),linear-gradient(135deg,color-mix(in srgb,var(--ids-periwinkle) 75%,white),white);border-block:1px solid rgba(49,94,168,.12);padding-block:5rem}
.ix-gallery{gap:2.5rem;margin-block:3rem}
.ix-gallery figure{background:linear-gradient(150deg,#ffffff,color-mix(in srgb,var(--ids-periwinkle) 22%,white));border-radius:1rem;overflow:hidden;border-color:rgba(49,94,168,.15);box-shadow:0 18px 45px -36px rgba(49,94,168,.4)}
.ix-qr{padding-block:3rem;margin-block:3rem}
.ix-qr figure{background:#ffffff;border:1px solid rgba(49,94,168,.15);padding:.5rem}
.ix-qr figcaption{color:var(--text-secondary)}
@media(max-width:760px){body .ix-hero{padding-block:3rem;gap:3rem}.ix-art{margin:0 .5rem}.ix-gallery{gap:1.5rem}.ix-mission,.ix-prototype{padding-block:3.5rem}}
@media(forced-colors:active){.ix-art::before,.ix-art::after,.ix-sparkles{display:none}.ix-art,.ix-gallery figure,.ix-qr figure{border:1px solid CanvasText}}

body.ing-ingress-express {color:#182b3d;background:radial-gradient(circle at 8% 12%,color-mix(in srgb,var(--ids-celadon) 62%,transparent),transparent 25rem),radial-gradient(circle at 92% 30%,color-mix(in srgb,var(--ids-periwinkle) 78%,transparent),transparent 30rem),#ffffff;}
body.ing-ingress-express main a{text-decoration-color:var(--ids-cobalt);}
body.ing-ingress-express main :is(a,button,summary):focus-visible{outline:3px solid var(--focus-ring);outline-offset:4px;}
/* Keep the decorative halo within its reserved margin when text is enlarged. */
.ix-art::before { inset:-.5rem; }
