@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@700;800;900&family=Raleway:wght@400;500;600;700;800&display=swap');

:root {
  --ink: #0b3558;
  --blue: #0060c8;
  --blue-2: #3ac7fd;
  --blue-pastel: #aac0e9;
  --green: #4ad894;
  --green-pastel: #c2efd5;
  --peach: #ffbea1;
  --peach-pastel: #ffdfd2;
  --bg: #eaeff8;
  --navy: #001c63;
  --navy-2: #053a86;
  --white: #ffffff;
  --shadow: 0 24px 65px rgba(11, 53, 88, .14);
  --shadow-sm: 0 12px 34px rgba(11, 53, 88, .11);
  --radius: 28px;
  --radius-sm: 18px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: linear-gradient(180deg, var(--bg) 0%, #fff 34%, #f7faff 100%);
  font-family: 'Raleway', Arial, sans-serif;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}
body::before {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  background-image: radial-gradient(rgba(0,96,200,.075) 1px, transparent 1px);
  background-size: 24px 24px;
  mask-image: linear-gradient(to bottom, #000, transparent 55%);
  z-index: -1;
}
img { max-width: 100%; display: block; }
a { color: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
.container { width: min(1180px, calc(100% - 40px)); margin-inline: auto; }
.skip-link { position: fixed; left: 16px; top: -80px; background: var(--navy); color: #fff; padding: 12px 16px; border-radius: 10px; z-index: 1000; }
.skip-link:focus { top: 16px; }

.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  backdrop-filter: blur(18px);
  background: rgba(234,239,248,.82);
  border-bottom: 1px solid rgba(11,53,88,.08);
}
.nav-wrap { min-height: 82px; display: flex; align-items: center; gap: 24px; }
.brand { display: inline-flex; align-items: center; flex: 0 0 auto; }
.brand img { width: 174px; height: auto; }
.nav-menu { display: flex; align-items: center; justify-content: center; gap: 26px; margin-left: auto; }
.nav-menu a { text-decoration: none; font-size: .91rem; font-weight: 700; color: rgba(11,53,88,.82); }
.nav-menu a:hover { color: var(--blue); }
.nav-actions { display: flex; align-items: center; gap: 12px; }
.language-switch { display: flex; border: 1px solid rgba(11,53,88,.16); border-radius: 999px; padding: 4px; background: rgba(255,255,255,.7); }
.language-switch a { min-width: 34px; text-align: center; padding: 6px 8px; border-radius: 999px; text-decoration: none; font-size: .76rem; font-weight: 800; }
.language-switch a[aria-current='page'] { background: var(--ink); color: #fff; }
.menu-toggle { display:none; border:0; background:transparent; width:44px; height:44px; border-radius:12px; cursor:pointer; }
.menu-toggle span { display:block; width:22px; height:2px; background:var(--ink); margin:5px auto; border-radius:2px; transition:.25s ease; }

.btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 48px; padding: 0 20px; border-radius: 14px; text-decoration: none; font-weight: 800; font-size: .93rem; border: 1px solid transparent; transition: transform .2s ease, box-shadow .2s ease, background .2s ease; }
.btn:hover { transform: translateY(-2px); }
.btn-primary { color:#fff; background: linear-gradient(135deg, var(--blue), #1389e8); box-shadow: 0 12px 26px rgba(0,96,200,.24); }
.btn-primary:hover { box-shadow: 0 15px 36px rgba(0,96,200,.3); }
.btn-secondary { background:#fff; border-color:rgba(11,53,88,.15); color:var(--ink); box-shadow:var(--shadow-sm); }
.btn-light { background:#fff; color:var(--blue); }
.btn-small { min-height:42px; padding:0 16px; font-size:.84rem; }
.arrow { font-size: 1.1em; }

.hero { position: relative; padding: 92px 0 82px; overflow: hidden; }
.hero::before { content:''; position:absolute; width:560px; height:560px; right:-240px; top:-210px; border-radius:50%; background:radial-gradient(circle, rgba(58,199,253,.28), rgba(58,199,253,0) 69%); }
.hero-grid { display:grid; grid-template-columns: 1.08fr .92fr; gap:70px; align-items:center; }
.eyebrow { display:inline-flex; align-items:center; gap:9px; padding:8px 12px; border-radius:999px; background:rgba(194,239,213,.72); color:#095844; font-weight:800; font-size:.78rem; letter-spacing:.03em; text-transform:uppercase; }
.eyebrow::before { content:''; width:8px; height:8px; border-radius:50%; background:var(--green); box-shadow:0 0 0 5px rgba(74,216,148,.16); }
h1,h2,h3 { font-family:'Nunito', 'Arial Rounded MT Bold', sans-serif; line-height:1.08; margin-top:0; }
h1 { font-size: clamp(3rem, 6vw, 5.35rem); letter-spacing:-.045em; margin:22px 0 22px; max-width:820px; }
.gradient-text { background:linear-gradient(105deg, var(--blue), var(--blue-2)); -webkit-background-clip:text; color:transparent; }
.hero-lead { font-size: clamp(1.08rem, 1.5vw, 1.24rem); max-width:690px; color:rgba(11,53,88,.78); margin:0 0 30px; }
.hero-actions { display:flex; gap:14px; flex-wrap:wrap; }
.hero-note { margin-top:20px; display:flex; align-items:center; gap:10px; font-size:.87rem; color:rgba(11,53,88,.66); font-weight:600; }
.hero-note i { width:24px; height:24px; border-radius:50%; background:var(--green-pastel); display:grid; place-items:center; font-style:normal; font-weight:900; color:#166a50; }

.hero-visual { position:relative; min-height:520px; display:grid; place-items:center; }
.visual-glow { position:absolute; width:420px; height:420px; border-radius:50%; background:linear-gradient(145deg, rgba(0,96,200,.20), rgba(58,199,253,.04)); filter:blur(2px); }
.process-panel { position:relative; width:min(100%, 490px); background:rgba(255,255,255,.92); border:1px solid rgba(255,255,255,.86); border-radius:32px; box-shadow:var(--shadow); overflow:hidden; transform:rotate(1deg); }
.panel-head { padding:22px 24px; display:flex; justify-content:space-between; align-items:center; border-bottom:1px solid rgba(11,53,88,.08); }
.panel-head strong { font-family:'Nunito'; font-size:1rem; }
.status { display:inline-flex; gap:7px; align-items:center; font-weight:800; font-size:.73rem; color:#176a50; background:var(--green-pastel); padding:6px 9px; border-radius:999px; }
.status::before { content:''; width:7px; height:7px; background:var(--green); border-radius:50%; }
.panel-body { padding:26px; }
.message { max-width:85%; border-radius:18px; padding:15px 17px; margin-bottom:16px; font-size:.9rem; box-shadow:0 8px 18px rgba(11,53,88,.07); }
.message.user { margin-left:auto; background:linear-gradient(135deg,var(--blue),#158ee9); color:#fff; border-bottom-right-radius:5px; }
.message.ai { background:var(--bg); border-bottom-left-radius:5px; }
.source-line { display:flex; gap:8px; align-items:center; margin-top:10px; font-size:.72rem; font-weight:700; color:rgba(11,53,88,.65); }
.source-line b { width:18px; height:18px; border-radius:50%; background:var(--green); color:#063c2d; display:grid; place-items:center; }
.route-card { margin-top:20px; border:1px solid rgba(0,96,200,.13); border-radius:18px; padding:16px; display:grid; grid-template-columns:auto 1fr auto; gap:13px; align-items:center; }
.route-icon { width:42px; height:42px; border-radius:14px; background:var(--peach-pastel); display:grid; place-items:center; font-size:1.25rem; }
.route-card strong { display:block; font-size:.86rem; }
.route-card small { color:rgba(11,53,88,.6); }
.route-card .tag { font-size:.7rem; font-weight:800; color:var(--blue); background:rgba(170,192,233,.33); padding:6px 8px; border-radius:999px; }
.float-card { position:absolute; left:-12px; bottom:26px; background:var(--navy); color:#fff; border-radius:18px; padding:15px 18px; box-shadow:var(--shadow-sm); transform:rotate(-4deg); }
.float-card span { display:block; color:var(--green); font-weight:900; font-size:1.5rem; line-height:1; }
.float-card small { opacity:.78; }

.credibility { padding:0 0 54px; }
.credibility-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:rgba(11,53,88,.09); border:1px solid rgba(11,53,88,.08); border-radius:22px; overflow:hidden; box-shadow:var(--shadow-sm); }
.credibility-item { background:rgba(255,255,255,.88); padding:22px 24px; display:flex; gap:12px; align-items:flex-start; font-weight:800; font-size:.88rem; }
.check { width:25px; height:25px; border-radius:9px; flex:0 0 auto; display:grid; place-items:center; background:var(--green-pastel); color:#116348; }

.section { padding:96px 0; position:relative; }
.section.alt { background:linear-gradient(180deg, rgba(234,239,248,.72), rgba(255,255,255,.2)); }
.section-kicker { color:var(--blue); font-weight:800; letter-spacing:.09em; text-transform:uppercase; font-size:.76rem; margin-bottom:12px; }
.section-title { font-size:clamp(2.3rem,4.2vw,4rem); letter-spacing:-.035em; margin-bottom:18px; max-width:850px; }
.section-copy { max-width:740px; font-size:1.07rem; color:rgba(11,53,88,.72); margin-bottom:40px; }
.center { text-align:center; margin-inline:auto; }

.problem-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.problem-card { min-height:150px; padding:24px; border-radius:22px; background:#fff; border:1px solid rgba(11,53,88,.08); box-shadow:var(--shadow-sm); display:flex; align-items:flex-end; position:relative; overflow:hidden; font-family:'Nunito'; font-weight:800; font-size:1.08rem; }
.problem-card::before { content:''; position:absolute; width:84px; height:84px; border-radius:50%; background:var(--peach-pastel); right:-20px; top:-20px; }
.problem-card:nth-child(2n)::before { background:var(--blue-pastel); opacity:.48; }
.problem-card:nth-child(3n)::before { background:var(--green-pastel); }
.problem-card span { position:relative; }

.pillars { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.pillar { border-radius:24px; padding:28px 24px 26px; min-height:330px; position:relative; overflow:hidden; border:1px solid rgba(11,53,88,.08); }
.pillar:nth-child(1){ background:linear-gradient(180deg,#fff,rgba(170,192,233,.35)); }
.pillar:nth-child(2){ background:linear-gradient(180deg,#fff,rgba(194,239,213,.55)); }
.pillar:nth-child(3){ background:linear-gradient(180deg,#fff,rgba(255,223,210,.72)); }
.pillar:nth-child(4){ background:linear-gradient(180deg,#fff,rgba(58,199,253,.17)); }
.pillar-num { width:46px; height:46px; border-radius:15px; display:grid; place-items:center; background:var(--ink); color:#fff; font-family:'Nunito'; font-weight:900; margin-bottom:28px; }
.pillar h3 { font-size:1.55rem; margin-bottom:13px; }
.pillar p { margin:0; color:rgba(11,53,88,.72); font-size:.93rem; }

.preview-wrap { display:grid; grid-template-columns:.78fr 1.22fr; gap:52px; align-items:center; }
.workflow-stack { background:linear-gradient(145deg,var(--navy),var(--navy-2)); color:#fff; border-radius:30px; padding:32px; box-shadow:var(--shadow); }
.workflow-item { display:grid; grid-template-columns:48px 1fr; gap:16px; align-items:start; padding:18px 0; border-bottom:1px solid rgba(255,255,255,.12); }
.workflow-item:last-child { border:0; }
.workflow-index { width:42px; height:42px; border-radius:14px; display:grid; place-items:center; background:rgba(255,255,255,.1); color:var(--green); font-family:'Nunito'; font-weight:900; }
.workflow-item h3 { margin:1px 0 5px; font-size:1.05rem; }
.workflow-item p { margin:0; color:rgba(255,255,255,.7); font-size:.86rem; }

.how-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; counter-reset: steps; }
.how-card { background:#fff; border:1px solid rgba(11,53,88,.08); border-radius:24px; padding:28px 24px; min-height:255px; box-shadow:var(--shadow-sm); position:relative; }
.how-card::before { counter-increment:steps; content:'0' counter(steps); display:block; color:var(--blue); font-family:'Nunito'; font-weight:900; font-size:.78rem; margin-bottom:34px; }
.how-card h3 { font-size:1.25rem; margin-bottom:10px; }
.how-card p { margin:0; font-size:.9rem; color:rgba(11,53,88,.68); }

.outcomes { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.outcome { padding:24px; border-radius:22px; background:#fff; border:1px solid rgba(11,53,88,.08); box-shadow:var(--shadow-sm); }
.outcome-icon { width:44px; height:44px; border-radius:14px; background:var(--green-pastel); display:grid; place-items:center; margin-bottom:18px; font-weight:900; }
.outcome:nth-child(2n) .outcome-icon { background:var(--blue-pastel); }
.outcome:nth-child(3n) .outcome-icon { background:var(--peach-pastel); }
.outcome h3 { font-size:1.12rem; margin-bottom:8px; }
.outcome p { margin:0; color:rgba(11,53,88,.67); font-size:.9rem; }

.use-cases { display:flex; flex-wrap:wrap; gap:12px; justify-content:center; }
.case { background:#fff; border:1px solid rgba(11,53,88,.1); border-radius:999px; padding:13px 18px; font-weight:800; font-size:.9rem; box-shadow:0 8px 20px rgba(11,53,88,.07); }
.case::before { content:'+'; color:var(--blue); margin-right:9px; font-size:1.08em; }

.language-section { margin:40px 0; border-radius:36px; overflow:hidden; background:linear-gradient(145deg,var(--navy),var(--navy-2)); color:#fff; box-shadow:var(--shadow); }
.language-inner { padding:72px; display:grid; grid-template-columns:1fr .78fr; gap:50px; align-items:center; }
.language-section .section-kicker { color:var(--green); }
.language-section .section-title { margin-bottom:16px; }
.language-section p { color:rgba(255,255,255,.76); }
.language-cloud { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.lang-card { border:1px solid rgba(255,255,255,.14); background:rgba(255,255,255,.08); border-radius:20px; padding:22px; }
.lang-code { display:inline-grid; place-items:center; width:42px; height:42px; border-radius:14px; background:var(--green); color:var(--navy); font-family:'Nunito'; font-weight:900; margin-bottom:15px; }
.lang-card strong { display:block; font-size:1rem; }
.lang-card small { color:rgba(255,255,255,.66); }
.scope-note { font-size:.78rem; margin-top:20px; opacity:.75; }

.control-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.control-card { background:linear-gradient(180deg,#fff,#f8fbff); border:1px solid rgba(11,53,88,.08); border-radius:22px; padding:24px; min-height:160px; }
.control-card .mini { width:31px; height:31px; display:grid; place-items:center; background:var(--ink); color:#fff; border-radius:10px; font-size:.78rem; font-weight:900; margin-bottom:18px; }
.control-card p { margin:0; font-weight:700; font-size:.92rem; }

.pilot { display:grid; grid-template-columns:repeat(4,1fr); gap:0; background:#fff; border:1px solid rgba(11,53,88,.08); border-radius:28px; box-shadow:var(--shadow); overflow:hidden; }
.pilot-step { padding:30px 25px; position:relative; border-right:1px solid rgba(11,53,88,.08); }
.pilot-step:last-child { border-right:0; }
.pilot-step .step-dot { width:46px; height:46px; border-radius:50%; display:grid; place-items:center; background:var(--blue); color:#fff; font-family:'Nunito'; font-weight:900; margin-bottom:26px; }
.pilot-step:nth-child(2) .step-dot { background:#138ddf; }
.pilot-step:nth-child(3) .step-dot { background:#2fb5bf; }
.pilot-step:nth-child(4) .step-dot { background:var(--green); color:var(--ink); }
.pilot-step h3 { font-size:1.2rem; }
.pilot-step p { color:rgba(11,53,88,.68); font-size:.88rem; margin:0; }

.about-card { display:grid; grid-template-columns:.82fr 1.18fr; gap:48px; padding:50px; border-radius:32px; background:linear-gradient(135deg,rgba(170,192,233,.42),rgba(194,239,213,.42)); border:1px solid rgba(11,53,88,.08); align-items:center; }
.about-mark { background:#fff; border-radius:26px; padding:38px; min-height:280px; display:grid; place-items:center; box-shadow:var(--shadow-sm); }
.about-mark img { width:min(100%,310px); }
.about-card h2 { font-size:clamp(2.1rem,3.8vw,3.4rem); margin-bottom:16px; }
.about-card p { margin:0; color:rgba(11,53,88,.72); }

.final-cta { padding:30px 0 96px; }
.cta-box { background:linear-gradient(110deg,var(--blue),#1297e8 62%,var(--blue-2)); color:#fff; border-radius:34px; padding:58px; display:grid; grid-template-columns:1fr auto; gap:30px; align-items:center; box-shadow:var(--shadow); overflow:hidden; position:relative; }
.cta-box::after { content:''; position:absolute; width:300px; height:300px; border:50px solid rgba(255,255,255,.08); border-radius:50%; right:-120px; top:-130px; }
.cta-box h2 { position:relative; z-index:1; font-size:clamp(2rem,3.7vw,3.25rem); margin:0; max-width:760px; }
.cta-box .btn { position:relative; z-index:1; }

.site-footer { background:#061f39; color:#fff; padding:48px 0 28px; }
.footer-grid { display:grid; grid-template-columns:1fr auto; gap:30px; align-items:center; padding-bottom:32px; border-bottom:1px solid rgba(255,255,255,.12); }
.footer-brand img { width:170px; filter:brightness(0) invert(1); opacity:.98; }
.footer-brand p { max-width:570px; color:rgba(255,255,255,.64); font-size:.87rem; margin:15px 0 0; }
.footer-contact { display:flex; flex-direction:column; align-items:flex-end; gap:10px; }
.footer-contact a { color:#fff; font-weight:800; text-decoration:none; }
.footer-contact small { color:rgba(255,255,255,.58); }
.footer-bottom { padding-top:24px; display:flex; justify-content:space-between; align-items:center; gap:20px; color:rgba(255,255,255,.55); font-size:.78rem; }
.footer-langs { display:flex; gap:14px; }
.footer-langs a { text-decoration:none; }
.footer-langs a[aria-current='page'] { color:var(--green); font-weight:800; }

.reveal { opacity:0; transform:translateY(18px); transition:opacity .65s ease, transform .65s ease; }
.reveal.in-view { opacity:1; transform:none; }

@media (max-width: 1040px) {
  .nav-menu { display:none; position:absolute; left:20px; right:20px; top:72px; background:#fff; border-radius:18px; padding:18px; box-shadow:var(--shadow); flex-direction:column; align-items:stretch; gap:0; }
  .nav-menu.is-open { display:flex; }
  .nav-menu a { padding:12px; }
  .menu-toggle { display:block; }
  .nav-actions .btn-small { display:none; }
  .hero-grid, .preview-wrap, .about-card { grid-template-columns:1fr; }
  .hero { padding-top:66px; }
  .hero-visual { min-height:490px; }
  .pillars, .how-grid, .pilot { grid-template-columns:repeat(2,1fr); }
  .pilot-step:nth-child(2) { border-right:0; }
  .pilot-step:nth-child(-n+2) { border-bottom:1px solid rgba(11,53,88,.08); }
  .language-inner { grid-template-columns:1fr; padding:52px; }
}
@media (max-width: 760px) {
  .container { width:min(100% - 28px,1180px); }
  .nav-wrap { min-height:72px; gap:12px; }
  .brand img { width:142px; }
  .language-switch a { min-width:29px; padding:5px 6px; font-size:.7rem; }
  h1 { font-size:clamp(2.75rem,13vw,4.3rem); }
  .hero-grid { gap:36px; }
  .hero-visual { min-height:auto; }
  .process-panel { transform:none; }
  .float-card { display:none; }
  .credibility-grid { grid-template-columns:1fr 1fr; }
  .problem-grid, .outcomes, .control-grid { grid-template-columns:1fr; }
  .pillars, .how-grid, .pilot { grid-template-columns:1fr; }
  .pilot-step { border-right:0; border-bottom:1px solid rgba(11,53,88,.08); }
  .pilot-step:last-child { border-bottom:0; }
  .section { padding:72px 0; }
  .language-inner { padding:38px 24px; }
  .language-cloud { grid-template-columns:1fr 1fr; }
  .about-card { padding:28px; }
  .cta-box { grid-template-columns:1fr; padding:38px 28px; }
  .cta-box .btn { justify-self:start; }
  .footer-grid { grid-template-columns:1fr; }
  .footer-contact { align-items:flex-start; }
  .footer-bottom { align-items:flex-start; flex-direction:column; }
}
@media (max-width: 500px) {
  .nav-actions { margin-left:auto; gap:6px; }
  .language-switch a { min-width:25px; padding:4px 5px; font-size:.65rem; }
  .brand img { width:128px; }
  .credibility-grid, .language-cloud { grid-template-columns:1fr; }
  .hero-actions .btn { width:100%; }
  .panel-body { padding:18px; }
  .route-card { grid-template-columns:auto 1fr; }
  .route-card .tag { grid-column:2; justify-self:start; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *, *::before, *::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
  .reveal { opacity:1; transform:none; }
}