/* ============================================================ Data Layer — Enterprise DaaS · "Lumen" light premium system Brand: navy #0f2c54 · teal #14a89a · electric-blue energy Fonts loaded via in for faster, non-blocking fetch. ============================================================ */ :root{ /* ink / neutrals — cool, airy */ --navy:#0f2c54; --navy-700:#1b3c69; --ink:#142a47; --slate:#52688a; --slate-2:#7588a4; --line:#e6ecf4; --line-2:#eef2f8; --paper:#ffffff; --mist:#f5f8fc; --mist-2:#eef3fa; /* accents */ --teal:#13a89a; --teal-600:#0f9488; --teal-bright:#18c2b0; --blue:#2f63ff; /* electric blue energy */ --blue-bright:#4d8bff; --grad: linear-gradient(100deg,#13a89a 0%, #1aa0c4 42%, #2f63ff 100%); --grad-soft: linear-gradient(120deg,#e9fbf7 0%, #eef4ff 100%); --shadow-sm: 0 1px 2px rgba(15,44,84,.05), 0 2px 8px rgba(15,44,84,.04); --shadow: 0 8px 30px rgba(15,44,84,.08), 0 2px 8px rgba(15,44,84,.04); --shadow-lg: 0 30px 70px -28px rgba(15,44,84,.30), 0 8px 24px rgba(15,44,84,.06); --r-sm:10px; --r:16px; --r-lg:22px; --r-xl:30px; --maxw:1200px; --ease:cubic-bezier(.22,.61,.36,1); } *{box-sizing:border-box} html{scroll-behavior:smooth} html,body{overflow-x:clip} body{ margin:0; font-family:'Hanken Grotesk',system-ui,sans-serif; color:var(--ink); background:var(--paper); font-size:17px; line-height:1.6; -webkit-font-smoothing:antialiased; letter-spacing:-.01em; } h1,h2,h3,h4{font-family:'Plus Jakarta Sans',sans-serif;color:var(--navy);margin:0;line-height:1.08;letter-spacing:-.025em;font-weight:700;} p{margin:0} a{color:inherit;text-decoration:none} img{max-width:100%;display:block} .wrap{max-width:var(--maxw);margin:0 auto;padding:0 32px} .sect{padding:104px 0} .sect-tight{padding:72px 0} /* ---------- helpers ---------- */ .eyebrow{ display:inline-flex;align-items:center;gap:9px; font-family:'Plus Jakarta Sans',sans-serif;font-weight:600;font-size:12.5px; letter-spacing:.16em;text-transform:uppercase;color:var(--teal-600); } .eyebrow::before{content:"";width:22px;height:1.5px;background:var(--teal);border-radius:2px} .eyebrow.center::before{display:none} .lead{color:var(--slate);font-size:19px;line-height:1.62;font-weight:450} .muted{color:var(--slate)} .tealtx{color:var(--teal-600)} .grad-tx{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent} .center{text-align:center} .mx-auto{margin-left:auto;margin-right:auto} .maxw-720{max-width:720px} .maxw-820{max-width:820px} h2.h{font-size:clamp(30px,3.6vw,46px);letter-spacing:-.03em} h2.h .grad-tx{letter-spacing:-.03em} .sect-head{max-width:760px;margin-bottom:52px} .sect-head.center{margin-left:auto;margin-right:auto} .sect-head .eyebrow{margin-bottom:18px} .sect-head p{margin-top:18px} /* ---------- buttons ---------- */ .btn{ display:inline-flex;align-items:center;justify-content:center;gap:9px; font-family:'Plus Jakarta Sans',sans-serif;font-weight:600;font-size:15.5px; padding:14px 24px;border-radius:12px;cursor:pointer;border:1px solid transparent; transition:transform .25s var(--ease), box-shadow .25s var(--ease), background .25s, color .25s; white-space:nowrap; } .btn svg{width:17px;height:17px} .btn-primary{background:var(--navy);color:#fff;box-shadow:0 10px 24px -10px rgba(15,44,84,.6)} .btn-primary:hover{transform:translateY(-2px);box-shadow:0 18px 34px -12px rgba(15,44,84,.6)} .btn-grad{background:var(--grad);color:#fff;box-shadow:0 12px 28px -10px rgba(47,99,255,.55)} .btn-grad:hover{transform:translateY(-2px);box-shadow:0 20px 40px -12px rgba(47,99,255,.55)} .btn-ghost{background:#fff;color:var(--navy);border-color:var(--line)} .btn-ghost:hover{border-color:var(--teal);color:var(--teal-600);transform:translateY(-2px)} .btn-light{background:rgba(255,255,255,.12);color:#fff;border-color:rgba(255,255,255,.24);backdrop-filter:blur(6px)} .btn-light:hover{background:rgba(255,255,255,.2);transform:translateY(-2px)} .btn-sm{padding:11px 16px;font-size:14.5px} .nav-cta .btn-sm{padding:10px 15px;font-size:14px} /* ============================================================ NAV ============================================================ */ .nav{ position:sticky;top:0;z-index:60; background:rgba(255,255,255,.78);backdrop-filter:saturate(160%) blur(16px); border-bottom:1px solid transparent;transition:border-color .3s, box-shadow .3s; } .nav.scrolled{border-color:var(--line);box-shadow:0 1px 0 rgba(15,44,84,.03),0 8px 30px -20px rgba(15,44,84,.25)} .nav-in{display:flex;align-items:center;gap:16px;height:74px} .nav-links{display:flex;align-items:center;gap:2px;margin-left:2px;flex:none} .nav-links a{ font-family:'Plus Jakarta Sans',sans-serif;font-weight:500;font-size:14px;color:var(--slate); padding:8px 10px;border-radius:9px;transition:color .2s,background .2s;letter-spacing:-.012em;white-space:nowrap; } .nav-links a:hover{color:var(--navy);background:var(--mist)} .nav-cta{margin-left:auto;display:flex;align-items:center;gap:9px;flex:none} .nav-burger{display:none;margin-left:auto;width:42px;height:42px;border-radius:11px;border:1px solid var(--line);background:#fff;cursor:pointer;align-items:center;justify-content:center} .nav-burger span{display:block;width:18px;height:2px;background:var(--navy);position:relative} .nav-burger span::before,.nav-burger span::after{content:"";position:absolute;left:0;width:18px;height:2px;background:var(--navy)} .nav-burger span::before{top:-6px}.nav-burger span::after{top:6px} /* ---------- brand lockup (split icon + wordmark) ---------- */ .brand{display:flex;align-items:center;gap:10px;flex:none} .brand-icon{height:34px;width:auto;max-width:none;display:block;flex:none} .brand-wm{font-family:'Quicksand',sans-serif;font-weight:700;font-size:23px;line-height:1;letter-spacing:-.012em;white-space:nowrap} .brand-wm .b-data{color:var(--navy)} .brand-wm .b-layer{color:var(--teal)} .foot .brand-icon{height:38px} .foot .brand-wm{font-size:25px} .foot .brand-wm .b-data{color:#fff}.foot .brand-wm .b-layer{color:var(--teal-bright)} .brand-logo{height:33px;width:auto;max-width:none;display:block;flex:none} .nav-plat{display:inline-flex;align-items:center;gap:8px} .nav-plat svg{width:16px;height:16px} /* ---------- top utility bar ---------- */ .topbar{background:var(--navy);color:#c4d2e8} .topbar-in{display:flex;align-items:center;justify-content:space-between;height:40px;font-size:13px} .topbar .tb-left{display:inline-flex;align-items:center;gap:9px;font-weight:500;letter-spacing:-.01em;white-space:nowrap;min-width:0} .topbar .tb-left .tdotk{width:6px;height:6px;border-radius:50%;background:var(--teal-bright);box-shadow:0 0 0 0 rgba(24,194,176,.5);animation:pulse 2.4s infinite;flex:none} .topbar .tb-left b{color:#fff;font-weight:600} .topbar .tb-left .tb-tail{color:#9fb2cf} .topbar .tb-right-note{font-family:'Plus Jakarta Sans',sans-serif;font-size:12.5px;font-weight:500;letter-spacing:.04em;color:#8fa3c4;text-transform:uppercase} @media (max-width:680px){ .topbar .tb-right-note{display:none} } .topbar .tb-right{display:inline-flex;align-items:center;gap:4px} .topbar .tb-right a{color:#aebfd8;padding:6px 11px;border-radius:7px;font-weight:500;font-family:'Plus Jakarta Sans',sans-serif;font-size:13px;transition:color .2s,background .2s;display:inline-flex;align-items:center;gap:7px} .topbar .tb-right a:hover{color:#fff;background:rgba(255,255,255,.07)} .topbar .tb-right a svg{width:14px;height:14px;color:var(--teal-bright)} .topbar .tb-sep{width:1px;height:15px;background:rgba(255,255,255,.14);margin:0 4px} @media (max-width:980px){ .topbar .tb-left .tb-tail{display:none} } @media (max-width:820px){ .topbar .tb-right .tb-hide{display:none} .topbar-in{font-size:12px} } /* compare: Sin / Con Data Layer */ .compare{display:grid;grid-template-columns:1fr 1fr;gap:16px} .cmp{border-radius:var(--r-lg);padding:26px;border:1px solid var(--line)} .cmp.sin{background:#fff} .cmp.con{background:linear-gradient(165deg,#11305c,#0f2c54);border-color:#11305c;color:#fff} .cmp .cmp-h{font-family:'Plus Jakarta Sans',sans-serif;font-weight:700;font-size:13px;letter-spacing:.04em;text-transform:uppercase;margin-bottom:18px;display:flex;align-items:center;gap:9px} .cmp.sin .cmp-h{color:var(--slate-2)} .cmp.con .cmp-h{color:var(--teal-bright)} .cmp ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:13px} .cmp li{display:flex;gap:11px;align-items:flex-start;font-size:14.5px;font-weight:500;line-height:1.42} .cmp.sin li{color:var(--slate)} .cmp.con li{color:#e1e9f5} .cmp li svg{width:18px;height:18px;flex:none;margin-top:1px} .cmp.sin li svg{color:#c2cedd} .cmp.con li svg{color:var(--teal-bright)} .brand{display:flex;align-items:center;gap:11px;flex:none} .brand-ico{width:38px;height:38px;flex:none} .brand-word{font-family:'Quicksand',sans-serif;font-weight:700;font-size:25px;letter-spacing:-.01em;line-height:1} .brand-word .b-data{color:var(--navy)} .brand-word .b-layer{color:var(--teal)} /* ============================================================ HERO ============================================================ */ .hero{position:relative;overflow:hidden;padding:60px 0 40px} .hero::before{ content:"";position:absolute;inset:0;z-index:-2; background: radial-gradient(800px 460px at 78% -8%, rgba(47,99,255,.10), transparent 60%), radial-gradient(700px 420px at 10% 4%, rgba(19,168,154,.12), transparent 58%); } .hero-grid-bg{position:absolute;inset:0;z-index:-1; background-image:linear-gradient(var(--line-2) 1px,transparent 1px),linear-gradient(90deg,var(--line-2) 1px,transparent 1px); background-size:54px 54px;-webkit-mask-image:radial-gradient(900px 520px at 50% 0%,#000,transparent 78%);mask-image:radial-gradient(900px 520px at 50% 0%,#000,transparent 78%);opacity:.55} .hero-in{max-width:920px;margin:0 auto;text-align:center;padding-top:24px} .pill{ display:inline-flex;align-items:center;gap:9px;background:#fff;border:1px solid var(--line); padding:7px 8px 7px 7px;border-radius:100px;font-size:13.5px;font-weight:500;color:var(--slate);box-shadow:var(--shadow-sm); } .pill b{font-family:'Plus Jakarta Sans',sans-serif;font-weight:600;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:#fff;background:var(--grad);padding:4px 9px;border-radius:100px} .hero h1{font-size:clamp(38px,6.0vw,72px);font-weight:800;letter-spacing:-.04em;margin:26px auto 0;max-width:14ch} .hero-sub{margin:24px auto 0;max-width:670px;font-size:20px;color:var(--slate);font-weight:450;line-height:1.55} .hero-ctas{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:34px} .hero-mini{margin-top:18px;font-size:13.5px;color:var(--slate-2);display:flex;gap:18px;justify-content:center;flex-wrap:wrap} .hero-mini span{display:inline-flex;align-items:center;gap:7px} .dotk{width:6px;height:6px;border-radius:50%;background:var(--teal)} /* trust badges row */ .badges{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:40px} .badge{ display:inline-flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--line); padding:9px 15px;border-radius:100px;font-size:13.5px;font-weight:500;color:var(--navy-700);box-shadow:var(--shadow-sm); } .badge svg{width:15px;height:15px;color:var(--teal)} /* ============================================================ DIAGRAM 1 — Fuentes → Data Layer → Europa → Resultados ============================================================ */ .flow{ position:relative;margin-top:64px;background:#fff;border:1px solid var(--line);border-radius:var(--r-xl); box-shadow:var(--shadow-lg);overflow:hidden; } .flow-top{display:flex;align-items:center;gap:10px;padding:15px 22px;border-bottom:1px solid var(--line);background:var(--mist)} .flow-top .tdot{width:10px;height:10px;border-radius:50%;background:#dfe6f0} .flow-top .tdot.g{background:#37c98e}.flow-top .tdot.y{background:#f4c150}.flow-top .tdot.r{background:#f1788a} .flow-top .ttl{margin-left:8px;font-family:'Plus Jakarta Sans',sans-serif;font-size:13px;font-weight:600;color:var(--slate);letter-spacing:.02em} .flow-top .live{margin-left:auto;display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:600;color:var(--teal-600);font-family:'Plus Jakarta Sans',sans-serif} .flow-top .live .lv{width:7px;height:7px;border-radius:50%;background:var(--teal);box-shadow:0 0 0 0 rgba(19,168,154,.5);animation:pulse 2s infinite} @keyframes pulse{0%{box-shadow:0 0 0 0 rgba(19,168,154,.45)}70%{box-shadow:0 0 0 8px rgba(19,168,154,0)}100%{box-shadow:0 0 0 0 rgba(19,168,154,0)}} .flow-stage{display:grid;grid-template-columns:1fr auto 1.18fr auto 1fr;gap:0;align-items:stretch;padding:34px 12px} .flow-col{padding:8px 18px} .flow-col .col-h{font-family:'Plus Jakarta Sans',sans-serif;font-size:11.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--slate-2);text-align:center;margin-bottom:18px} .chips{display:flex;flex-direction:column;gap:9px} .chip{ display:flex;align-items:center;gap:11px;background:#fff;border:1px solid var(--line);border-radius:12px; padding:9px 13px;font-size:13.5px;font-weight:500;color:var(--navy-700);box-shadow:var(--shadow-sm); opacity:0;transform:translateX(-8px);animation:chipin .5s var(--ease) forwards; } .chip .ci{width:26px;height:26px;border-radius:8px;background:var(--mist);display:flex;align-items:center;justify-content:center;color:var(--slate);flex:none} .chip .ci svg{width:14px;height:14px} .chip.out{transform:translateX(8px)} .chip.out .ci{background:var(--grad-soft);color:var(--teal-600)} @keyframes chipin{to{opacity:1;transform:none}} /* process ribbon under the stage */ .flow-ribbon{display:flex;align-items:center;justify-content:center;gap:0;padding:16px 20px;border-top:1px solid var(--line);background:var(--mist);flex-wrap:wrap} .flow-step{display:inline-flex;align-items:center;gap:9px;font-family:'Plus Jakarta Sans',sans-serif;font-weight:600;font-size:13.5px;color:var(--navy);padding:0 4px} .flow-step .fnum{width:24px;height:24px;border-radius:7px;background:#fff;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-size:12px;color:var(--teal-600);box-shadow:var(--shadow-sm)} .flow-step .fnum svg{width:13px;height:13px} .flow-sep{color:var(--slate-2);margin:0 14px;display:inline-flex} .flow-sep svg{width:18px;height:18px} @media (max-width:680px){ .flow-sep{transform:rotate(90deg);margin:6px 0} .flow-ribbon{flex-direction:column} } /* central data layer block */ .dlblock{ align-self:center;background:linear-gradient(165deg,#13315d,#0f2c54);border-radius:var(--r-lg); padding:22px 20px;color:#fff;box-shadow:0 26px 50px -22px rgba(15,44,84,.7);position:relative;overflow:hidden; } .dlblock::after{content:"";position:absolute;inset:0;background:radial-gradient(420px 160px at 50% -10%,rgba(47,99,255,.5),transparent 60%);opacity:.7} .dlblock .dl-brand{display:flex;align-items:center;gap:9px;position:relative;z-index:1;margin-bottom:16px;justify-content:center} .dlblock .dl-brand .brand-word{font-size:19px} .dlblock .dl-brand .b-data{color:#fff}.dlblock .dl-brand .b-layer{color:var(--teal-bright)} .dl-mods{display:grid;grid-template-columns:1fr 1fr;gap:8px;position:relative;z-index:1} .dl-mod{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);border-radius:9px;padding:9px 10px;font-size:12.5px;font-weight:500;font-family:'Plus Jakarta Sans',sans-serif;text-align:center;letter-spacing:.01em} .dl-mod.span2{grid-column:1/3;background:rgba(24,194,176,.16);border-color:rgba(24,194,176,.4);color:#bff6ee} .dl-foot{position:relative;z-index:1;display:flex;gap:7px;justify-content:center;margin-top:14px;flex-wrap:wrap} .dl-tag{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:600;font-family:'Plus Jakarta Sans',sans-serif;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);border-radius:100px;padding:5px 10px} .dl-tag svg{width:12px;height:12px;color:var(--teal-bright)} /* europe mini block */ .euro{align-self:center;text-align:center} .euro .euro-card{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:16px 14px;box-shadow:var(--shadow)} .euro-flag{width:50px;height:50px;margin:0 auto 10px;border-radius:50%;background:radial-gradient(circle at 50% 40%,#1b3c69,#0f2c54);display:flex;align-items:center;justify-content:center;position:relative} .euro-flag .stars{position:absolute;inset:0} .euro-flag .stars b{position:absolute;width:4px;height:4px;background:#ffd34d;border-radius:50%;top:50%;left:50%;transform-origin:0 -16px} .euro-card .et{font-family:'Plus Jakarta Sans',sans-serif;font-weight:700;font-size:13.5px;color:var(--navy)} .euro-card .es{font-size:11.5px;color:var(--slate);margin-top:3px;line-height:1.4} .euro-runtimes{display:flex;flex-direction:column;gap:6px;margin-top:12px} .euro-runtimes span{font-size:11px;font-weight:500;color:var(--slate-2);background:var(--mist);border-radius:7px;padding:5px 8px;font-family:'Plus Jakarta Sans',sans-serif} /* connectors with flowing particles */ .conn{position:relative;width:72px;align-self:center;height:150px} .conn svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible} .conn .wire{stroke:#dce5f0;stroke-width:2.5;fill:none} .conn .wire-lit{stroke:url(#flowgrad);stroke-width:2.5;fill:none;stroke-dasharray:6 10;animation:dash 1s linear infinite;opacity:.9;filter:drop-shadow(0 0 3px rgba(47,99,255,.4))} @keyframes dash{to{stroke-dashoffset:-32}} .spark{fill:var(--blue);filter:drop-shadow(0 0 4px rgba(47,99,255,.7))} @media (prefers-reduced-motion:reduce){ .wire-lit{animation:none}.chip{animation:none;opacity:1;transform:none} .lv{animation:none}*[style*="offset-path"]{animation:none!important} } /* ============================================================ GENERIC CARDS / GRIDS ============================================================ */ .grid{display:grid;gap:22px} .g2{grid-template-columns:repeat(2,1fr)} .g3{grid-template-columns:repeat(3,1fr)} .g4{grid-template-columns:repeat(4,1fr)} .card{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:28px;box-shadow:var(--shadow-sm);transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s} .card:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:#dbe5f1} .card .ic{width:46px;height:46px;border-radius:13px;display:flex;align-items:center;justify-content:center;background:var(--grad-soft);color:var(--teal-600);margin-bottom:18px} .card .ic svg{width:22px;height:22px} .card h3{font-size:20px;margin-bottom:9px} .card p{color:var(--slate);font-size:15.5px;line-height:1.58} /* persona split */ .persona{display:grid;grid-template-columns:1fr 1fr;gap:22px} .persona .pcard{position:relative;border-radius:var(--r-xl);padding:38px;overflow:hidden} .pcard.ceo{background:var(--grad-soft);border:1px solid #dbeef0} .pcard.cto{background:linear-gradient(160deg,#11305c,#0f2c54);border:1px solid #11305c;color:#fff} .pcard .ptag{font-family:'Plus Jakarta Sans',sans-serif;font-weight:700;font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;margin-bottom:18px;display:inline-flex;align-items:center;gap:9px} .pcard.ceo .ptag{color:var(--teal-600)} .pcard.cto .ptag{color:var(--teal-bright)} .pcard h3{font-size:26px;margin-bottom:14px;letter-spacing:-.03em} .pcard.cto h3{color:#fff} .pcard .pdesc{font-size:16px;line-height:1.55;margin-bottom:20px} .pcard.ceo .pdesc{color:var(--slate)} .pcard.cto .pdesc{color:#b9c8df} .plist{display:grid;grid-template-columns:1fr 1fr;gap:11px 18px} .plist li{list-style:none;display:flex;gap:9px;align-items:flex-start;font-size:14.5px;font-weight:500;line-height:1.4} .pcard.ceo .plist li{color:var(--navy-700)} .pcard.cto .plist li{color:#d6e1f0} .plist li svg{width:17px;height:17px;flex:none;margin-top:2px} .pcard.ceo .plist li svg{color:var(--teal)} .pcard.cto .plist li svg{color:var(--teal-bright)} .pquote{margin-top:24px;padding-top:22px;border-top:1px solid;font-family:'Plus Jakarta Sans',sans-serif;font-weight:600;font-size:16px;line-height:1.4} .pcard.ceo .pquote{border-color:#cfeae9;color:var(--navy)} .pcard.cto .pquote{border-color:rgba(255,255,255,.16);color:#fff} /* steps */ .steps{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;background:#fff;box-shadow:var(--shadow-sm)} .step{padding:30px 26px;border-right:1px solid var(--line);position:relative} .step:last-child{border-right:none} .step .sn{font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;font-size:14px;color:var(--teal-600);letter-spacing:.05em;margin-bottom:14px;display:flex;align-items:center;gap:10px} .step .sn b{width:30px;height:30px;border-radius:9px;background:var(--grad-soft);display:flex;align-items:center;justify-content:center;font-size:14px;color:var(--teal-600)} .step h4{font-size:18px;margin-bottom:9px;letter-spacing:-.02em} .step p{font-size:14.5px;color:var(--slate);line-height:1.55} .step .arrow{position:absolute;right:-9px;top:48px;width:18px;height:18px;color:var(--line);z-index:2;background:#fff;border-radius:50%} /* ============================================================ DARK SECTION (Europa) ============================================================ */ .dark{background:linear-gradient(165deg,#102f5a 0%,#0c2447 100%);color:#fff;position:relative;overflow:hidden} .dark::before{content:"";position:absolute;inset:0;background:radial-gradient(700px 380px at 85% 10%,rgba(47,99,255,.22),transparent 60%),radial-gradient(620px 360px at 6% 90%,rgba(19,168,154,.2),transparent 60%)} .dark .wrap{position:relative} .dark h2,.dark h3,.dark h4{color:#fff} .dark .eyebrow{color:var(--teal-bright)} .dark .eyebrow::before{background:var(--teal-bright)} .dark .lead,.dark .muted{color:#aebfd8} /* europe map block */ .euromap{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center} .euro-runtime-list{display:flex;flex-direction:column;gap:12px;margin-top:30px} .rt{display:flex;align-items:center;gap:14px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);border-radius:14px;padding:15px 18px} .rt .rtico{width:42px;height:42px;border-radius:11px;background:rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;color:var(--teal-bright);flex:none} .rt .rtico svg{width:20px;height:20px} .rt b{font-family:'Plus Jakarta Sans',sans-serif;font-size:15.5px;font-weight:600;display:block} .rt span{font-size:13px;color:#9fb2cf} .rt .auto{margin-left:auto;font-size:11px;font-weight:600;font-family:'Plus Jakarta Sans',sans-serif;color:var(--teal-bright);background:rgba(24,194,176,.14);border:1px solid rgba(24,194,176,.3);border-radius:100px;padding:5px 11px;white-space:nowrap} .mapwrap{position:relative;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.12);border-radius:var(--r-xl);padding:30px;aspect-ratio:1/.92} .mapwrap svg{width:100%;height:100%} .node-ping{transform-origin:center;animation:ping 3s ease-out infinite} @keyframes ping{0%{r:4;opacity:1}70%{r:20;opacity:0}100%{r:20;opacity:0}} /* ============================================================ REPLICATION DIAGRAM (Diagram 2) ============================================================ */ .repl{background:#fff;border:1px solid var(--line);border-radius:var(--r-xl);box-shadow:var(--shadow);overflow:hidden} .repl-stages{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;padding:30px} .rstage{text-align:center} .rstage .rlabel{font-family:'Plus Jakarta Sans',sans-serif;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--slate-2);margin-bottom:14px} .statecard{position:relative;background:var(--mist);border:1px solid var(--line);border-radius:var(--r);padding:18px;min-height:130px;display:flex;flex-direction:column;gap:7px;justify-content:center} .statecard .srow{height:9px;border-radius:4px;background:#dde6f1} .statecard .srow.w1{width:80%}.statecard .srow.w2{width:60%}.statecard .srow.w3{width:90%}.statecard .srow.w4{width:50%} .statecard.clean .srow{background:#cfe6ef} .statecard.curated .srow{background:#bfe7e0} .statecard.result{background:linear-gradient(160deg,#0f2c54,#13315d);border-color:#13315d} .statecard.result .srow{background:rgba(255,255,255,.18)} .statecard .stamp{position:absolute;top:10px;right:10px;font-size:10px;font-weight:700;font-family:'Plus Jakarta Sans',sans-serif;color:var(--teal-600);background:#fff;border:1px solid var(--line);border-radius:100px;padding:3px 8px} .statecard.result .stamp{color:var(--teal-bright);background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.2)} .rstage .rcap{font-size:12.5px;color:var(--slate);margin-top:11px} .repl-arrows{position:relative;height:0} /* ============================================================ RESULTS — dashboard mock ============================================================ */ .results-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:22px} .dashmock{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow);overflow:hidden} .dm-top{display:flex;align-items:center;gap:9px;padding:13px 18px;border-bottom:1px solid var(--line);background:var(--mist)} .dm-top .dmttl{font-family:'Plus Jakarta Sans',sans-serif;font-weight:600;font-size:13.5px;color:var(--navy)} .dm-top .dmttl span{color:var(--slate-2);font-weight:500} .dm-body{padding:22px;display:grid;grid-template-columns:repeat(3,1fr);gap:14px} .kpi{border:1px solid var(--line);border-radius:13px;padding:15px} .kpi .kl{font-size:11.5px;color:var(--slate-2);font-weight:600;font-family:'Plus Jakarta Sans',sans-serif;letter-spacing:.02em} .kpi .kv{font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;font-size:25px;color:var(--navy);margin-top:5px;letter-spacing:-.03em} .kpi .kd{font-size:11.5px;font-weight:600;margin-top:3px;display:inline-flex;align-items:center;gap:4px} .kpi .kd.up{color:#0f9488}.kpi .kd.dn{color:#e06a7c} .chartbox{grid-column:1/4;border:1px solid var(--line);border-radius:13px;padding:16px 16px 8px} .chartbox .ch-h{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px} .chartbox .ch-h b{font-family:'Plus Jakarta Sans',sans-serif;font-size:13px;color:var(--navy)} .chartbox .ch-h span{font-size:11px;color:var(--slate-2)} .bars{display:flex;align-items:flex-end;gap:10px;height:96px} .bars .bar{flex:1;border-radius:6px 6px 0 0;background:linear-gradient(180deg,#39c2b4,#13a89a);position:relative;transition:height 1s var(--ease)} .bars .bar.b{background:linear-gradient(180deg,#5a8bff,#2f63ff)} .result-side{display:flex;flex-direction:column;gap:14px} .rsmall{display:flex;gap:14px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;box-shadow:var(--shadow-sm);transition:transform .3s var(--ease),border-color .3s} .rsmall:hover{transform:translateX(4px);border-color:var(--teal)} .rsmall .rico{width:44px;height:44px;border-radius:12px;background:var(--grad-soft);display:flex;align-items:center;justify-content:center;color:var(--teal-600);flex:none} .rsmall .rico svg{width:21px;height:21px} .rsmall b{font-family:'Plus Jakarta Sans',sans-serif;font-size:15.5px;color:var(--navy);display:block} .rsmall span{font-size:13px;color:var(--slate)} /* ============================================================ INTEGRATIONS — sources & destinations ============================================================ */ .io{display:grid;grid-template-columns:1fr 1fr;gap:22px} .io-card{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:30px;box-shadow:var(--shadow-sm)} .io-card h3{font-size:19px;margin-bottom:6px;display:flex;align-items:center;gap:10px} .io-card h3 .iohint{font-size:12px;font-weight:600;color:var(--teal-600);font-family:'Plus Jakarta Sans',sans-serif} .io-card p{color:var(--slate);font-size:14px;margin-bottom:20px} .tagcloud{display:flex;flex-wrap:wrap;gap:8px} .tg{font-size:13px;font-weight:500;color:var(--navy-700);background:var(--mist);border:1px solid var(--line);border-radius:9px;padding:8px 12px;transition:all .2s} .tg:hover{background:#fff;border-color:var(--teal);color:var(--teal-600);transform:translateY(-2px)} .tg.ext{background:#eef4ff;border-color:#dce7ff;color:#3457c8} /* pay-per-use note */ .payline{display:inline-flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--line);border-radius:100px;padding:10px 10px 10px 18px;box-shadow:var(--shadow-sm);font-size:14.5px;color:var(--navy-700);font-weight:500;margin-top:26px} .payline b{color:var(--navy);font-family:'Plus Jakarta Sans',sans-serif;font-weight:700} .payline .pl-tag{font-size:12px;font-weight:700;font-family:'Plus Jakarta Sans',sans-serif;color:#fff;background:var(--grad);border-radius:100px;padding:6px 13px;display:inline-flex;align-items:center;gap:6px} .payline .pl-tag svg{width:13px;height:13px} /* factory band */ .factory{margin-top:22px;background:linear-gradient(165deg,#11305c,#0f2c54);border-radius:var(--r-xl);padding:36px;color:#fff;text-align:center;position:relative;overflow:hidden} .factory::before{content:"";position:absolute;inset:0;background:radial-gradient(600px 200px at 50% 0%,rgba(47,99,255,.3),transparent 60%)} .factory-claim{position:relative;font-family:'Plus Jakarta Sans',sans-serif;font-weight:700;font-size:clamp(20px,2.4vw,28px);letter-spacing:-.02em} .factory-claim .grad-tx{background:linear-gradient(100deg,#39c2b4,#5a8bff);-webkit-background-clip:text;background-clip:text;color:transparent} .factory-sub{position:relative;color:#aebfd8;margin-top:10px;font-size:15px} /* funneld */ .funneld{display:grid;grid-template-columns:.9fr 1.1fr;gap:48px;align-items:center} .funneld-vis{background:#fff;border:1px solid var(--line);border-radius:var(--r-xl);padding:30px;box-shadow:var(--shadow)} .fn-flow{display:flex;align-items:center;gap:14px} .fn-box{flex:1;text-align:center;border:1px solid var(--line);border-radius:var(--r);padding:20px 14px;background:var(--mist)} .fn-box.mid{background:var(--grad-soft);border-color:#cfeae9} .fn-box .fbi{width:40px;height:40px;border-radius:11px;margin:0 auto 10px;display:flex;align-items:center;justify-content:center;background:#fff;border:1px solid var(--line);color:var(--teal-600)} .fn-box b{font-family:'Plus Jakarta Sans',sans-serif;font-size:13.5px;color:var(--navy);display:block} .fn-box span{font-size:11.5px;color:var(--slate)} .fn-arrow{color:var(--teal);flex:none} /* ============================================================ SOLUTIONS (no pricing) ============================================================ */ .sols{display:grid;grid-template-columns:repeat(4,1fr);gap:18px} .sol{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:26px;display:flex;flex-direction:column;box-shadow:var(--shadow-sm);transition:transform .3s var(--ease),box-shadow .3s,border-color .3s} .sol:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:#dbe5f1} .sol.feat{background:linear-gradient(170deg,#11305c,#0f2c54);border-color:#11305c;color:#fff;box-shadow:var(--shadow-lg)} .sol .sname{font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;font-size:21px;color:var(--navy);letter-spacing:-.02em} .sol.feat .sname{color:#fff} .sol .sfeat-tag{font-size:10.5px;font-weight:700;font-family:'Plus Jakarta Sans',sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--teal-bright);background:rgba(24,194,176,.16);border:1px solid rgba(24,194,176,.34);border-radius:100px;padding:4px 10px;align-self:flex-start;margin-bottom:12px} .sol .sdesc{font-size:13.5px;color:var(--slate);margin-top:8px;min-height:38px} .sol.feat .sdesc{color:#aebfd8} .sol .sdiv{height:1px;background:var(--line);margin:18px 0} .sol.feat .sdiv{background:rgba(255,255,255,.14)} .sol .sideal{font-size:11px;font-weight:700;font-family:'Plus Jakarta Sans',sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--slate-2);margin-bottom:11px} .sol.feat .sideal{color:#8fa3c4} .sol ul{list-style:none;padding:0;margin:0 0 22px;display:flex;flex-direction:column;gap:9px} .sol ul li{display:flex;gap:9px;font-size:13.5px;color:var(--navy-700);font-weight:500;line-height:1.4} .sol.feat ul li{color:#d6e1f0} .sol ul li svg{width:16px;height:16px;flex:none;margin-top:2px;color:var(--teal)} .sol.feat ul li svg{color:var(--teal-bright)} .sol .btn{margin-top:auto;width:100%} /* ============================================================ CLAIMS marquee band ============================================================ */ .claims{background:var(--mist);border-top:1px solid var(--line);border-bottom:1px solid var(--line);overflow:hidden;padding:30px 0} .marquee{display:flex;gap:0;width:max-content;animation:scrollx 38s linear infinite} .marquee:hover{animation-play-state:paused} .claim-it{display:inline-flex;align-items:center;gap:18px;padding:0 30px;font-family:'Plus Jakarta Sans',sans-serif;font-weight:600;font-size:20px;color:var(--navy);white-space:nowrap;letter-spacing:-.02em} .claim-it::after{content:"";width:7px;height:7px;border-radius:2px;background:var(--teal);transform:rotate(45deg)} @keyframes scrollx{to{transform:translateX(-50%)}} /* ============================================================ CTA FINAL + case builder ============================================================ */ .ctafin{position:relative;background:linear-gradient(165deg,#11305c 0%,#0c2447 100%);color:#fff;border-radius:var(--r-xl);padding:60px;overflow:hidden} .ctafin::before{content:"";position:absolute;inset:0;background:radial-gradient(700px 360px at 80% -10%,rgba(47,99,255,.28),transparent 60%),radial-gradient(600px 320px at 5% 110%,rgba(19,168,154,.24),transparent 60%)} .ctafin-in{position:relative;display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center} .ctafin h2{color:#fff;font-size:clamp(28px,3.4vw,42px);letter-spacing:-.03em} .ctafin p{color:#b9c8df;margin-top:18px;font-size:17px;line-height:1.55} .ctafin .nolist{display:flex;flex-direction:column;gap:9px;margin:24px 0 30px} .ctafin .nolist li{list-style:none;display:flex;gap:10px;color:#cdd9ec;font-size:15px;font-weight:500} .ctafin .nolist li svg{width:18px;height:18px;color:var(--teal-bright);flex:none;margin-top:2px} .ctafin .ctafin-btns{display:flex;gap:12px;flex-wrap:wrap} .ctafin-mail{margin-top:18px;font-size:14.5px;color:#aebfd8;display:flex;align-items:center;gap:9px;flex-wrap:wrap} .ctafin-mail svg{width:17px;height:17px;color:var(--teal-bright);flex:none} .ctafin-mail a{color:#fff;text-decoration:underline;text-underline-offset:2px;font-weight:600} /* case builder card */ .builder{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.16);border-radius:var(--r-lg);padding:26px;backdrop-filter:blur(8px)} .builder h4{color:#fff;font-size:17px;margin-bottom:4px} .builder .bsub{color:#9fb2cf;font-size:13px;margin-bottom:20px} .bfield{margin-bottom:16px} .bfield label{display:block;font-family:'Plus Jakarta Sans',sans-serif;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--teal-bright);margin-bottom:9px} .bopts{display:flex;flex-wrap:wrap;gap:8px} .bopt{font-size:13px;font-weight:500;font-family:'Plus Jakarta Sans',sans-serif;color:#cdd9ec;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.16);border-radius:9px;padding:8px 13px;cursor:pointer;transition:all .2s} .bopt:hover{border-color:rgba(255,255,255,.4)} .bopt.on{background:var(--grad);border-color:transparent;color:#fff} .bresult{margin-top:6px;background:rgba(10,28,55,.5);border:1px solid rgba(24,194,176,.3);border-radius:13px;padding:16px 18px;font-size:14px;line-height:1.5;color:#dbe7f5;min-height:62px} .bresult b{color:#fff;font-family:'Plus Jakarta Sans',sans-serif} .bresult .rtag{color:var(--teal-bright);font-weight:600} /* ============================================================ FOOTER ============================================================ */ .foot{background:#0b2142;color:#9fb2cf;padding:64px 0 30px;position:relative;overflow:hidden} .foot::before{content:"";position:absolute;inset:0;background:radial-gradient(600px 300px at 90% -20%,rgba(19,168,154,.16),transparent 60%)} .foot .wrap{position:relative} .foot-top{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:40px;padding-bottom:42px;border-bottom:1px solid rgba(255,255,255,.1)} .foot .brand-word .b-data{color:#fff}.foot .brand-word .b-layer{color:var(--teal-bright)} .foot-blurb{margin-top:18px;max-width:380px;font-size:14px;line-height:1.6;color:#8fa3c4} .foot-badges{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px} .foot-badges span{font-size:11.5px;font-weight:500;color:#cdd9ec;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:100px;padding:6px 12px} .foot-col h5{font-family:'Plus Jakarta Sans',sans-serif;font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#fff;margin:0 0 16px} .foot-col a{display:block;font-size:14px;color:#9fb2cf;padding:6px 0;transition:color .2s} .foot-col a:hover{color:var(--teal-bright)} .foot-bot{display:flex;justify-content:space-between;align-items:center;padding-top:24px;font-size:13px;color:#7589a8;flex-wrap:wrap;gap:12px} /* reveal on scroll */ .rv{opacity:0;transform:translateY(22px);transition:opacity .7s var(--ease),transform .7s var(--ease)} .rv.in{opacity:1;transform:none} .rv.d1{transition-delay:.08s}.rv.d2{transition-delay:.16s}.rv.d3{transition-delay:.24s}.rv.d4{transition-delay:.32s} /* ============================================================ RESPONSIVE ============================================================ */ /* nav: keep both CTAs (platform + demo); collapse links to burger when tight */ @media (max-width:1240px){ .nav-links{display:none} .nav-burger{display:flex} } @media (max-width:1040px){ .flow-stage{grid-template-columns:1fr;gap:20px} .conn{display:none} .flow-col{padding:8px 24px} .dlblock,.euro{max-width:520px;margin:0 auto;width:100%} .persona,.euromap,.funneld,.results-grid,.ctafin-in{grid-template-columns:1fr} .steps{grid-template-columns:1fr 1fr} .step:nth-child(2){border-right:none} .step .arrow{display:none} .sols{grid-template-columns:1fr 1fr} .g4{grid-template-columns:1fr 1fr} } @media (max-width:680px){ body{font-size:16px} .wrap{padding:0 20px} .sect{padding:72px 0} .nav-cta .nav-plat{display:none} .g2,.g3,.g4,.persona .plist,.sols,.steps,.repl-stages,.dm-body,.io,.foot-top{grid-template-columns:1fr} .dm-body{grid-template-columns:1fr 1fr} .chartbox{grid-column:1/3} .hero h1{font-size:clamp(32px,9vw,42px)} .ctafin{padding:36px 26px} .fn-flow{flex-direction:column} .fn-arrow{transform:rotate(90deg)} .factory,.repl-stages{padding:24px} } /* ============================================================ LANGUAGE SWITCH · FOOTER LEGAL · COOKIE BANNER ============================================================ */ .lang-switch{display:inline-flex;align-items:center;background:var(--mist);border:1px solid var(--line);border-radius:10px;padding:2px;gap:2px} .lang-switch a{font-family:'Plus Jakarta Sans',sans-serif;font-weight:600;font-size:12.5px;color:var(--slate);padding:6px 10px;border-radius:8px;letter-spacing:.02em;transition:all .2s} .lang-switch a.on{background:#fff;color:var(--navy);box-shadow:var(--shadow-sm)} .lang-switch a:hover:not(.on){color:var(--navy)} .foot-legal-co{margin-top:16px;font-size:12.5px;color:#7589a8;line-height:1.5;max-width:380px} .foot-legal{display:inline-flex;align-items:center;gap:18px;flex-wrap:wrap} .foot-legal a{font-size:13px;color:#9fb2cf;transition:color .2s} .foot-legal a:hover{color:var(--teal-bright)} /* cookie banner — bottom-left */ .cookie{position:fixed;left:18px;bottom:18px;z-index:200;width:min(400px,calc(100vw - 36px));background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow-lg);padding:22px 24px;transform:translateY(180%);transition:transform .5s var(--ease)} .cookie.show{transform:none} .cookie h4{font-size:16px;margin-bottom:7px} .cookie p{font-size:13.5px;color:var(--slate);line-height:1.55;margin-bottom:16px} .cookie p a{color:var(--teal-600);text-decoration:underline;text-underline-offset:2px} .cookie-btns{display:flex;gap:10px;flex-wrap:wrap} .cookie-btns .btn{flex:1;min-width:120px} @media (max-width:460px){ .cookie{left:12px;right:12px;bottom:12px;width:auto;padding:18px} } /* nav: keep lang switch, collapse links a touch earlier on tight widths */ @media (max-width:1300px){ .nav-links a{padding:8px 8px} } @media (max-width:680px){ .nav-cta .lang-switch{display:none} } /* ============================================================ LEGAL PAGES ============================================================ */ .legal-nav{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.85);backdrop-filter:saturate(160%) blur(16px);border-bottom:1px solid var(--line)} .legal-nav .nav-in{justify-content:space-between} .legal-nav .ln-right{display:flex;align-items:center;gap:14px} .legal-back{font-family:'Plus Jakarta Sans',sans-serif;font-weight:500;font-size:14px;color:var(--slate);display:inline-flex;align-items:center;gap:7px} .legal-back:hover{color:var(--navy)} .legal-back svg{width:15px;height:15px} .legal-hero{background:var(--mist);border-bottom:1px solid var(--line);padding:54px 0 40px} .legal-wrap{max-width:800px;margin:0 auto;padding:0 32px} .legal-hero .eyebrow{margin-bottom:14px} .legal-hero h1{font-size:clamp(30px,4vw,42px);letter-spacing:-.03em} .legal-hero .updated{margin-top:14px;font-size:14px;color:var(--slate-2)} .legal-body{padding:56px 0 90px} .legal-body h2{font-size:21px;margin:38px 0 12px;letter-spacing:-.02em} .legal-body h2:first-child{margin-top:0} .legal-body h3{font-size:16px;margin:22px 0 8px;color:var(--navy-700)} .legal-body p{color:var(--slate);font-size:15.5px;line-height:1.7;margin-bottom:14px} .legal-body ul{margin:0 0 16px;padding-left:0;list-style:none} .legal-body li{color:var(--slate);font-size:15.5px;line-height:1.6;padding-left:26px;position:relative;margin-bottom:9px} .legal-body li::before{content:"";position:absolute;left:4px;top:10px;width:7px;height:7px;border-radius:2px;background:var(--teal);transform:rotate(45deg)} .legal-body a{color:var(--teal-600);text-decoration:underline;text-underline-offset:2px} .legal-body strong{color:var(--navy)} .legal-card{background:var(--mist);border:1px solid var(--line);border-radius:var(--r);padding:22px 24px;margin:20px 0} .legal-card p{margin:0} .legal-table{width:100%;border-collapse:collapse;margin:8px 0 20px;font-size:14px} .legal-table th,.legal-table td{text-align:left;padding:11px 14px;border:1px solid var(--line);vertical-align:top;color:var(--slate)} .legal-table th{background:var(--mist);font-family:'Plus Jakarta Sans',sans-serif;font-weight:600;color:var(--navy);font-size:13px} .lang-block{display:none} .lang-block.active{display:block} .lang-inline{display:none} .lang-inline.active{display:inline} /* ============================================================ FAQ ============================================================ */ .faq{max-width:820px;margin:0 auto;display:flex;flex-direction:column;gap:12px} .faq-item{background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow-sm);overflow:hidden;transition:border-color .25s,box-shadow .25s} .faq-item[open]{border-color:#d3e0ee;box-shadow:var(--shadow)} .faq-item summary{ list-style:none;cursor:pointer;display:flex;align-items:center;gap:16px; padding:20px 24px;min-height:44px; font-family:'Plus Jakarta Sans',sans-serif;font-weight:600;font-size:17px;color:var(--navy); letter-spacing:-.01em; } .faq-item summary::-webkit-details-marker{display:none} .faq-ic{margin-left:auto;flex:none;position:relative;width:20px;height:20px} .faq-ic::before,.faq-ic::after{content:"";position:absolute;background:var(--teal);border-radius:2px;transition:transform .3s var(--ease),opacity .3s} .faq-ic::before{top:9px;left:2px;width:16px;height:2px} .faq-ic::after{top:2px;left:9px;width:2px;height:16px} .faq-item[open] .faq-ic::after{transform:scaleY(0);opacity:0} .faq-a{padding:0 24px 22px;color:var(--slate);font-size:15.5px;line-height:1.65} .faq-a p{max-width:64ch} .faq-a strong{color:var(--navy)} /* ============================================================ MOBILE & A11Y POLISH ============================================================ */ /* honor reduced-motion globally */ @media (prefers-reduced-motion:reduce){ *{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important} .rv{opacity:1!important;transform:none!important} } /* generous tap targets */ .nav-links a{min-height:44px;display:flex;align-items:center} a,button{-webkit-tap-highlight-color:rgba(19,168,154,.18)} :focus-visible{outline:2.5px solid var(--teal);outline-offset:2px;border-radius:6px} @media (max-width:680px){ .faq-item summary{font-size:15.5px;padding:18px 18px} .faq-a{padding:0 18px 20px;font-size:15px} .bopt{padding:10px 14px} /* bigger builder chips */ .hero-ctas .btn,.ctafin-btns .btn{flex:1;min-width:0;justify-content:center} .badge{font-size:12.5px} .sect-head{margin-bottom:38px} } @media (max-width:380px){ .dm-body{grid-template-columns:1fr} .chartbox{grid-column:1} }