:root {
  --fog: #eef0f2;
  --paper: #fbfbfa;
  --white: #fff;
  --ink: #14151a;
  --ink-2: #3f4149;
  --ink-3: #70727c;
  --line: #d9dce1;
  --line-dark: #31333b;
  --coral: #ff6b47;
  --coral-text: #e8542f;
  --coral-deep: #b23a14;
  --coral-soft: #ffe6de;
  --green: #1f9b68;
  --green-deep: #13744a;
  --green-soft: #daf4e7;
  --blue: #3869d4;
  --blue-soft: #e3ebff;
  --amber: #d97b16;
  --display: "Bricolage Grotesque", sans-serif;
  --body: "Hanken Grotesk", sans-serif;
  --deva: "Tiro Devanagari Hindi", serif;
  --max: 1240px;
  --gutter: clamp(20px, 4vw, 64px);
  --radius: 28px;
  --shadow: 0 24px 80px rgba(8, 9, 12, 0.15);
  --ease: cubic-bezier(.2, .8, .2, 1);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--fog); color: var(--ink); font: 400 17px/1.55 var(--body); }
body, button, input { font-family: var(--body); }
a { color: inherit; }
img, svg { display: block; max-width: 100%; }
h1, h2, h3, p, ul, ol { margin: 0; }
ul, ol { padding: 0; list-style: none; }
button, input { font: inherit; }
button { color: inherit; }
:focus-visible { outline: 3px solid var(--coral); outline-offset: 4px; }
.skip-link { position: fixed; top: 12px; left: 12px; z-index: 100; padding: 10px 16px; background: var(--white); border-radius: 8px; transform: translateY(-150%); }
.skip-link:focus { transform: none; }

.site-nav { position: absolute; z-index: 20; top: 0; left: 0; right: 0; height: 88px; display: flex; align-items: center; justify-content: space-between; gap: 28px; padding: 0 var(--gutter); color: var(--white); }
.brand { display: inline-flex; min-height: 44px; align-items: center; gap: 10px; color: inherit; font: 750 1.25rem/1 var(--display); text-decoration: none; }
.brand span { display: grid; width: 34px; height: 34px; place-items: center; border-radius: 11px; background: var(--coral); color: var(--ink); font: 400 1rem/1 var(--deva); }
.site-nav nav { display: flex; gap: 30px; }
.site-nav nav a { color: #c7c9cf; font-weight: 600; text-decoration: none; }
.site-nav nav a:hover { color: var(--white); }
/* Existing customers sign in on the portal's bare-domain login */
.nav-actions { display: flex; align-items: center; gap: 18px; }
.nav-signin { display: inline-flex; min-height: 44px; align-items: center; padding: 0 4px; color: #c7c9cf; font-weight: 600; text-decoration: none; }
.nav-signin:hover { color: var(--white); }

.button { display: inline-flex; min-height: 50px; align-items: center; justify-content: center; border: 0; border-radius: 999px; padding: 13px 22px; font-weight: 700; text-decoration: none; cursor: pointer; transition: transform 180ms var(--ease), box-shadow 180ms var(--ease), background 180ms; }
.button:hover { transform: translateY(-2px); }
.button-coral { background: var(--coral); color: var(--ink); box-shadow: 0 10px 32px rgba(255, 107, 71, 0.26); }
.button-coral:hover { background: #ff7e5d; box-shadow: 0 14px 38px rgba(255, 107, 71, 0.36); }
.button-dark { background: var(--ink); color: var(--white); }
.button-small { min-height: 44px; padding: 9px 18px; font-size: .92rem; }
.button-wide { width: 100%; }
.button-row { display: flex; flex-wrap: wrap; align-items: center; gap: 20px; margin-top: 32px; }
.text-link { display: inline-flex; min-height: 44px; align-items: center; color: #d3d5db; font-weight: 650; text-decoration: none; }
.text-link span { display: inline-block; margin-left: 6px; color: var(--coral); }

.hero { min-height: 900px; padding: 148px var(--gutter) 80px; display: grid; grid-template-columns: minmax(420px, .86fr) minmax(620px, 1.14fr); align-items: center; gap: clamp(24px, 4vw, 74px); background: var(--ink); color: var(--white); overflow: hidden; }
.hero-copy { position: relative; z-index: 3; max-width: 650px; }
.signal { display: inline-flex; align-items: center; gap: 9px; color: #b9bbc4; font-weight: 600; font-size: .92rem; }
.signal span { width: 9px; height: 9px; border-radius: 50%; background: var(--coral); box-shadow: 0 0 0 6px rgba(255, 107, 71, .12); }
.hero h1 { margin-top: 22px; font: 750 clamp(4rem, 6.4vw, 7.3rem)/.86 var(--display); letter-spacing: -.07em; }
.hero h1 em { color: var(--coral); font-style: normal; }
.hero-lede { max-width: 580px; margin-top: 30px; color: #b9bbc4; font-size: clamp(1.08rem, 1.5vw, 1.28rem); }
.offer { max-width: 570px; margin-top: 28px; padding-top: 20px; border-top: 1px solid var(--line-dark); color: #adafb8; font-size: .96rem; }
.offer strong { color: var(--white); }
.trust-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.trust-chips li { padding: 7px 11px; border: 1px solid #343640; border-radius: 999px; color: #bfc1c9; font-size: .78rem; }
.trust-chips li::before { content: "✓"; margin-right: 6px; color: var(--green); }

.hero-scene { position: relative; height: 690px; min-width: 0; isolation: isolate; }
.hero-scene::before { content: ""; position: absolute; inset: 11% 6% 8%; z-index: -2; background: radial-gradient(circle, rgba(255,107,71,.18), transparent 60%); filter: blur(15px); }
.source { position: absolute; z-index: 2; display: flex; align-items: center; gap: 8px; padding: 9px 13px; border: 1px solid #393b45; border-radius: 999px; background: rgba(24,25,31,.85); color: #d5d6dc; font-size: .78rem; font-weight: 650; box-shadow: 0 8px 24px rgba(0,0,0,.2); backdrop-filter: blur(10px); }
.source i { width: 8px; height: 8px; border-radius: 50%; background: var(--coral); box-shadow: 0 0 12px var(--coral); }
.source-a { left: 0; top: 72px; }.source-b { left: 3%; top: 162px; }.source-c { left: 0; top: 258px; }
.source-d { right: 1%; top: 86px; }.source-e { right: -2%; top: 183px; }.source-f { right: 2%; top: 280px; }
.route-lines { position: absolute; inset: 5px 0 auto; width: 100%; height: 650px; z-index: -1; overflow: visible; }
.route-lines path { fill: none; stroke: url(#route); stroke-width: 1.5; stroke-dasharray: 4 8; opacity: .52; }
.lead-chip { position: absolute; z-index: 5; padding: 7px 10px; border-radius: 9px; background: var(--coral); color: var(--ink); font-size: .7rem; font-weight: 700; box-shadow: 0 8px 26px rgba(255,107,71,.32); }
.chip-a { left: 25%; top: 165px; }.chip-b { right: 25%; top: 185px; }.chip-c { left: 24%; top: 270px; }
.hero-dashboard { position: absolute; z-index: 3; left: 12%; right: 12%; top: 235px; min-height: 410px; padding: 18px; border: 1px solid rgba(255,255,255,.1); border-radius: 25px; background: rgba(245,246,247,.98); color: var(--ink); box-shadow: 0 38px 100px rgba(0,0,0,.55); transform: perspective(900px) rotateX(1deg) rotateY(-2deg); }
.dash-bar { display: flex; align-items: center; gap: 10px; padding: 3px 2px 16px; }
.dash-brand { display: grid; width: 30px; height: 30px; place-items: center; border-radius: 9px; background: var(--ink); color: var(--white); font: 400 .8rem var(--deva); }
.live-dot { margin-left: auto; color: var(--green-deep); font-size: .72rem; font-weight: 700; }
.live-dot::before { content: ""; display: inline-block; width: 7px; height: 7px; margin-right: 5px; border-radius: 50%; background: var(--green); }
.dash-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; }
.dash-stats article { padding: 13px; border: 1px solid #e0e2e6; border-radius: 13px; background: var(--white); }
.dash-stats small, .dash-stats span { display: block; color: var(--ink-3); font-size: .66rem; }
.dash-stats strong { display: block; margin: 4px 0; font: 750 1.65rem/1 var(--display); }
.dash-body { margin-top: 11px; padding: 13px; border-radius: 14px; background: var(--white); }
.dash-body > p { display: flex; justify-content: space-between; margin-bottom: 8px; font-size: .75rem; }
.dash-body > p span { color: var(--coral-deep); }
.lead-row { display: grid; grid-template-columns: 32px 1fr auto; gap: 9px; align-items: center; padding: 9px 7px; border-top: 1px solid #edefef; font-size: .72rem; }
.lead-row small { display: block; color: var(--ink-3); }.lead-row em { padding: 3px 7px; border-radius: 99px; background: var(--coral-soft); color: var(--coral-deep); font-size: .62rem; font-style: normal; font-weight: 700; }
.avatar { display: grid; width: 32px; height: 32px; place-items: center; border-radius: 10px; font-size: .65rem; font-weight: 750; }.avatar.coral { background: var(--coral-soft); color: var(--coral-deep); }.avatar.blue { background: var(--blue-soft); color: var(--blue); }.avatar.green { background: var(--green-soft); color: var(--green-deep); }
.outbound { display: flex; gap: 6px; padding-top: 10px; }
.pulse { flex: 1; padding: 7px; border-radius: 8px; background: #e9ebef; color: var(--ink-2); text-align: center; font-size: .6rem; font-weight: 700; }
.followup-toast { position: absolute; z-index: 6; right: 1%; bottom: 0; display: flex; gap: 10px; align-items: center; width: 245px; padding: 12px 14px; border: 1px solid rgba(255,255,255,.16); border-radius: 15px; background: #25272f; box-shadow: 0 20px 50px rgba(0,0,0,.45); }
.followup-toast > span { display: grid; width: 30px; height: 30px; place-items: center; border-radius: 50%; background: var(--green); }
.followup-toast b, .followup-toast small { display: block; }.followup-toast b { font-size: .78rem; }.followup-toast small { color: #aeb0b9; font-size: .66rem; }

/* Scattered tools collapse into the same live workspace. */
.sort { padding: 110px var(--gutter); background: var(--fog); overflow: hidden; }
.sort-inner { max-width: var(--max); margin: 0 auto; }
.sort-captions { display: grid; margin-bottom: 28px; }
.sort-caption { max-width: 22ch; font: 740 clamp(2.1rem, 4.5vw, 4.7rem)/.96 var(--display); letter-spacing: -.05em; }
.caption-after { margin-top: 8px; color: var(--coral-deep); }
.sort-stage { position: relative; display: flex; flex-wrap: wrap; gap: 14px; }
.frag { position: relative; z-index: 4; flex: 0 0 auto; max-width: 240px; }
.frag-in { font-size: .8rem; line-height: 1.35; box-shadow: 0 18px 45px rgba(20,21,26,.2); }
.frag-sheet .frag-in { width: 220px; overflow: hidden; border: 1px solid #cfd8cf; border-radius: 7px; background: var(--white); }
.sheet-bar { padding: 5px 8px; background: #1f7a4a; color: var(--white); font-size: .68rem; }
.sheet { width: 100%; border-collapse: collapse; font-size: .7rem; }.sheet td { height: 22px; padding: 3px 6px; border: 1px solid #e3e7e3; }.sheet-red { color: #b42318; font-weight: 700; }
.frag-note .frag-in { width: 180px; padding: 10px 16px 8px 30px; border-left: 2px solid #f2a7a7; background: #fffdf4 repeating-linear-gradient(transparent 0 23px, #cfe0f5 23px 24px); color: #2a3a8f; font: 1rem/24px cursive; }
.frag-remind .frag-in { width: 210px; display: grid; gap: 2px; padding: 12px 16px; border-radius: 18px; background: rgba(255,255,255,.96); }.frag-remind span { color: var(--amber); font-size: .7rem; font-weight: 700; }
.frag-cal .frag-in { width: 128px; display: grid; overflow: hidden; border-radius: 14px; background: var(--white); text-align: center; }.cal-head { padding: 3px; background: #d94747; color: var(--white); font-weight: 700; }.cal-day { padding-top: 4px; font: 750 2.2rem/1.1 var(--display); }.cal-scrawl { padding: 0 8px 10px; color: #b42318; font: .88rem/1.2 cursive; transform: rotate(-4deg); }
.frag-sticky .frag-in { width: 150px; min-height: 125px; padding: 16px; background: #ffe36e; color: #3b3000; font: 1.1rem/1.25 cursive; }
.frag-wa .frag-in { width: 230px; display: grid; gap: 2px; padding: 8px 12px 6px; border-radius: 12px 12px 12px 2px; background: #dcf8c6; color: #111b21; }.wa-name { color: #13745f; font-size: .72rem; font-weight: 700; }.wa-time { justify-self: end; color: #667781; font-size: .66rem; }
.frag-call .frag-in { width: 190px; display: flex; gap: 12px; align-items: center; padding: 12px 16px; border-radius: 18px; background: var(--ink); color: var(--white); }.call-icon { position: relative; width: 32px; height: 32px; flex: none; border-radius: 50%; background: #d94747; }.call-icon::after { content: ""; position: absolute; inset: 9px; border: 3px solid var(--white); border-top-color: transparent; border-left-color: transparent; border-radius: 50% 50% 0 50%; transform: rotate(45deg); }
.frag-mail .frag-in { width: 220px; display: grid; gap: 2px; padding: 12px 14px; border-radius: 12px; background: var(--white); }.mail-from, .mail-snip { color: var(--ink-3); font-size: .72rem; }.mail-from::before { content: ""; display: inline-block; width: 8px; height: 8px; margin-right: 6px; border-radius: 50%; background: var(--blue); }
.sort-dashboard { position: relative; z-index: 1; flex: 1 1 100%; display: grid; gap: 14px; margin: 0; padding: clamp(17px, 2.5vw, 28px); border: 1px solid var(--line); border-radius: var(--radius); background: var(--paper); box-shadow: var(--shadow); }
.sort-dashboard small { display: block; color: var(--ink-3); }.sort-dash-bar { display: flex; gap: 10px; align-items: center; padding-bottom: 14px; border-bottom: 1px solid var(--line); }.sort-dash-bar > span:nth-child(2) { flex: 1; }.sort-dash-bar em { padding: 4px 8px; border: 1px solid var(--line); border-radius: 99px; color: var(--ink-3); font-size: .68rem; font-style: normal; }
.sort-greeting { display: flex; justify-content: space-between; align-items: center; }.sort-greeting b, .sort-greeting small { display: block; }.sort-greeting b { font: 700 1.4rem var(--display); }.sort-greeting i { padding: 8px 14px; border-radius: 99px; background: var(--coral); font-size: .78rem; font-style: normal; font-weight: 700; }
.sort-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 9px; }.sort-stats article { padding: 13px; border: 1px solid var(--line); border-radius: 13px; background: var(--white); }.sort-stats b { font: 750 1.65rem var(--display); }
.sort-attention { display: grid; gap: 7px; padding: 14px; border-radius: 15px; background: var(--white); }.sort-row { display: flex; gap: 12px; align-items: center; padding: 9px 11px; border-radius: 10px; background: #f0f1f2; }.sort-row > span { padding: 4px 8px; border-radius: 99px; background: var(--coral-soft); color: var(--coral-deep); font-size: .68rem; font-weight: 700; }.sort-row p { flex: 1; font-size: .78rem; }.sort-row b, .sort-row small { display: block; }.sort-row small { color: var(--ink-2); }

.section-wrap { width: min(100%, var(--max)); margin: 0 auto; padding-left: var(--gutter); padding-right: var(--gutter); }
.section-index { color: var(--coral-deep); font-weight: 700; font-size: .8rem; letter-spacing: .03em; }
.section-head { max-width: 800px; }
.section-head h2, .definition h2, .team-grid h2, .trust-grid h2, .faq-intro h2, .demo-copy h2, .destinations h2 { margin-top: 14px; font: 740 clamp(2.7rem, 5.4vw, 5.5rem)/.96 var(--display); letter-spacing: -.055em; }
.section-head > p:last-child { max-width: 650px; margin-top: 22px; color: var(--ink-2); font-size: 1.15rem; }
.section-action { display: flex; justify-content: center; margin-top: 52px; }

.definition { position: relative; min-height: 860px; padding: 120px 0; overflow: hidden; background: var(--coral); isolation: isolate; }
.definition-watermark { position: absolute; inset: 0; z-index: -1; overflow: hidden; pointer-events: none; }
.definition-watermark span { position: absolute; right: -2vw; top: -11vw; color: rgba(20,21,26,.07); font: 400 clamp(14rem, 34vw, 34rem)/1 var(--deva); white-space: nowrap; }
.definition-watermark svg { position: absolute; right: 2%; bottom: 4%; width: 56%; height: auto; opacity: .2; }
.definition-bridge { fill: none; stroke: var(--ink); stroke-width: 4; stroke-linecap: round; stroke-dasharray: 100; }
.definition-layout { display: grid; grid-template-columns: minmax(340px, .8fr) minmax(560px, 1.2fr); gap: clamp(45px, 6vw, 92px); align-items: center; }
.definition-copy { position: relative; z-index: 2; }
.definition .section-index { color: var(--ink); }
.definition-title { max-width: 11ch; margin-top: 18px; }
.definition-title span { position: relative; display: inline-block; }
.motion .definition-title span { color: transparent; -webkit-text-stroke: 1.5px rgba(20,21,26,.72); }
.motion .definition-title span::after { content: attr(data-word); position: absolute; inset: 0 auto 0 0; width: calc(var(--word-fill, 0%) * 1.1); overflow: hidden; color: var(--ink); -webkit-text-stroke: 1.5px var(--ink); white-space: nowrap; }
.definition-text { max-width: 55ch; margin-top: 28px; font-size: 1.12rem; }
.record-scene { position: relative; min-width: 0; height: 580px; margin: 0; }
.record-links { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.record-links path { fill: none; stroke: rgba(20,21,26,.5); stroke-width: 2; stroke-dasharray: 5 8; }
/* Pulses ride the connector paths (see addRecordPulses); only visible while the section is on screen */
.record-pulse { fill: var(--ink); stroke: rgba(20,21,26,.14); stroke-width: 6; paint-order: stroke; opacity: 0; transition: opacity .3s; }
.definition-live .record-pulse { opacity: 1; }
.role-node i { display: none; }
.role-node { position: absolute; z-index: 2; display: flex; min-height: 52px; align-items: center; gap: 9px; padding: 9px 13px; border: 1px solid rgba(20,21,26,.25); border-radius: 14px; background: rgba(255,255,255,.72); box-shadow: 0 12px 32px rgba(94,31,14,.12); backdrop-filter: blur(10px); font-size: .82rem; }
.role-node span { display: grid; width: 28px; height: 28px; place-items: center; border-radius: 50%; background: var(--ink); color: var(--white); font-size: .65rem; }
.role-node i { position: absolute; left: 50%; top: 50%; width: 9px; height: 9px; border-radius: 50%; background: var(--ink); opacity: 0; box-shadow: 0 0 0 5px rgba(20,21,26,.12); }
.role-front { left: 1%; top: 7%; --pulse-x: 205px; --pulse-y: 160px; }
.role-counsellor { right: 1%; top: 7%; --pulse-x: -205px; --pulse-y: 160px; }
.role-manager { left: 1%; bottom: 7%; --pulse-x: 205px; --pulse-y: -160px; }
.role-owner { right: 1%; bottom: 7%; --pulse-x: -205px; --pulse-y: -160px; }
.student-record { position: absolute; z-index: 3; left: 50%; top: 50%; width: min(330px, 54%); padding: 22px; border: 1px solid rgba(20,21,26,.16); border-radius: 24px; background: rgba(251,251,250,.96); box-shadow: 0 32px 80px rgba(94,31,14,.24); transform: translate(-50%, -50%); }
.student-record > p { color: var(--coral-deep); font-size: .72rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.record-person { display: flex; align-items: center; gap: 11px; margin-top: 14px; padding-bottom: 16px; border-bottom: 1px solid var(--line); }
.record-person > span { display: grid; width: 42px; height: 42px; place-items: center; border-radius: 13px; background: var(--coral-soft); color: var(--coral-deep); font-weight: 800; }
.record-person b, .record-person small { display: block; }.record-person small { color: var(--ink-3); font-size: .72rem; }
.record-stage { margin-top: 16px; }.record-stage small, .record-stage strong { display: block; }.record-stage small { color: var(--ink-3); font-size: .7rem; }.record-stage strong { margin-top: 2px; font: 750 1.5rem/1.1 var(--display); }
.record-progress { display: grid; grid-template-columns: repeat(6, 1fr); gap: 5px; margin-top: 15px; }
.record-progress li { height: 5px; overflow: hidden; border-radius: 99px; background: var(--line); color: transparent; font-size: 0; }
.record-progress li.active { background: var(--coral); }
.record-update { display: flex; gap: 10px; align-items: center; margin-top: 17px; padding: 12px; border-radius: 13px; background: var(--fog); }
.record-update > i { width: 9px; height: 9px; flex: 0 0 auto; border-radius: 50%; background: var(--green); }.record-update b, .record-update small { display: block; }.record-update b { font-size: .78rem; }.record-update small { color: var(--ink-3); font-size: .68rem; }
.motion .definition-live .role-node i { animation: record-pulse 2.8s linear infinite; }.motion .definition-live .role-counsellor i { animation-delay: -.7s; }.motion .definition-live .role-manager i { animation-delay: -1.4s; }.motion .definition-live .role-owner i { animation-delay: -2.1s; }

.flow-section { padding: 130px 0; background: var(--paper); }
.flow-map-shell { position: relative; margin-top: 58px; }
.flow-map { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(5, 1fr); gap: 1px; margin: 0; padding: 1px; border-radius: 24px; background: var(--line); overflow: hidden; }
.flow-map::after { content: ""; position: absolute; left: 0; right: 0; top: calc(50% - 1px); height: 2px; background: var(--coral); transform: scaleX(.1); transform-origin: left; transition: transform 500ms var(--ease); pointer-events: none; }
.flow-map li { background: var(--paper); }
.flow-map button { width: 100%; min-height: 126px; display: grid; align-content: center; gap: 3px; padding: 18px; border: 0; background: transparent; text-align: left; cursor: pointer; }
.flow-map button span { color: var(--coral-deep); font-size: .7rem; font-weight: 700; }
.flow-map button b { font: 700 1.05rem var(--display); }
.flow-map button small { color: var(--ink-3); }
.flow-map button:hover, .flow-map button.active { background: var(--ink); color: var(--white); }
.flow-map button:hover span, .flow-map button.active span { color: var(--coral); }
.flow-map button.active small { color: #b6b8c0; }
.flow-particles { position: absolute; z-index: 3; inset: 0; pointer-events: none; overflow: hidden; border-radius: 24px; }.flow-particles i { position: absolute; width: 9px; height: 9px; border: 2px solid var(--paper); border-radius: 50%; background: var(--coral); box-shadow: 0 0 0 5px rgba(255,107,71,.18), 0 0 18px var(--coral); }.flow-particles i:nth-child(1) { left: 2%; top: 24%; }.flow-particles i:nth-child(2) { right: 2%; top: 74%; }.flow-particles i:nth-child(3) { right: 1%; top: 24%; }
.flow-detail { min-height: 310px; display: grid; grid-template-columns: .35fr 1.35fr 1fr; grid-template-rows: auto 1fr; gap: 18px 44px; align-items: start; margin-top: 28px; padding: clamp(26px, 4vw, 52px); border-radius: var(--radius); background: var(--coral-soft); }
.flow-detail > div { grid-row: 1 / span 2; }
.flow-detail > div span { font: 750 clamp(4rem, 7vw, 7rem)/.8 var(--display); color: var(--coral-deep); }
.flow-detail > div p { margin-top: 16px; color: var(--coral-deep); font-weight: 700; }
.flow-detail h3 { font: 700 clamp(2rem, 3.4vw, 3.4rem)/1 var(--display); letter-spacing: -.045em; }
.flow-detail > p { color: var(--ink-2); }
.flow-detail ul { display: flex; flex-wrap: wrap; align-self: end; gap: 8px; }
.flow-detail li { padding: 7px 11px; border: 1px solid #efb4a3; border-radius: 999px; color: var(--coral-deep); font-size: .78rem; font-weight: 650; }

.tour-section { padding: 130px 0; background: var(--ink); color: var(--white); }
.inverted .section-index { color: var(--coral); }.inverted > p:last-child { color: #aeb0b8; }
.tour-tabs { display: flex; gap: 7px; margin-top: 42px; overflow-x: auto; scrollbar-width: none; }
.tour-tabs button { flex: none; min-height: 44px; padding: 9px 17px; border: 1px solid #3a3c45; border-radius: 999px; background: transparent; color: #bfc1c8; font-weight: 650; cursor: pointer; }
.tour-tabs button[aria-selected="true"] { border-color: var(--coral); background: var(--coral); color: var(--ink); }
.tour-panel { grid-template-columns: .7fr 1.3fr; gap: clamp(36px, 6vw, 90px); align-items: center; margin-top: 42px; padding-top: 34px; border-top: 1px solid var(--line-dark); }
.tour-panel.active, body:not(.enhanced) .tour-panel { display: grid; }
.enhanced .tour-panel:not(.active) { display: none; }
.tour-copy > p { color: var(--coral); font-weight: 700; font-size: .82rem; }
.tour-copy h3 { margin-top: 14px; font: 720 clamp(2.2rem, 4vw, 4rem)/.98 var(--display); letter-spacing: -.05em; }
.tour-copy ul { display: grid; gap: 13px; margin-top: 26px; color: #b9bbc3; }
.tour-copy li { display: flex; gap: 10px; }.tour-copy li::before { content: "✓"; color: var(--green); font-weight: 800; }
.product-window { min-height: 420px; padding: 20px; border: 1px solid #dedfe3; border-radius: 24px; background: #f5f5f3; color: var(--ink); box-shadow: 0 35px 100px rgba(0,0,0,.35); }
.window-bar { display: flex; align-items: center; gap: 6px; padding-bottom: 17px; color: var(--ink-2); font-size: .78rem; }.window-bar i { width: 8px; height: 8px; border-radius: 50%; background: #c7c9ce; }.window-bar span { margin-left: 6px; }
.profile-head { display: flex; align-items: center; gap: 12px; padding: 16px; border-radius: 15px; background: var(--white); }.profile-head > span:nth-child(2) { flex: 1; }.profile-head small { display: block; color: var(--ink-3); }.profile-head em { padding: 5px 9px; border-radius: 99px; background: var(--blue-soft); color: var(--blue); font-size: .72rem; font-style: normal; font-weight: 700; }
.quick-actions { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin: 12px 0; }.quick-actions span { padding: 9px; border: 1px solid var(--line); border-radius: 10px; background: var(--white); text-align: center; font-size: .73rem; font-weight: 700; }
.activity { display: grid; gap: 1px; padding: 14px; border-radius: 15px; background: var(--white); }.activity li { display: flex; gap: 12px; padding: 11px 4px; border-bottom: 1px solid #eee; }.activity li:last-child { border: 0; }.activity i { width: 10px; height: 10px; margin-top: 6px; border-radius: 50%; background: var(--coral); }.activity small { display: block; color: var(--ink-3); }
.application-board { display: grid; align-content: start; gap: 12px; }.application-board article { display: grid; grid-template-columns: 1fr auto; gap: 14px; padding: 19px; border-radius: 15px; background: var(--white); }.application-board small { display: block; color: var(--ink-3); }.application-board article > span { padding: 5px 9px; border-radius: 99px; background: var(--blue-soft); color: var(--blue); font-size: .7rem; font-weight: 700; }.application-board .green-status { background: var(--green-soft); color: var(--green-deep); }.application-board strong { font-size: .78rem; }.application-board progress { width: 100%; accent-color: var(--coral); }
.campaign-summary, .owner-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; margin-bottom: 16px; }.campaign-summary > span, .owner-cards article { padding: 15px; border-radius: 13px; background: var(--white); }.campaign-summary small, .campaign-summary b, .owner-cards small, .owner-cards b { display: block; }.campaign-summary small, .owner-cards small { color: var(--ink-3); font-size: .7rem; }.delivery-row { display: grid; grid-template-columns: 100px 1fr auto; align-items: center; gap: 14px; padding: 15px; border-top: 1px solid var(--line); background: var(--white); }.delivery-row:first-of-type { border-radius: 14px 14px 0 0; }.delivery-row:last-child { border-radius: 0 0 14px 14px; }.delivery-row i { height: 8px; border-radius: 99px; background: linear-gradient(90deg, var(--green) 88%, var(--line) 88%); }.delivery-row b { color: var(--green-deep); font-size: .75rem; }
.task-columns { display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; }.task-columns section { min-height: 310px; padding: 14px; border-radius: 14px; background: #e8e9eb; }.task-columns section > b { font-size: .78rem; }.task-columns p { margin-top: 12px; padding: 12px; border-radius: 10px; background: var(--white); font-size: .8rem; font-weight: 650; box-shadow: 0 5px 15px rgba(0,0,0,.05); }.task-columns small { display: block; color: var(--ink-3); font-weight: 400; }
.source-bars { padding: 18px; border-radius: 15px; background: var(--white); }.source-bars p { display: grid; grid-template-columns: 110px 1fr; gap: 14px; align-items: center; margin: 16px 0; font-size: .8rem; }.source-bars i { height: 12px; width: var(--bar); border-radius: 99px; background: var(--coral); }
.role-links { display: flex; flex-wrap: wrap; gap: 4px 16px; align-items: center; margin-top: 34px; color: #a9abb4; font-size: .88rem; }.role-links a { display: inline-flex; min-height: 44px; align-items: center; color: var(--white); font-weight: 650; text-underline-offset: 4px; }.share-status { min-height: 24px; color: var(--green); font-size: .82rem; }

.compare-section { padding: 130px 0; background: var(--fog); }
.comparison { margin-top: 50px; border-radius: 22px; overflow: hidden; background: var(--white); box-shadow: 0 18px 60px rgba(18,20,25,.07); }
.comparison > div { display: grid; grid-template-columns: .65fr 1fr 1fr; gap: 24px; padding: 20px 28px; border-bottom: 1px solid var(--line); }.comparison > div:last-child { border: 0; }.comparison-head { background: var(--ink); color: var(--white); font-weight: 700; }.comparison div > span { color: var(--ink-3); }.comparison div > strong { color: var(--green-deep); }.comparison div > strong::before { content: "✓"; margin-right: 8px; }
.migration-card { display: grid; grid-template-columns: auto 1fr auto; gap: 22px; align-items: center; margin-top: 28px; padding: 28px; border-radius: 22px; background: var(--coral); }.migration-card > span { display: grid; width: 54px; height: 54px; place-items: center; border: 2px solid var(--ink); border-radius: 50%; font-size: 1.7rem; }.migration-card h3 { font: 700 1.55rem var(--display); }.migration-card p { max-width: 650px; }

.destinations { padding: 110px 0; background: var(--paper); overflow: hidden; }
.destinations-inner { display: grid; grid-template-columns: .85fr 1.15fr; gap: 80px; align-items: center; }.destinations h2 { font-size: clamp(2.6rem, 4.6vw, 4.7rem); }.destinations ul { display: grid; grid-template-columns: 1fr 1fr; gap: 0 36px; }.destinations li { position: relative; padding: 15px 0 15px 24px; border-bottom: 1px solid var(--line); font: 650 1.1rem var(--display); }.destinations li::before { content: ""; position: absolute; left: 0; top: 23px; width: 8px; height: 8px; border-radius: 50%; background: var(--coral); }

.team-section { padding: 130px 0; background: var(--coral-soft); }.team-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 90px; align-items: center; }.team-grid h2 { font-size: clamp(2.8rem, 5vw, 5rem); }.team-grid > div > p:last-child { max-width: 55ch; margin-top: 24px; color: var(--ink-2); }.role-stack { display: grid; gap: 9px; }.role-stack article { display: flex; gap: 18px; align-items: center; padding: 20px; border-radius: 15px; background: var(--paper); transition: transform 200ms var(--ease); }.role-stack article:hover { transform: translateX(-8px); }.role-stack article > span { color: var(--coral-deep); font-weight: 700; }.role-stack b, .role-stack small { display: block; }.role-stack b { font: 700 1.2rem var(--display); }.role-stack small { color: var(--ink-3); }

.trust-section { padding: 130px 0; background: var(--ink); color: var(--white); }.trust-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(48px, 8vw, 120px); align-items: start; }.trust-grid .section-index { color: var(--coral); }.trust-grid h2 { font-size: clamp(2.8rem, 5vw, 5.2rem); }.trust-grid > div > p:last-child { max-width: 48ch; margin-top: 24px; color: #b4b6bf; }.trust-list { border-top: 1px solid var(--line-dark); }.trust-list li { display: grid; grid-template-columns: 42px 1fr; gap: 18px; padding: 22px 0; border-bottom: 1px solid var(--line-dark); }.trust-list li > span { color: var(--coral); font-size: .78rem; font-weight: 700; }.trust-list b { font: 700 1.2rem var(--display); }.trust-list p { margin-top: 5px; color: #aeb0b8; }

.faq-section { padding: 130px 0; background: var(--paper); }.faq-grid { display: grid; grid-template-columns: .7fr 1.3fr; gap: 90px; align-items: start; }.faq-intro { position: sticky; top: 30px; }.faq-intro h2 { font-size: clamp(2.8rem, 4.5vw, 4.7rem); }.faq-intro > p:last-child { margin-top: 24px; color: var(--ink-2); }.faq-intro a { text-underline-offset: 4px; }.faq-list { border-top: 1px solid var(--line); }.faq-list details { border-bottom: 1px solid var(--line); }.faq-list summary { position: relative; padding: 23px 48px 23px 0; font: 650 1.1rem/1.3 var(--display); cursor: pointer; list-style: none; }.faq-list summary::-webkit-details-marker { display: none; }.faq-list summary::after { content: "+"; position: absolute; right: 6px; top: 20px; font: 400 1.6rem var(--body); }.faq-list details[open] summary::after { content: "−"; }.faq-list details p { max-width: 68ch; padding: 0 46px 24px 0; color: var(--ink-2); }

.demo-section { padding: 130px 0; background: var(--ink); color: var(--white); }.demo-grid { display: grid; grid-template-columns: .85fr 1.15fr; gap: clamp(50px, 8vw, 120px); align-items: start; }.demo-copy .section-index { color: var(--coral); }.demo-copy h2 { font-size: clamp(3.2rem, 6vw, 6.2rem); }.demo-copy > p:not(.section-index) { max-width: 48ch; margin-top: 24px; color: #b4b6bf; }.demo-copy ul { display: grid; gap: 10px; margin-top: 30px; }.demo-copy li::before { content: "✓"; margin-right: 10px; color: var(--green); font-weight: 800; }
.demo-form { display: grid; gap: 17px; padding: clamp(24px, 4vw, 42px); border: 1px solid #343640; border-radius: var(--radius); background: #1d1f25; }.field-group { display: grid; gap: 7px; }.field-group label { color: #c9cbd2; font-size: .85rem; font-weight: 650; }.field-group input { width: 100%; min-height: 51px; padding: 11px 14px; border: 1px solid #444650; border-radius: 11px; background: #15161b; color: var(--white); }.field-group input:focus { border-color: var(--coral); outline: 2px solid rgba(255,107,71,.28); }.split { grid-template-columns: 1fr 1fr; gap: 14px; }.split > div { display: grid; gap: 7px; }.email-fallback { display: inline-flex; min-height: 44px; align-items: center; justify-self: center; border: 0; background: none; color: #c6c8d0; text-decoration: underline; text-underline-offset: 4px; cursor: pointer; }.form-note { color: #8f919a; text-align: center; font-size: .78rem; }.form-status { min-height: 22px; color: #ffaf9b; font-size: .85rem; }

.mobile-cta { display: none; }

.motion .scene-playing .route-lines path { animation: route-flow 3s linear infinite; }
.motion .scene-playing .lead-chip { animation: chip-float 3s var(--ease) infinite; }.motion .scene-playing .chip-b { animation-delay: -1s; }.motion .scene-playing .chip-c { animation-delay: -2s; }
.motion .scene-playing .live-dot::before { animation: live-pulse 1.6s ease-out infinite; }
.motion .scene-playing .lead-row-new { animation: row-glow 4s ease-in-out infinite; }
.motion .scene-playing .source i { animation: live-pulse 1.8s ease-out infinite; }
.motion .flow-live .flow-particles i:nth-child(1) { animation: flow-top 5.2s linear infinite; }.motion .flow-live .flow-particles i:nth-child(2) { animation: flow-bottom 6.1s linear infinite; }.motion .flow-live .flow-particles i:nth-child(3) { animation: flow-turn 4.4s linear infinite; }
@keyframes route-flow { to { stroke-dashoffset: -48; } }
@keyframes chip-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }
@keyframes live-pulse { 0% { box-shadow: 0 0 0 0 rgba(31,155,104,.55); } 100% { box-shadow: 0 0 0 9px rgba(31,155,104,0); } }
@keyframes record-pulse { 0% { opacity: 0; transform: translate(0, 0) scale(.5); } 12%, 78% { opacity: 1; } 100% { opacity: 0; transform: translate(var(--pulse-x), var(--pulse-y)) scale(1); } }
@keyframes row-glow { 0%, 55%, 100% { background: transparent; } 65%, 85% { background: var(--coral-soft); } }
@keyframes flow-top { from { left: 2%; } to { left: 97%; } }
@keyframes flow-bottom { from { right: 2%; } to { right: 97%; } }
@keyframes flow-turn { 0%, 45% { top: 24%; opacity: 0; } 50% { opacity: 1; } 95%, 100% { top: 74%; opacity: 0; } }

/* Motion mode pins the transformation on wide screens and scrubs it on phones. */
.motion .sort { padding: 0 var(--gutter); }
.motion .sort-inner { min-height: 100vh; min-height: 100svh; display: grid; align-content: center; padding: 90px 0 30px; }
.motion .sort-caption { grid-area: 1 / 1; }.motion .caption-after { margin-top: 0; }.motion .sort-stage { display: block; }
.motion .frag { position: absolute; z-index: 5; will-change: transform; }.motion .frag-sheet { left: 1%; top: -4%; }.motion .frag-note { left: 29%; top: -7%; }.motion .frag-remind { left: 55%; top: 5%; }.motion .frag-cal { left: 84%; top: -3%; }.motion .frag-sticky { left: 4%; top: 50%; }.motion .frag-wa { left: 32%; top: 43%; }.motion .frag-call { left: 62%; top: 60%; }.motion .frag-mail { left: 78%; top: 35%; }
.motion .frag-sheet .frag-in { transform: rotate(-6deg); }.motion .frag-note .frag-in { transform: rotate(4deg); }.motion .frag-remind .frag-in { transform: rotate(-3deg); }.motion .frag-cal .frag-in { transform: rotate(8deg); }.motion .frag-sticky .frag-in { transform: rotate(5deg); }.motion .frag-wa .frag-in { transform: rotate(-4deg); }.motion .frag-call .frag-in { transform: rotate(3deg); }.motion .frag-mail .frag-in { transform: rotate(-7deg); }
.motion .frag-in { opacity: 0; }

/* Footer: brand + link columns, then a thin legal bar */
.site-footer { background: var(--ink); color: #9698a2; border-top: 1px solid var(--line-dark); padding: 64px var(--gutter) 28px; }
.footer-top { max-width: 1180px; margin: 0 auto; display: grid; grid-template-columns: 1.2fr 2fr; gap: 48px; }
.footer-brand .brand { color: var(--white); }
.footer-brand p { margin-top: 14px; max-width: 34ch; }
.footer-links { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; }
.footer-links div { display: grid; gap: 10px; align-content: start; }
.footer-links h3 { margin: 0 0 4px; color: var(--white); font-size: .95rem; letter-spacing: 0; }
.footer-links a { color: #b5b7c0; text-decoration: none; font-size: .95rem; overflow-wrap: anywhere; }
.footer-links a:hover { color: var(--white); }
.footer-bottom { max-width: 1180px; margin: 48px auto 0; padding-top: 22px; border-top: 1px solid var(--line-dark); display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 24px; }
@media (max-width: 900px) { .footer-top { grid-template-columns: 1fr; gap: 36px; } }
@media (max-width: 640px) { .footer-links { grid-template-columns: 1fr 1fr; } .footer-links div:nth-child(2) { grid-column: 1 / -1; order: 3; } .footer-bottom { flex-direction: column; } }

@media (max-width: 1100px) {
  .hero { min-height: 820px; grid-template-columns: .9fr 1.1fr; }.hero-scene { height: 610px; }.source { font-size: .68rem; }.hero-dashboard { left: 7%; right: 7%; top: 220px; }.route-lines { top: -15px; }.definition-layout { grid-template-columns: .75fr 1.25fr; gap: 30px; }.record-scene { height: 540px; }.flow-detail { grid-template-columns: .35fr 1.65fr; }.flow-detail > p, .flow-detail > ul { grid-column: 2; }.tour-panel { grid-template-columns: .8fr 1.2fr; }}

@media (max-width: 900px) {
  .site-nav nav { display: none; }.hero { min-height: auto; grid-template-columns: 1fr; padding-top: 130px; }.hero-copy { max-width: 760px; }.hero-scene { width: min(100%, 760px); height: 660px; margin: 0 auto; }.definition-layout, .destinations-inner, .team-grid, .trust-grid, .faq-grid, .demo-grid { grid-template-columns: 1fr; gap: 50px; }.definition-title { max-width: 13ch; }.record-scene { width: min(100%, 700px); margin: 0 auto; }.flow-map { grid-template-columns: repeat(2, 1fr); }.flow-map::after { display: none; }.tour-panel, body:not(.enhanced) .tour-panel { grid-template-columns: 1fr; }.tour-copy { max-width: 650px; }.faq-intro { position: static; }.comparison { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; overscroll-behavior-inline: contain; }.comparison > div { min-width: 0; grid-template-columns: .55fr 1fr 1fr; gap: 14px; padding: 18px; }}

@media (max-width: 640px) {
  body { font-size: 16px; padding-bottom: 72px; }.site-nav { height: 72px; }.site-nav > .button { display: none; }.hero { padding: 112px 20px 60px; }.hero h1 { font-size: clamp(3.5rem, 17vw, 5.2rem); }.hero-lede { margin-top: 24px; }.text-link { width: 100%; }.hero-scene { height: 520px; margin-top: 10px; }.source { padding: 7px 9px; }.source-a { left: 0; top: 55px; }.source-b { left: 2%; top: 112px; }.source-c { left: 0; top: 170px; }.source-d { right: 0; top: 62px; }.source-e { right: 0; top: 120px; }.source-f { right: 2%; top: 178px; }.route-lines { top: -65px; }.lead-chip { display: none; }.hero-dashboard { left: 1%; right: 1%; top: 225px; min-height: 280px; padding: 11px; transform: none; }.dash-stats article { padding: 9px; }.dash-stats strong { font-size: 1.25rem; }.dash-body { padding: 8px; }.lead-row { padding: 7px 4px; }.lead-row:nth-of-type(4) { display: none; }.outbound { display: none; }.followup-toast { right: 0; bottom: -20px; width: 220px; }.trust-chips { display: none; }.definition, .sort, .flow-section, .tour-section, .compare-section, .destinations, .team-section, .trust-section, .faq-section, .demo-section { padding-top: 88px; padding-bottom: 88px; }.definition { min-height: 0; }.definition-layout { gap: 30px; }.definition h2, .section-head h2, .team-grid h2, .trust-grid h2, .faq-intro h2, .demo-copy h2, .destinations h2 { font-size: clamp(2.5rem, 12vw, 4rem); }.definition-text { font-size: 1rem; }.definition-watermark span { top: 20%; right: -10%; }.record-scene { height: 500px; }.role-node { min-height: 46px; padding: 7px 9px; font-size: .72rem; }.role-front { left: 0; top: 2%; --pulse-x: 100px; --pulse-y: 150px; }.role-counsellor { right: 0; top: 2%; --pulse-x: -100px; --pulse-y: 150px; }.role-manager { left: 0; bottom: 2%; --pulse-x: 100px; --pulse-y: -150px; }.role-owner { right: 0; bottom: 2%; --pulse-x: -100px; --pulse-y: -150px; }.student-record { width: 82%; padding: 18px; }.record-links { opacity: .75; }.sort-stats { grid-template-columns: 1fr 1fr; }.sort-row { align-items: flex-start; }.flow-map { grid-template-columns: 1fr 1fr; border-radius: 16px; }.flow-map button { min-height: 104px; padding: 14px; }.flow-detail { grid-template-columns: 1fr; min-height: 0; }.flow-detail > div { grid-row: auto; }.flow-detail > p, .flow-detail > ul { grid-column: auto; }.flow-detail > div span { font-size: 4rem; }.flow-detail h3 { font-size: 2rem; }.tour-tabs { margin-left: calc(-1 * var(--gutter)); margin-right: calc(-1 * var(--gutter)); padding: 0 var(--gutter); }.product-window { min-height: 0; padding: 12px; border-radius: 17px; }.quick-actions { grid-template-columns: 1fr 1fr; }.profile-head { align-items: flex-start; }.profile-head em { display: none; }.campaign-summary, .owner-cards { grid-template-columns: 1fr; }.task-columns { grid-template-columns: 1fr; }.task-columns section { min-height: 0; }.comparison { background: transparent; box-shadow: none; overflow: visible; }.comparison > div { min-width: 0; grid-template-columns: 1fr; gap: 8px; margin-bottom: 12px; padding: 20px; border: 0; border-radius: 15px; background: var(--white); }.comparison .comparison-head { display: none; }.comparison div > span::before { content: "Sheets + chats: "; color: var(--ink); font-weight: 700; }.comparison div > strong::before { content: "Setu: ✓ "; }.migration-card { grid-template-columns: 1fr; }.migration-card > span { display: none; }.destinations ul { grid-template-columns: 1fr; }.role-stack article:hover { transform: none; }.split { grid-template-columns: 1fr 1fr; }.mobile-cta { position: fixed; z-index: 50; left: 0; right: 0; bottom: 0; display: block; padding: 9px 12px; background: rgba(20,21,26,.92); backdrop-filter: blur(12px); }.mobile-cta .button { width: 100%; min-height: 48px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* Definition section, stacked layouts: no arc crossing the copy, calmer headline on phones */
@media (max-width: 900px) { .definition-watermark svg { display: none; } }
@media (max-width: 640px) { .definition .definition-title { font-size: clamp(2.5rem, 11.5vw, 3.4rem); max-width: none; } }