/* Page-scoped tokens and body styling. Scoping under body.industries-page so this CSS cannot leak onto the persistent Header/Footer or other routes when Next.js mounts/unmounts the stylesheet on client-side navigation. */ body.industries-page{ --teal:#0080a8; --teal-deep:#005d7a; --teal-soft:#e3f3f8; --orange:#f38020; --orange-soft:#fff1e1; --ink:#0e1f29; --ink-soft:#3b515c; --muted:#6b7d86; --line:#e3e8eb; --bg:#fbfcfc; --white:#ffffff; --paper:#f6f8f9; --warm:#fff8ee; font-family:var(--font-sans), 'Inter', system-ui, sans-serif; color:var(--ink); background:var(--bg); line-height:1.55; -webkit-font-smoothing:antialiased; } /* (removed) global * / html / a resets — handled by public/styles.css */ /* (removed) .nav / .nav-inner / .logo / .nav-links / .nav-cta — these legacy classes collide with the persistent Header in src/components/layout/Header.tsx which uses .nav, .nav__inner, .nav__link instead. The consumer page renders the shared
; it never used these rules. */ /* All rules below are scoped under body.industries-page (CSS nesting). Without this scope, generic class names like .hero, .btn-primary, .section, .case, .label leak onto the persistent Header and onto other routes after client-side navigation, because React 19 keeps precedence="default" stylesheets attached to after the page unmounts. The home hero ends up with max-width:1280px + margin:0 auto side gutters, and .btn-primary flips from amber to var(--ink). */ body.industries-page { .crumb{max-width:1280px;margin:0 auto;padding:24px 32px 0;font-family:var(--mono);font-size:12px;color:var(--muted);letter-spacing:.04em} .crumb a:hover{color:var(--teal)} .crumb .sep{margin:0 10px;opacity:.5} /* HERO — agentic graph ornament */ .hero{position:relative;max-width:1280px;margin:0 auto;padding:130px 32px 80px;overflow:hidden} .hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:60px;align-items:center;position:relative;z-index:2} .hero-tag{font-family:var(--mono);font-size:12px;letter-spacing:.18em;color:var(--orange);text-transform:uppercase;margin-bottom:28px;display:flex;align-items:center;gap:12px} .hero-tag::before{content:'';width:36px;height:1px;background:var(--orange)} .hero h1{font-family:var(--serif);font-weight:400;font-size:60px;line-height:1.05;letter-spacing:-.025em;margin-bottom:32px;color:var(--ink)} .hero h1 em{font-style:italic;color:var(--teal);font-weight:400} .hero h1 .underline{position:relative;display:inline-block} .hero h1 .underline::after{content:'';position:absolute;left:0;right:0;bottom:.05em;height:.25em;background:var(--orange-soft);z-index:-1} .hero-lede{font-size:19px;line-height:1.55;color:var(--ink-soft);max-width:560px;margin-bottom:36px} .hero-cta{display:flex;gap:16px;align-items:center} .btn{padding:15px 30px;border-radius:999px;font-weight:600;font-size:14px;transition:transform .2s, box-shadow .2s;display:inline-flex;align-items:center;gap:10px;cursor:pointer;border:none} .btn-primary{background:var(--ink);color:var(--white)} .btn.btn-primary{background:#ED8E39 !important;color:#fff !important} .btn-primary:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(14,31,41,.18)} .btn-ghost{color:var(--ink);border:1.5px solid var(--line);background:var(--white)} .btn-ghost:hover{border-color:var(--ink)} /* hero ornament — agentic node graph */ .hero-art{position:relative;height:480px} .agent-card{position:absolute;inset:0;border:1.5px solid var(--ink);border-radius:8px;overflow:hidden;background:linear-gradient(140deg, var(--warm), var(--white) 50%, var(--paper))} .agent-card svg{width:100%;height:100%} .node{position:absolute;background:var(--white);border:1.5px solid var(--ink);border-radius:8px;padding:8px 12px;font-family:var(--mono);font-size:10px;letter-spacing:.06em;color:var(--ink);box-shadow:0 4px 14px rgba(14,31,41,.06)} .node.user{top:20%;left:10%;background:var(--ink);color:var(--white);border-color:var(--ink)} .node.planner{top:18%;left:42%;border-color:var(--orange);color:var(--orange)} .node.rag{top:48%;left:14%;border-color:var(--teal);color:var(--teal)} .node.tool1{top:50%;left:48%;border-color:var(--teal);color:var(--teal)} .node.tool2{top:74%;left:30%;background:var(--orange);color:var(--white);border-color:var(--orange)} .node.out{top:42%;left:74%;background:var(--teal);color:var(--white);border-color:var(--teal-deep)} .agent-seal{position:absolute;top:24px;right:24px;font-family:var(--serif);font-style:italic;font-size:13px;color:var(--ink-soft)} .agent-stamp{position:absolute;bottom:24px;right:24px;font-family:var(--mono);font-size:10px;color:var(--muted);letter-spacing:.18em;border:1px solid var(--line);padding:8px 14px;border-radius:4px;background:var(--white)} .pulse{position:absolute;width:8px;height:8px;background:var(--orange);border-radius:50%;box-shadow:0 0 0 4px rgba(243,128,32,.18);animation:travelpulse 4s ease-in-out infinite} @keyframes travelpulse{ 0%{top:24%;left:18%;opacity:1} 25%{top:22%;left:46%;background:var(--orange)} 50%{top:52%;left:52%;background:var(--teal);box-shadow:0 0 0 4px rgba(0,128,168,.18)} 75%{top:46%;left:78%;background:var(--teal)} 100%{top:24%;left:18%;opacity:0} } /* sections */ .section{padding:76px 0;position:relative} .section-inner{max-width:1280px;margin:0 auto;padding:0 32px} .section-tag{font-family:var(--mono);font-size:12px;letter-spacing:.16em;color:var(--orange);text-transform:uppercase;margin-bottom:12px} .section-title{font-family:var(--serif);font-weight:400;font-size:clamp(32px,3.8vw,52px);line-height:1.05;letter-spacing:-.02em;margin-bottom:14px;max-width:880px} .section-title em{font-style:italic;color:var(--teal)} .section-lede{font-size:18px;color:var(--ink-soft);max-width:680px;margin-bottom:40px;line-height:1.55} /* shift */ .shift-section{background:var(--paper);border-top:1px solid var(--line);border-bottom:1px solid var(--line)} .shift-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:start} .shift-col h3{font-family:var(--serif);font-style:italic;font-weight:500;font-size:24px;margin-bottom:24px} .shift-col h3.before{color:var(--muted)} .shift-col h3.now{color:var(--teal)} .shift-list{list-style:none} .shift-list li{padding:18px 0;border-bottom:1px solid var(--line);color:var(--ink-soft);font-size:16px;line-height:1.55;display:flex;gap:16px;align-items:flex-start} .shift-list li:last-child{border-bottom:none} .shift-list .num{font-family:var(--mono);font-size:11px;color:var(--muted);min-width:24px;padding-top:4px} .shift-col.now .shift-list li{color:var(--ink)} /* use cases */ .uc-grid{display:grid;grid-template-columns:repeat(3, 1fr);gap:24px} .uc{background:var(--white);border:1px solid var(--line);border-radius:14px;padding:32px;transition:transform .25s, box-shadow .25s, border-color .25s;display:flex;flex-direction:column} .uc:hover{transform:translateY(-4px);border-color:var(--teal);box-shadow:0 18px 40px rgba(0,128,168,.08)} .uc-tag{font-family:var(--mono);font-size:11px;letter-spacing:.12em;color:var(--orange);text-transform:uppercase;margin-bottom:18px} .uc h4{font-family:var(--serif);font-weight:500;font-size:23px;line-height:1.2;letter-spacing:-.01em;margin-bottom:14px;color:var(--ink)} .uc p{color:var(--ink-soft);font-size:15px;line-height:1.55;margin-bottom:24px;flex-grow:1} .uc-impact{display:flex;gap:18px;padding-top:20px;border-top:1px solid var(--line)} .uc-impact .item{flex:1} .uc-impact .v{font-family:var(--serif);font-weight:500;font-size:22px;color:var(--teal);letter-spacing:-.01em} .uc-impact .l{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;margin-top:4px} /* cases */ .proof-section{background:linear-gradient(180deg, var(--white), var(--warm))} .cases{display:grid;grid-template-columns:repeat(3, 1fr);gap:24px} .case{background:var(--white);border:1px solid var(--line);border-radius:16px;padding:36px;position:relative;overflow:hidden;transition:transform .25s, box-shadow .25s} .case:hover{transform:translateY(-4px);box-shadow:0 20px 44px rgba(14,31,41,.08)} .case::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg, var(--orange), var(--teal))} .case-co{font-family:var(--serif);font-weight:600;font-size:24px;letter-spacing:-.01em;color:var(--ink);margin-bottom:6px} .case h4{font-family:var(--serif);font-style:italic;font-weight:400;font-size:18px;color:var(--teal-deep);margin-bottom:14px;line-height:1.3} .sector{font-family:var(--mono);font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.1em;margin-bottom:20px;padding-bottom:20px;border-bottom:1px dashed var(--line)} .label{font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--orange);margin-top:16px;margin-bottom:8px} .case p{font-size:14.5px;color:var(--ink-soft);line-height:1.55} .impact{margin-top:20px;padding:16px;background:var(--orange-soft);border-radius:10px;font-size:14px;color:var(--ink);line-height:1.5} .impact strong{color:#a04500} /* differentiators */ .dl-row{display:grid;grid-template-columns:1.3fr 1fr;gap:60px;align-items:start} .dl-list{list-style:none} .dl-list li{display:flex;gap:20px;padding:24px 0;border-bottom:1px solid var(--line)} .dl-list li:last-child{border-bottom:none} .ck{flex-shrink:0;width:32px;height:32px;border-radius:50%;background:var(--teal);color:var(--white);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px} .dl-list h5{font-family:var(--serif);font-weight:500;font-size:19px;margin-bottom:6px;color:var(--ink)} .dl-list p{color:var(--ink-soft);font-size:15px;line-height:1.55} .pull-quote{background:linear-gradient(135deg, var(--warm), var(--white));border-radius:20px;padding:40px;border:1px solid var(--line);position:sticky;top:100px} .pull-quote .q{font-family:var(--serif);font-style:italic;font-size:24px;line-height:1.4;color:var(--ink);margin-bottom:24px} .pull-quote .who{font-size:13px;color:var(--ink-soft);font-weight:500} .pull-quote .role{font-family:var(--mono);font-size:11px;color:var(--muted);letter-spacing:.08em;margin-top:4px} /* CTA */ .cta-section{background:var(--paper);color:var(--ink);padding:100px 0} .cta-inner{max-width:1280px;margin:0 auto;padding:0 32px;display:grid;grid-template-columns:1.4fr 1fr;gap:60px;align-items:center} .cta-section h2{font-family:var(--serif);font-weight:400;font-size:clamp(32px,3.6vw,48px);line-height:1.05;letter-spacing:-.02em;color:var(--ink)} .cta-section h2 em{color:var(--orange);font-style:italic} .cta-section p{color:var(--ink-soft);font-size:17px;margin-top:20px;line-height:1.55;max-width:480px} .cta-actions{display:flex;flex-direction:column;gap:14px;align-items:flex-start} .cta-actions .btn{width:100%;justify-content:center;padding:18px 30px} .cta-actions .btn-primary{background:#ED8E39 !important;color:#fff !important} .cta-actions .btn-ghost{background:transparent;color:var(--ink);border-color:var(--line)} .cta-actions .btn-ghost:hover{border-color:var(--ink)} /* (removed) raw "footer { ... }" — collides with the persistent