/* =========================================================
   KT INDIA
   COMPLETE STYLE.CSS
========================================================= */


/* =========================================================
   RESET
========================================================= */

*,
*::before,
*::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    scroll-behavior: smooth;
    scroll-padding-top: 90px;
}

body {
    min-height: 100vh;
    overflow-x: hidden;

    font-family:
        "Segoe UI",
        Inter,
        Arial,
        Helvetica,
        sans-serif;

    font-size: 17px;
    line-height: 1.7;

    color: var(--text-primary);
    background: var(--bg-primary);

    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;

    transition:
        background 0.3s ease,
        color 0.3s ease;
}

img {
    display: block;
    max-width: 100%;
}

button,
input,
select,
textarea {
    font: inherit;
}

button {
    color: inherit;
}

a {
    color: inherit;
}

address {
    font-style: normal;
}

::selection {
    color: white;
    background: var(--violet);
}


/* =========================================================
   VARIABLES
========================================================= */

:root {

    --bg-primary: #050713;
    --bg-secondary: #090d1b;
    --bg-tertiary: #0d1324;

    --card:
        rgba(12, 18, 34, 0.76);

    --card-solid:
        rgba(10, 15, 31, 0.97);

    --text-primary: #f6f9ff;
    --text-secondary: #b2bdd0;
    --text-muted: #7d899f;

    --border:
        rgba(255,255,255,0.095);

    --border-strong:
        rgba(255,255,255,0.17);

    --cyan: #2fd2ff;
    --blue: #5a96ff;
    --violet: #8a5cff;
    --magenta: #d416ff;

    --gradient:
        linear-gradient(
            100deg,
            #2fd2ff 0%,
            #5c96ff 32%,
            #8a5cff 61%,
            #d416ff 100%
        );

    --header:
        rgba(5,7,19,0.82);

    --shadow:
        0 28px 80px
        rgba(0,0,0,0.28);

    --shadow-large:
        0 45px 130px
        rgba(0,0,0,0.38);

    --radius: 20px;

    --container:
        min(92%, 1450px);

}


/* LIGHT MODE */

html[data-theme="light"] {

    --bg-primary: #f8faff;
    --bg-secondary: #f0f4fa;
    --bg-tertiary: #e8eef8;

    --card:
        rgba(255,255,255,0.88);

    --card-solid:
        rgba(255,255,255,0.98);

    --text-primary: #11192a;
    --text-secondary: #526078;
    --text-muted: #718098;

    --border:
        rgba(20,35,65,0.11);

    --border-strong:
        rgba(20,35,65,0.20);

    --header:
        rgba(248,250,255,0.87);

    --shadow:
        0 25px 70px
        rgba(38,55,85,0.10);

    --shadow-large:
        0 40px 100px
        rgba(38,55,85,0.14);

}


/* =========================================================
   GLOBAL
========================================================= */

.container {
    position: relative;
    z-index: 5;

    width: var(--container);
    margin: auto;
}

.section {
    position: relative;

    padding: 125px 0;

    border-top:
        1px solid var(--border);

    overflow: hidden;
}

.section-grid,
.grid-background {

    position: absolute;

    inset: 0;

    pointer-events: none;

    opacity: 0.06;

    background-image:
        linear-gradient(
            var(--border) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            var(--border) 1px,
            transparent 1px
        );

    background-size:
        95px 95px;
}

/* Smooth color movement for the TECHNOLOGY headline only. */
@media (prefers-reduced-motion: no-preference) {
    .hero-title .hero-technology {
        background-size: 200% 100%;
        animation: technology-color-flow 5s ease-in-out infinite alternate;
    }
}

@keyframes technology-color-flow {
    from { background-position: 0% 50%; }
    to { background-position: 100% 50%; }
}

.gradient-text,
.gradient-text-inline {

    background: var(--gradient);

    -webkit-background-clip: text;
    background-clip: text;

    color: transparent;
}

p {
    color: var(--text-secondary);
    font-size: 1rem;
    line-height: 1.85;
}

.section-heading {

    display: grid;

    grid-template-columns:
        55px 1fr;

    gap: 20px;

    align-items: start;

    margin-bottom: 80px;
}

.section-number {

    padding-top: 8px;

    color: var(--violet);

    font-size: 0.88rem;
    font-weight: 800;
    letter-spacing: 0.08em;
}

.section-eyebrow {

    display: block;

    margin-bottom: 12px;

    color: var(--text-muted);

    font-size: 0.875rem;
    font-weight: 750;
    letter-spacing: 0.15em;
}

.section-heading h2 {

    font-size:
        clamp(2.8rem, 5vw, 5.2rem);

    line-height: 0.96;

    letter-spacing: -0.055em;
}

.large-heading {

    font-size:
        clamp(2.8rem, 5vw, 5rem);

    line-height: 0.97;

    letter-spacing: -0.055em;
}

.large-heading span {

    background: var(--gradient);

    -webkit-background-clip: text;
    background-clip: text;

    color: transparent;
}

.display-heading {

    font-size:
        clamp(3.3rem, 6vw, 6.6rem);

    line-height: 0.88;

    letter-spacing: -0.065em;
}

.display-heading span {

    background: var(--gradient);

    -webkit-background-clip: text;
    background-clip: text;

    color: transparent;
}

.subsection {

    padding: 105px 0;

    border-top:
        1px solid var(--border);
}

.subsection-description {

    max-width: 730px;

    margin-top: 22px;
}


/* =========================================================
   HEADER
========================================================= */

.site-header {

    position: fixed;

    z-index: 20000;

    top: 0;
    left: 0;

    width: 100%;

    border-bottom:
        1px solid var(--border);

    background: var(--header);

    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
}

.navbar {

    width: 94%;
    max-width: 1600px;

    min-height: 78px;

    margin: auto;

    display: flex;

    align-items: center;

    gap: 28px;
}

.brand {

    flex-shrink: 0;

    display: flex;

    align-items: center;

    gap: 11px;

    text-decoration: none;
}

.brand-logo {

    width: 44px;
    height: 44px;

    object-fit: contain;
}

.brand-info {

    display: flex;
    flex-direction: column;
}

.brand-short {

    font-size: 0.94rem;
    letter-spacing: 0.08em;
}

.brand-full {

    margin-top: 3px;

    color: var(--text-muted);

    font-size: 0.875rem;
    letter-spacing: 0.06em;
}

.nav-menu {

    flex: 1;

    display: flex;

    justify-content: center;

    align-items: center;

    gap:
        clamp(12px, 1.3vw, 24px);
}

.nav-link {

    position: relative;

    padding: 29px 0;

    color: var(--text-secondary);

    text-decoration: none;

    white-space: nowrap;

    font-size: 0.875rem;

    font-weight: 750;

    letter-spacing: 0.055em;

    transition: color 0.2s ease;
}

.nav-link::after {

    content: "";

    position: absolute;

    left: 50%;
    bottom: 19px;

    width: 0;
    height: 2px;

    transform: translateX(-50%);

    background: var(--gradient);

    transition: width 0.2s ease;
}

.nav-link:hover,
.nav-link.active {

    color: var(--text-primary);
}

.nav-link:hover::after,
.nav-link.active::after {

    width: 100%;
}

.nav-controls {

    display: flex;

    gap: 9px;

    flex-shrink: 0;
}

.theme-toggle,
.menu-toggle {

    width: 43px;
    height: 43px;

    border:
        1px solid var(--border);

    border-radius: 11px;

    background: var(--card);

    cursor: pointer;
}

.theme-toggle {

    font-size: 1.05rem;
}

.menu-toggle {

    display: none;

    padding: 10px;
}

.menu-toggle span {

    display: block;

    width: 100%;
    height: 2px;

    margin: 5px 0;

    background: var(--text-primary);
}


/* =========================================================
   BUTTONS
========================================================= */

.btn {

    min-height: 54px;

    padding: 0 23px;

    border-radius: 9px;

    border:
        1px solid transparent;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 22px;

    text-decoration: none;

    cursor: pointer;

    font-size: 0.875rem;
    font-weight: 750;
    letter-spacing: 0.06em;

    transition:
        transform 0.25s ease,
        border-color 0.25s ease,
        box-shadow 0.25s ease;
}

.btn-primary {

    color: white;

    background: var(--gradient);

    box-shadow:
        0 14px 38px
        rgba(138,92,255,0.17);
}

.btn-primary:hover {

    transform: translateY(-3px);

    box-shadow:
        0 20px 50px
        rgba(138,92,255,0.28);
}

.btn-secondary {

    color: var(--text-primary);

    border-color: var(--border-strong);

    background: var(--card);
}

.btn-secondary:hover {

    transform: translateY(-3px);

    border-color: var(--violet);
}


/* =========================================================
   HERO
========================================================= */

.hero {

    position: relative;

    min-height: 100vh;

    padding:
        140px 0 0;

    overflow: hidden;
}

.hero-orb {

    position: absolute;

    width: 650px;
    height: 650px;

    border-radius: 50%;

    filter: blur(180px);

    opacity: 0.1;
}

.orb-left {

    left: -430px;
    top: 60px;

    background: var(--cyan);
}

.orb-right {

    right: -410px;
    top: 70px;

    background: var(--magenta);
}

.hero-container {

    position: relative;

    z-index: 5;

    width: var(--container);

    margin: auto;

    padding-bottom: 80px;

    display: grid;

    grid-template-columns:
        1fr 0.95fr;

    gap: 70px;

    align-items: center;
}

.company-label {

    width: fit-content;

    margin-bottom: 23px;

    padding: 9px 13px;

    border:
        1px solid var(--border);

    border-radius: 100px;

    display: inline-flex;

    align-items: center;

    gap: 9px;

    color: var(--text-secondary);

    background: var(--card);

    font-size: 0.875rem;
    font-weight: 750;
    letter-spacing: 0.08em;
}

.label-dot {

    width: 8px;
    height: 8px;

    border-radius: 50%;

    background: var(--cyan);

    box-shadow:
        0 0 12px
        var(--cyan);
}

.hero-title {

    max-width: 780px;

    font-size:
        clamp(3.8rem, 6.7vw, 7.3rem);

    line-height: 0.88;

    letter-spacing: -0.065em;
}

.hero-title > span {
    display: inline-block;
}

.hero-for {

    display: block !important;

    margin-top: 12px;

    color: var(--text-secondary);

    font-size: 0.42em;

    letter-spacing: -0.02em;
}

.hero-title > .hero-word-slot {
    display: block;
    position: relative;
    width: 100%;
    height: 1.1em;
}

.hero-word-slot > .hero-rotating-word {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    min-width: 0;
}

.hero-rotating-word {

    min-width: 4.8em;

    transition:
        opacity 0.2s ease,
        transform 0.2s ease;
}

.hero-dot {

    color: var(--magenta);
}

.tagline {

    margin-top: 27px;

    color: var(--text-primary);

    font-size: 0.9rem;

    font-weight: 750;

    letter-spacing: 0.11em;
}

.tagline span {
    color: var(--violet);
}

.hero-description {

    max-width: 680px;

    margin-top: 21px;

    font-size: 1.05rem;
}

.hero-actions {

    margin-top: 32px;

    display: flex;

    flex-wrap: wrap;

    gap: 11px;
}

.hero-mini-stats {

    margin-top: 40px;

    display: grid;

    grid-template-columns:
        repeat(4, 1fr);

    border-top:
        1px solid var(--border);

    border-left:
        1px solid var(--border);
}

.hero-mini-stats > div {

    min-height: 98px;

    padding: 18px;

    border-right:
        1px solid var(--border);

    border-bottom:
        1px solid var(--border);
}

.hero-mini-stats strong {

    display: block;

    font-size: 1.6rem;

    line-height: 1;

    background: var(--gradient);

    -webkit-background-clip: text;
    background-clip: text;

    color: transparent;
}

.hero-mini-stats span {

    display: block;

    margin-top: 8px;

    color: var(--text-muted);

    font-size: 0.875rem;
    line-height: 1.45;

    letter-spacing: 0.04em;
}


/* =========================================================
   HERO TECHNOLOGY OPERATING SYSTEM
========================================================= */

.hero-intelligence-visual {

    position: relative;

    min-height: 650px;

    display: flex;

    align-items: center;

    justify-content: center;
}

.hero-intelligence-visual::before {

    content: "";

    position: absolute;

    width: 520px;
    height: 520px;

    border-radius: 50%;

    filter: blur(35px);

    background:
        radial-gradient(
            circle,
            rgba(138,92,255,0.15),
            rgba(47,210,255,0.045) 43%,
            transparent 70%
        );
}

.intel-console {

    position: relative;

    z-index: 5;

    width: 100%;

    max-width: 720px;
    --text-secondary: #d3dced;
    --text-muted: #b8c6dc;
    --border: rgba(180, 202, 235, 0.25);
    --border-strong: rgba(180, 202, 235, 0.42);
    --violet: #b89aff;

    border:
        1px solid var(--border-strong);

    border-radius: 24px;

    overflow: hidden;

    background:
        linear-gradient(
            145deg,
            rgba(47,210,255,0.035),
            transparent 35%
        ),
        linear-gradient(
            315deg,
            rgba(212,22,255,0.055),
            transparent 38%
        ),
        var(--card-solid);

    box-shadow: var(--shadow-large);
}

.intel-console::before {

    content: "";

    position: absolute;

    inset: 0;

    opacity: 0.12;

    pointer-events: none;

    background-image:
        linear-gradient(
            var(--border) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            var(--border) 1px,
            transparent 1px
        );

    background-size:
        34px 34px;
}

.intel-console-top,
.intel-console-id,
.intel-pipeline,
.intel-program-area,
.intel-signal-area,
.intel-console-footer {

    position: relative;

    z-index: 4;
}

.intel-console-top {

    min-height: 58px;

    padding: 0 22px;

    border-bottom:
        1px solid var(--border);

    display: flex;

    align-items: center;

    justify-content: space-between;
}

.intel-system-name {

    display: flex;

    align-items: center;

    gap: 9px;

    color: var(--text-secondary);

    font-size: 0.875rem;
    font-weight: 750;
    letter-spacing: 0.07em;
}

.intel-live-dot {

    width: 8px;
    height: 8px;

    border-radius: 50%;

    background: var(--cyan);

    animation:
        pulse 1.8s ease-in-out infinite;
}

@keyframes pulse {

    0%,
    100% {
        opacity: 0.45;
        box-shadow:
            0 0 4px var(--cyan);
    }

    50% {
        opacity: 1;
        box-shadow:
            0 0 18px var(--cyan);
    }
}

.intel-system-status {

    display: flex;

    align-items: center;

    gap: 7px;
}

.intel-system-status span {

    color: var(--text-muted);

    font-size: 0.875rem;
}

.intel-system-status strong {

    padding: 5px 8px;

    border-radius: 100px;

    color: var(--cyan);

    background:
        rgba(47,210,255,0.08);

    font-size: 0.875rem;
}

.intel-console-id {

    padding: 27px 25px;

    display: flex;

    justify-content: space-between;

    gap: 25px;
}

.intel-console-id span {

    color: var(--text-muted);

    font-size: 0.875rem;
    font-weight: 700;
    letter-spacing: 0.08em;
}

.intel-console-id > div > strong {

    display: block;

    margin-top: 6px;

    font-size: 1.15rem;
}

.intel-year {

    text-align: right;
}

.intel-year small {

    color: var(--text-muted);

    font-size: 0.875rem;
}

.intel-year strong {

    display: block;

    margin-top: 3px;

    font-size: 1.15rem;

    background: var(--gradient);

    -webkit-background-clip: text;
    background-clip: text;

    color: transparent;
}

.intel-pipeline {

    padding: 26px 22px;

    border-top:
        1px solid var(--border);

    border-bottom:
        1px solid var(--border);

    display: grid;

    grid-template-columns:
        1fr 32px
        1fr 32px
        1fr 32px
        1fr;

    align-items: center;
}

.intel-stage {
    text-align: center;
}

.intel-stage > span {

    color: var(--violet);

    font-size: 0.875rem;
}

.intel-stage-icon {

    width: 43px;
    height: 43px;

    margin: 9px auto;

    border:
        1px solid
        rgba(138,92,255,0.35);

    border-radius: 12px;

    display: flex;

    align-items: center;

    justify-content: center;

    color: var(--cyan);

    background:
        rgba(138,92,255,0.035);
}

.intel-stage strong {

    display: block;

    font-size: 0.875rem;

    letter-spacing: 0.04em;
}

.intel-stage small {

    display: block;

    margin-top: 3px;

    color: var(--text-muted);

    font-size: 0.875rem;
}

.intel-stage-line {

    position: relative;

    height: 1px;

    overflow: hidden;

    background: var(--border);
}

.intel-stage-line span {

    position: absolute;

    width: 17px;
    height: 1px;

    background: var(--gradient);

    animation:
        signalLine 1.8s linear infinite;
}

@keyframes signalLine {

    from {
        left: -20px;
    }

    to {
        left: 100%;
    }
}

.intel-program-area {

    padding: 27px 25px;
}

.intel-program-heading {

    display: flex;

    justify-content: space-between;

    gap: 20px;
}

.intel-caption {

    color: var(--text-muted);

    font-size: 0.875rem;
    font-weight: 700;

    letter-spacing: 0.09em;
}

.intel-program-heading h3 {

    margin-top: 5px;

    font-size: 1.8rem;

    letter-spacing: -0.04em;

    background: var(--gradient);

    -webkit-background-clip: text;
    background-clip: text;

    color: transparent;
}

.intel-program-type {

    height: fit-content;

    padding: 7px 10px;

    border:
        1px solid var(--border);

    border-radius: 100px;

    color: var(--cyan);

    font-size: 0.875rem;
    font-weight: 700;
}

.intel-program-description {

    max-width: 540px;

    margin-top: 10px;

    font-size: 1rem;
    line-height: 1.7;
}

.intel-phase {

    margin-top: 17px;

    padding: 15px;

    border:
        1px solid var(--border);

    border-radius: 10px;

    background:
        rgba(138,92,255,0.025);
}

.intel-phase span {

    display: block;

    color: var(--text-muted);

    font-size: 0.875rem;
    letter-spacing: 0.08em;
}

.intel-phase strong {

    display: block;

    margin-top: 5px;

    color: var(--text-primary);

    font-size: 0.875rem;
}

.intel-tech-tags {

    margin-top: 13px;

    display: flex;

    flex-wrap: wrap;

    gap: 7px;
}

.intel-tech-tags span {

    padding: 6px 9px;

    border:
        1px solid var(--border);

    border-radius: 100px;

    color: var(--text-secondary);

    font-size: 0.875rem;
}

.intel-program-selector {

    margin-top: 20px;

    display: grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 7px;
}

.intel-program-btn {

    min-height: 43px;

    padding: 0 8px;

    border:
        1px solid var(--border);

    border-radius: 9px;

    background:
        rgba(255,255,255,0.015);

    color: var(--text-secondary);

    cursor: pointer;

    font-size: 0.875rem;
    font-weight: 700;

    transition: 0.2s ease;
}

.intel-program-btn span {

    margin-right: 4px;

    color: var(--violet);
}

.intel-program-btn:hover {

    border-color: var(--violet);
}

.intel-program-btn.active {

    color: white;

    border-color: transparent;

    background:
        linear-gradient(
            100deg,
            rgba(47,210,255,0.24),
            rgba(138,92,255,0.43),
            rgba(212,22,255,0.25)
        );
}

.intel-signal-area {

    min-height: 70px;

    padding: 14px 25px;

    border-top:
        1px solid var(--border);

    display: grid;

    grid-template-columns:
        1fr 35px 1fr;

    gap: 10px;

    align-items: center;
}

.intel-signal-block {

    display: grid;

    grid-template-columns:
        75px 1fr;

    gap: 10px;

    align-items: center;
}

.intel-signal-block > span {

    color: var(--text-secondary);

    font-size: 0.875rem;
    font-weight: 750;
}

.intel-plus {

    color: var(--violet);

    text-align: center;
}

.intel-signal-bars {

    height: 26px;

    display: flex;

    align-items: center;

    gap: 4px;
}

.intel-signal-bars i {

    width: 4px;

    border-radius: 20px;

    background: var(--gradient);

    animation:
        bars 1.1s ease-in-out infinite;
}

.intel-signal-bars i:nth-child(1) {
    height: 8px;
}

.intel-signal-bars i:nth-child(2) {
    height: 17px;
    animation-delay: -0.2s;
}

.intel-signal-bars i:nth-child(3) {
    height: 25px;
    animation-delay: -0.35s;
}

.intel-signal-bars i:nth-child(4) {
    height: 13px;
    animation-delay: -0.5s;
}

.intel-signal-bars i:nth-child(5) {
    height: 22px;
    animation-delay: -0.65s;
}

.intel-signal-bars i:nth-child(6) {
    height: 11px;
    animation-delay: -0.8s;
}

.intel-signal-bars i:nth-child(7) {
    height: 18px;
    animation-delay: -0.95s;
}

@keyframes bars {

    0%,
    100% {
        transform: scaleY(0.55);
        opacity: 0.5;
    }

    50% {
        transform: scaleY(1);
        opacity: 1;
    }
}

.intel-data-wave {

    position: relative;

    height: 27px;

    overflow: hidden;
}

.intel-data-wave::before {

    content: "";

    position: absolute;

    top: 50%;

    width: 100%;
    height: 1px;

    background: var(--border);
}

.intel-data-wave i {

    position: absolute;

    top: 4px;
    left: -45%;

    width: 45%;
    height: 20px;

    border-top:
        2px solid var(--cyan);

    border-radius: 50%;

    animation:
        wave 2s linear infinite;
}

@keyframes wave {

    from {
        left: -45%;
    }

    to {
        left: 105%;
    }
}

.intel-console-footer {

    min-height: 53px;

    padding: 0 24px;

    border-top:
        1px solid var(--border);

    display: flex;

    align-items: center;

    justify-content: space-between;

    color: var(--text-muted);

    font-size: 0.875rem;
    font-weight: 700;
}

.intel-footer-live {

    display: flex;

    align-items: center;

    gap: 7px;

    color: var(--cyan);
}

.intel-footer-live i {

    width: 6px;
    height: 6px;

    border-radius: 50%;

    background: var(--cyan);

    animation:
        pulse 1.8s ease-in-out infinite;
}

.intel-scanner {

    position: absolute;

    z-index: 3;

    left: 0;

    width: 100%;
    height: 70px;

    pointer-events: none;

    background:
        linear-gradient(
            transparent,
            rgba(47,210,255,0.045),
            transparent
        );

    animation:
        scan 7s linear infinite;
}

@keyframes scan {

    from {
        top: -100px;
    }

    to {
        top: calc(100% + 100px);
    }
}


/* HERO SECTOR STRIP */

.sector-strip {

    position: relative;

    z-index: 5;

    border-top:
        1px solid var(--border);

    border-bottom:
        1px solid var(--border);
}

.sector-strip-inner {

    width: 92%;
    max-width: 1600px;

    min-height: 82px;

    margin: auto;

    display: grid;

    grid-template-columns:
        190px 1fr;

    gap: 30px;

    align-items: center;
}

.sector-title {

    color: var(--text-secondary);

    font-size: 0.875rem;
    font-weight: 750;
}

.sector-title strong {

    margin-right: 7px;

    color: var(--violet);

    font-size: 1.3rem;
}

.sector-list {

    display: flex;

    justify-content: flex-end;

    flex-wrap: wrap;

    gap: 8px 20px;
}

.sector-list span {

    color: var(--text-muted);

    font-size: 0.875rem;
    font-weight: 700;
}


/* =========================================================
   ABOUT
========================================================= */

.about-glow {

    position: absolute;

    width: 650px;
    height: 650px;

    border-radius: 50%;

    filter: blur(180px);

    opacity: 0.06;
}

.glow-left {

    left: -450px;
    top: 250px;

    background: var(--cyan);
}

.glow-right {

    right: -450px;
    top: 950px;

    background: var(--magenta);
}

.about-intro {

    display: grid;

    grid-template-columns:
        0.3fr 1fr;

    gap: 80px;

    align-items: start;
}

.about-year span {

    display: block;

    color: var(--text-muted);

    font-size: 0.875rem;
    font-weight: 700;
}

.about-year strong {

    display: block;

    margin-top: 8px;

    font-size:
        clamp(4rem, 7vw, 7rem);

    line-height: 0.9;

    letter-spacing: -0.07em;

    background: var(--gradient);

    -webkit-background-clip: text;
    background-clip: text;

    color: transparent;
}

.about-copy {

    max-width: 900px;
}

.about-copy h3 {

    font-size:
        clamp(2.3rem, 4vw, 4.5rem);

    line-height: 0.98;

    letter-spacing: -0.05em;
}

.about-copy h3 span {

    color: var(--violet);
}

.about-copy p {

    margin-top: 23px;

    font-size: 1.02rem;
}

.stats-grid {

    margin-top: 80px;

    display: grid;

    grid-template-columns:
        repeat(6, 1fr);

    border-top:
        1px solid var(--border);

    border-left:
        1px solid var(--border);
}

.stats-grid article {

    min-height: 145px;

    padding: 23px;

    border-right:
        1px solid var(--border);

    border-bottom:
        1px solid var(--border);
}

.stats-grid strong {

    display: block;

    font-size: 2.1rem;

    background: var(--gradient);

    -webkit-background-clip: text;
    background-clip: text;

    color: transparent;
}

.stats-grid strong {
    font-variant-numeric: tabular-nums;
}

@media (prefers-reduced-motion: no-preference) {
    .stats-grid .stat-entered {
        animation: stat-arrive 700ms ease-out var(--stat-delay, 0ms) backwards;
    }
    .stats-grid .stat-entered strong {
        background-size: 200% 100%;
        animation: technology-color-flow 3s ease-in-out var(--stat-delay, 0ms) 2 alternate;
    }
}

@keyframes stat-arrive {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}

.stats-grid span {

    display: block;

    margin-top: 20px;

    color: var(--text-secondary);

    font-size: 0.875rem;
    font-weight: 700;
    line-height: 1.5;
}

.purpose-grid {

    margin-top: 100px;

    display: grid;

    grid-template-columns:
        repeat(2, 1fr);

    gap: 18px;
}

.purpose-card {

    min-height: 480px;

    padding: 35px;

    border:
        1px solid var(--border);

    border-radius: var(--radius);

    display: flex;

    flex-direction: column;

    background:
        linear-gradient(
            145deg,
            rgba(138,92,255,0.06),
            transparent 55%
        ),
        var(--card);
}

/* Vision and Mission: entrance, ambient icon pulse, and hover lift. */
.purpose-card:nth-child(2) { --purpose-delay: 180ms; }
@media (prefers-reduced-motion: no-preference) {
    .purpose-card {
        transition: transform 250ms ease, border-color 250ms ease, box-shadow 250ms ease;
    }
    .purpose-card.purpose-entered {
        animation: purpose-arrive 750ms ease-out var(--purpose-delay, 0ms) backwards;
    }
    .purpose-entered .purpose-icon {
        animation: purpose-icon-pulse 4s ease-in-out var(--purpose-delay, 0ms) infinite;
        animation-play-state: paused;
    }
    .purpose-running .purpose-icon { animation-play-state: running; }
}
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
    .purpose-card:hover {
        transform: translateY(-5px);
        border-color: var(--violet);
        box-shadow: 0 12px 32px rgba(138, 92, 255, 0.12);
    }
}
@keyframes purpose-arrive {
    from { opacity: 0; transform: translateY(24px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes purpose-icon-pulse {
    0%, 100% { transform: translateY(0); box-shadow: 0 0 0 0 rgba(138, 92, 255, 0); }
    50% { transform: translateY(-4px); box-shadow: 0 0 22px 3px rgba(138, 92, 255, 0.2); }
}

.card-index {

    color: var(--violet);

    font-size: 0.875rem;
}

.card-kicker {

    margin-top: 7px;

    color: var(--text-muted);

    font-size: 0.875rem;
    letter-spacing: 0.08em;
}

.purpose-icon {

    width: 63px;
    height: 63px;

    margin-top: 45px;

    border:
        1px solid
        rgba(138,92,255,0.36);

    border-radius: 17px;

    display: flex;

    align-items: center;

    justify-content: center;

    color: var(--violet);

    font-size: 1.4rem;
}

.purpose-card h3 {

    margin-top: 27px;

    font-size: 2.1rem;

    letter-spacing: -0.04em;
}

.purpose-card h3 span {
    color: var(--violet);
}

.purpose-card p {

    margin-top: 18px;
}

.purpose-card > small {

    margin-top: auto;

    padding-top: 23px;

    border-top:
        1px solid var(--border);

    color: var(--text-muted);

    font-size: 0.875rem;
}

.process-flow {

    margin-top: 55px;

    display: flex;

    align-items: center;

    gap: 10px;
}

.process-flow article {

    flex: 1;

    min-height: 145px;

    padding: 20px;

    border:
        1px solid var(--border);

    border-radius: 13px;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    background: var(--card);
}

.process-flow article span {

    color: var(--violet);

    font-size: 0.875rem;
}

.process-flow article strong {

    margin-top: 10px;

    font-size: 0.875rem;
}

.process-flow article small {

    margin-top: 6px;

    color: var(--text-muted);

    font-size: 0.875rem;
}

.process-flow > b {

    color: var(--violet);

    font-weight: 400;
}

/* Pass a soft highlight through Science -> Research -> Engineering -> Product -> Impact. */
@media (prefers-reduced-motion: no-preference) {
    .process-flow.process-ready > article {
        animation: process-stage-pulse 7s ease-in-out var(--process-delay, 0s) infinite;
        animation-play-state: paused;
    }
    .process-flow.process-ready > b {
        animation: process-arrow-pulse 7s ease-in-out var(--process-delay, 0s) infinite;
        animation-play-state: paused;
    }
    .process-flow.process-running > article,
    .process-flow.process-running > b { animation-play-state: running; }
}
@keyframes process-stage-pulse {
    0%, 24%, 100% {
        transform: translateY(0);
        border-color: var(--border);
        box-shadow: 0 0 0 rgba(138, 92, 255, 0);
    }
    6%, 14% {
        transform: translateY(-4px);
        border-color: var(--violet);
        box-shadow: 0 0 24px rgba(138, 92, 255, 0.18);
    }
}
@keyframes process-arrow-pulse {
    0%, 20%, 100% { opacity: 0.55; transform: translateX(0); color: var(--violet); }
    6%, 12% { opacity: 1; transform: translateX(4px); color: var(--cyan); }
}

.location-grid {

    margin-top: 50px;

    display: grid;

    grid-template-columns:
        repeat(3, 1fr);

    gap: 17px;
}

.location-card {

    min-height: 390px;

    padding: 30px;

    border:
        1px solid var(--border);

    border-radius: var(--radius);

    display: flex;

    flex-direction: column;

    background: var(--card);

    transition:
        transform 0.25s ease,
        border-color 0.25s ease;
}

.location-card:hover {

    transform: translateY(-6px);

    border-color:
        rgba(138,92,255,0.48);
}

.location-top {

    display: flex;

    justify-content: space-between;
}

.location-top span {

    color: var(--violet);

    font-size: 0.875rem;
    font-weight: 800;
}

.location-top strong {

    padding: 6px 9px;

    border-radius: 100px;

    color: var(--cyan);

    background:
        rgba(47,210,255,0.07);

    font-size: 0.875rem;
}

.location-top strong.planned {

    color: var(--violet);

    background:
        rgba(138,92,255,0.08);
}

.location-card h4 {

    margin-top: 40px;

    font-size: 2rem;
}

.location-card > p {

    margin-top: 5px;

    color: var(--text-muted);

    font-size: 0.875rem;
    font-weight: 700;
}

.location-card address {

    margin-top: 22px;

    color: var(--text-secondary);

    line-height: 1.8;
}

.location-card > small {

    margin-top: auto;

    padding-top: 20px;

    border-top:
        1px solid var(--border);

    color: var(--text-muted);

    font-size: 0.875rem;
}

.recognition-grid {

    margin-top: 80px;

    display: grid;

    grid-template-columns:
        repeat(3, 1fr);

    gap: 14px;
}

.recognition-grid article {

    padding: 22px;

    border:
        1px solid var(--border);

    border-radius: 14px;

    display: grid;

    grid-template-columns:
        54px 1fr;

    gap: 16px;

    align-items: center;

    background: var(--card);
}

.recognition-grid article > span {

    width: 52px;
    height: 52px;

    border:
        1px solid
        rgba(138,92,255,0.35);

    border-radius: 14px;

    display: flex;

    align-items: center;

    justify-content: center;

    color: var(--violet);

    font-size: 0.875rem;
    font-weight: 800;
}

.recognition-grid strong {

    display: block;

    font-size: 0.875rem;
}

.recognition-grid small {

    display: block;

    margin-top: 4px;

    color: var(--text-muted);
}


/* =========================================================
   SHARED SPLIT INTRO
========================================================= */

.split-intro {

    display: grid;

    grid-template-columns:
        1fr 0.7fr;

    gap: 90px;

    align-items: end;

    padding-bottom: 100px;
}

.split-intro p + p {

    margin-top: 17px;
}


/* =========================================================
   SECTORS
========================================================= */

.pillar-grid {

    display: grid;

    grid-template-columns:
        repeat(3, 1fr);

    gap: 17px;
}

.pillar-grid article {

    min-height: 310px;

    padding: 30px;

    border:
        1px solid var(--border);

    border-radius: var(--radius);

    background: var(--card);
}

.pillar-grid article > span {

    color: var(--violet);

    font-size: 0.875rem;
}

.pillar-grid strong {

    display: block;

    margin-top: 75px;

    font-size: 1.7rem;
}

.pillar-grid p {

    margin-top: 15px;
}


/* ECOSYSTEM ORBIT */

.ecosystem-showcase {

    padding: 110px 0;

    border-top:
        1px solid var(--border);

    margin-top: 110px;
}

.ecosystem-heading {

    text-align: center;
}

.ecosystem-heading h3 {

    font-size:
        clamp(2.8rem, 5vw, 5rem);

    letter-spacing: -0.055em;
}

.ecosystem-heading h3 span {

    background: var(--gradient);

    -webkit-background-clip: text;
    background-clip: text;

    color: transparent;
}

.ecosystem-orbit {

    position: relative;

    width:
        min(760px, 80vw);

    aspect-ratio: 1;

    margin:
        45px auto 0;

    display: flex;

    align-items: center;

    justify-content: center;
}

.orbit-ring {

    position: absolute;

    border:
        1px solid var(--border);

    border-radius: 50%;
}

.orbit-ring-a {

    width: 35%;
    height: 35%;
}

.orbit-ring-b {

    width: 67%;
    height: 67%;

    border-style: dashed;

    animation:
        ringSpin 30s linear infinite;
}

.orbit-ring-c {

    width: 92%;
    height: 92%;
}

@keyframes ringSpin {

    to {
        transform: rotate(360deg);
    }
}

.ecosystem-center {

    position: relative;

    z-index: 20;

    width: 205px;
    height: 205px;

    border:
        1px solid
        rgba(138,92,255,0.43);

    border-radius: 50%;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    background: var(--card-solid);

    box-shadow:
        0 0 75px
        rgba(138,92,255,0.13);
}

.ecosystem-center img {

    width: 78px;
    height: 78px;

    object-fit: contain;
}

.ecosystem-center strong {

    margin-top: 10px;

    font-size: 0.9rem;
    letter-spacing: 0.1em;
}

.ecosystem-center small {

    margin-top: 5px;

    color: var(--text-muted);

    font-size: 0.875rem;
}

.sector-orbit-wheel {

    position: absolute;

    inset: 0;

    animation:
        sectorWheel 48s linear infinite;
}

.sector-orbit-wheel:hover {
    animation-play-state: paused;
}

@keyframes sectorWheel {

    to {
        transform: rotate(360deg);
    }
}

.orbit-sector {

    position: absolute;

    z-index: 10;

    min-width: 120px;

    min-height: 43px;

    padding: 8px 12px;

    border:
        1px solid var(--border-strong);

    border-radius: 100px;

    background: var(--card-solid);

    color: var(--text-primary);

    cursor: pointer;

    font-size: 0.875rem;
    font-weight: 750;

    box-shadow:
        0 12px 35px
        rgba(0,0,0,0.16);
}

.orbit-sector:hover {

    border-color: var(--violet);

    color: var(--violet);
}

/*
   positions around the ring
*/

.orbit-pos-1 {
    top: 2%;
    left: 50%;
    transform: translateX(-50%);
}

.orbit-pos-2 {
    top: 12%;
    right: 8%;
}

.orbit-pos-3 {
    top: 33%;
    right: 0;
}

.orbit-pos-4 {
    bottom: 23%;
    right: 4%;
}

.orbit-pos-5 {
    bottom: 5%;
    right: 21%;
}

.orbit-pos-6 {
    bottom: 2%;
    left: 30%;
}

.orbit-pos-7 {
    bottom: 18%;
    left: 3%;
}

.orbit-pos-8 {
    top: 48%;
    left: -1%;
}

.orbit-pos-9 {
    top: 20%;
    left: 3%;
}

.orbit-pos-10 {
    top: 6%;
    left: 24%;
}

.ecosystem-live-info {

    width:
        min(680px, 100%);

    margin:
        18px auto 0;

    padding: 20px 24px;

    border:
        1px solid var(--border);

    border-radius: 14px;

    display: grid;

    grid-template-columns:
        55px 1fr;

    gap: 18px;

    background: var(--card);
}

.ecosystem-live-info > strong {

    color: var(--violet);

    font-size: 1.5rem;
}

.ecosystem-live-info h4 {

    font-size: 0.95rem;
}

.ecosystem-live-info p {

    margin-top: 5px;

    font-size: 0.9rem;
}


/* SECTOR DIRECTORY */

.sector-directory {

    margin-top: 50px;

    display: grid;

    grid-template-columns:
        repeat(2, 1fr);

    gap: 18px;
}

.sector-card {

    min-height: 570px;

    padding: 32px;

    border:
        1px solid var(--border);

    border-radius: var(--radius);

    display: flex;

    flex-direction: column;

    background:
        linear-gradient(
            145deg,
            rgba(138,92,255,0.045),
            transparent 55%
        ),
        var(--card);

    transition:
        transform 0.3s ease,
        border-color 0.3s ease,
        box-shadow 0.3s ease;
}

.sector-card:hover {

    transform: translateY(-6px);

    border-color:
        rgba(138,92,255,0.48);

    box-shadow: var(--shadow);
}

.card-top {

    display: flex;

    justify-content: space-between;
}

.card-top span {

    color: var(--violet);

    font-size: 0.875rem;
}

.card-top strong {

    padding: 6px 9px;

    border-radius: 100px;

    color: var(--cyan);

    background:
        rgba(47,210,255,0.06);

    font-size: 0.875rem;
}

.sector-symbol,
.service-icon {

    width: 64px;
    height: 64px;

    margin-top: 38px;

    border:
        1px solid
        rgba(138,92,255,0.34);

    border-radius: 17px;

    display: flex;

    align-items: center;

    justify-content: center;

    color: var(--violet);

    background:
        rgba(138,92,255,0.035);

    font-size: 0.875rem;
    font-weight: 800;
}

.sector-card > small {

    margin-top: 25px;

    color: var(--text-muted);

    font-size: 0.875rem;
    letter-spacing: 0.08em;
}

.sector-card h3 {

    margin-top: 7px;

    font-size:
        clamp(2rem, 3vw, 3rem);

    line-height: 1;

    letter-spacing: -0.045em;
}

.sector-card h4 {

    margin-top: 11px;

    color: var(--violet);

    font-size: 0.92rem;
}

.sector-card > p {

    margin-top: 18px;

    font-size: 0.96rem;
}

.tag-list {

    margin-top: 22px;

    display: flex;

    flex-wrap: wrap;

    gap: 7px;
}

.tag-list span {

    padding: 7px 9px;

    border:
        1px solid var(--border);

    border-radius: 100px;

    color: var(--text-secondary);

    font-size: 0.875rem;
    font-weight: 700;
}

.initiative {

    margin-top: 25px;

    padding: 17px;

    border:
        1px solid var(--border);

    border-radius: 11px;

    background:
        rgba(138,92,255,0.025);
}

.initiative small {

    display: block;

    color: var(--text-muted);

    font-size: 0.875rem;
}

.initiative strong {

    display: block;

    margin-top: 5px;

    font-size: 0.875rem;
}

.sector-explore,
.service-request {

    margin-top: auto;

    padding:
        22px 0 2px;

    border: 0;

    border-top:
        1px solid var(--border);

    background: transparent;

    color: var(--text-primary);

    cursor: pointer;

    text-align: left;

    font-size: 0.875rem;
    font-weight: 750;

    transition:
        color 0.2s ease,
        padding-left 0.2s ease;
}

.sector-explore:hover,
.service-request:hover {

    padding-left: 7px;

    color: var(--violet);
}


/* =========================================================
   MODAL
========================================================= */

.sector-modal {

    position: fixed;

    z-index: 40000;

    inset: 0;

    display: none;

    align-items: center;

    justify-content: center;

    padding: 25px;
}

.sector-modal.active {
    display: flex;
}

.sector-modal-backdrop {

    position: absolute;

    inset: 0;

    background:
        rgba(2,4,11,0.80);

    backdrop-filter: blur(12px);
}

.sector-modal-panel {

    position: relative;

    z-index: 2;

    width:
        min(760px, 100%);

    max-height: 88vh;

    overflow-y: auto;

    padding: 43px;

    border:
        1px solid var(--border-strong);

    border-radius: 22px;

    background: var(--card-solid);

    box-shadow: var(--shadow-large);
}

.modal-close {

    position: absolute;

    top: 17px;
    right: 17px;

    width: 42px;
    height: 42px;

    border:
        1px solid var(--border);

    border-radius: 50%;

    background: transparent;

    cursor: pointer;

    font-size: 1.4rem;
}

.modal-top {

    display: flex;

    justify-content: space-between;

    padding-right: 55px;
}

.modal-top span {

    color: var(--violet);

    font-size: 0.875rem;
    font-weight: 750;
}

.sector-modal-panel > small {

    display: block;

    margin-top: 38px;

    color: var(--text-muted);

    font-size: 0.875rem;
}

.sector-modal-panel h2 {

    margin-top: 6px;

    font-size:
        clamp(2.8rem, 6vw, 5rem);

    letter-spacing: -0.055em;
}

.sector-modal-panel h3 {

    margin-top: 8px;

    color: var(--violet);

    font-size: 1rem;
}

.sector-modal-panel > p {

    margin-top: 22px;
}

.modal-divider {

    height: 1px;

    margin: 30px 0;

    background: var(--border);
}

.modal-capabilities {

    margin-top: 14px;

    display: flex;

    flex-wrap: wrap;

    gap: 7px;
}

.modal-capabilities span {

    padding: 8px 10px;

    border:
        1px solid var(--border);

    border-radius: 100px;

    color: var(--text-secondary);

    font-size: 0.875rem;
}

.modal-direction {

    margin-top: 28px;

    padding: 20px;

    border:
        1px solid var(--border);

    border-radius: 12px;

    background:
        rgba(138,92,255,0.025);
}

.modal-direction span {

    color: var(--violet);

    font-size: 0.875rem;
    font-weight: 750;
}

.modal-direction p {

    margin-top: 7px;

    font-size: 0.92rem;
}


/* =========================================================
   PRODUCT
========================================================= */

.product-hero {

    display: grid;

    grid-template-columns:
        1fr 0.88fr;

    gap: 80px;

    align-items: center;
}

.product-badges {

    display: flex;

    flex-wrap: wrap;

    gap: 8px;
}

.product-badges span {

    padding: 8px 11px;

    border:
        1px solid var(--border);

    border-radius: 100px;

    color: var(--text-secondary);

    font-size: 0.875rem;
    font-weight: 700;
}

.product-badges span:last-child {
    color: var(--violet);
}

.product-copy h3 {

    margin-top: 30px;

    font-size:
        clamp(3.1rem, 5.5vw, 5.7rem);

    line-height: 0.93;

    letter-spacing: -0.06em;
}

.product-copy h3 span {

    display: block;

    background: var(--gradient);

    -webkit-background-clip: text;
    background-clip: text;

    color: transparent;
}

.product-copy > p {

    max-width: 690px;

    margin-top: 22px;
}

.product-meta-grid {

    margin-top: 32px;

    display: grid;

    grid-template-columns:
        repeat(2, 1fr);

    border-top:
        1px solid var(--border);

    border-left:
        1px solid var(--border);
}

.product-meta-grid > div {

    padding: 18px;

    border-right:
        1px solid var(--border);

    border-bottom:
        1px solid var(--border);
}

.product-meta-grid small {

    display: block;

    color: var(--text-muted);

    font-size: 0.875rem;
}

.product-meta-grid strong {

    display: block;

    margin-top: 7px;

    font-size: 0.875rem;
}

.product-actions {

    margin-top: 30px;

    display: flex;

    flex-wrap: wrap;

    gap: 10px;
}

.disclaimer {

    margin-top: 22px;

    padding-left: 14px;

    border-left:
        2px solid var(--violet);

    color: var(--text-muted);

    font-size: 0.875rem;
}

.product-visual {

    position: relative;

    min-height: 690px;

    display: flex;

    align-items: center;

    justify-content: center;
}

.phone-shell {

    position: relative;

    z-index: 5;

    width: 330px;
    height: 660px;

    padding: 10px;

    border:
        1px solid
        rgba(255,255,255,0.16);

    border-radius: 42px;

    background: #05060b;

    box-shadow: var(--shadow-large);

    animation:
        phoneFloat 6s ease-in-out infinite;
}

@keyframes phoneFloat {

    0%,
    100% {
        transform:
            translateY(0)
            rotate(-1deg);
    }

    50% {
        transform:
            translateY(-12px)
            rotate(1deg);
    }
}

.phone-screen {

    width: 100%;
    height: 100%;

    padding: 30px 18px;

    border-radius: 33px;

    color: white;

    background:
        radial-gradient(
            circle at 80% 10%,
            rgba(138,92,255,0.25),
            transparent 30%
        ),
        linear-gradient(
            160deg,
            #121522,
            #080a12
        );
}

.phone-header {

    display: flex;

    justify-content: space-between;

    align-items: center;
}

.phone-header small {

    display: block;

    color: #9299aa;

    font-size: 0.875rem;
}

.phone-header strong {

    display: block;

    margin-top: 3px;

    font-size: 0.875rem;
}

.profile {

    width: 38px;
    height: 38px;

    border-radius: 50%;

    display: flex;

    align-items: center;

    justify-content: center;

    background: var(--gradient);

    font-size: 0.875rem;
    font-weight: 700;
}

.wellness-card,
.dosha-card,
.meal-card {

    margin-top: 18px;

    padding: 17px;

    border:
        1px solid
        rgba(255,255,255,0.07);

    border-radius: 16px;

    background:
        rgba(255,255,255,0.04);
}

.phone-screen small {

    color: #979daf;

    font-size: 0.875rem;
}

.wellness-score {

    width: 105px;
    height: 105px;

    margin: 14px auto;

    border-radius: 50%;

    display: flex;

    align-items: center;

    justify-content: center;

    font-size: 1.7rem;
    font-weight: 750;

    background:
        radial-gradient(
            circle,
            #10121c 57%,
            transparent 58%
        ),
        conic-gradient(
            var(--cyan),
            var(--violet) 75%,
            rgba(255,255,255,0.07) 75%
        );
}

.wellness-card > strong,
.meal-card strong {

    display: block;

    font-size: 0.875rem;
}

.wellness-card p,
.meal-card p {

    margin-top: 6px;

    color: #9198aa;

    font-size: 0.875rem;
    line-height: 1.55;
}

.dosha-card > div {

    display: grid;

    grid-template-columns:
        45px 1fr;

    gap: 8px;

    align-items: center;

    margin-top: 10px;
}

.dosha-card span {

    font-size: 0.875rem;
}

.dosha-card i {

    position: relative;

    height: 5px;

    border-radius: 100px;

    background:
        rgba(255,255,255,0.07);
}

.dosha-card i::after {

    content: "";

    display: block;

    width: var(--value);
    height: 100%;

    border-radius: inherit;

    background: var(--gradient);
}

.phone-screen > button {

    width: 100%;

    margin-top: 18px;

    padding: 13px;

    border: 0;

    border-radius: 11px;

    background: var(--gradient);

    color: white;

    font-size: 0.875rem;
    font-weight: 750;
}

.floating-product-tag {

    position: absolute;

    z-index: 6;

    padding: 11px 14px;

    border:
        1px solid var(--border);

    border-radius: 100px;

    background: var(--card-solid);

    color: var(--text-secondary);

    font-size: 0.875rem;
    font-weight: 750;

    box-shadow: var(--shadow);
}

.tag-ai {

    top: 90px;
    left: 5px;
}

.tag-ayurveda {

    top: 315px;
    right: 0;
}

.tag-data {

    bottom: 70px;
    left: 10px;
}

.three-card-grid {

    margin-top: 50px;

    display: grid;

    grid-template-columns:
        repeat(3, 1fr);

    gap: 17px;
}

.three-card-grid article {

    min-height: 290px;

    padding: 28px;

    border:
        1px solid var(--border);

    border-radius: var(--radius);

    background: var(--card);
}

.three-card-grid article > span {

    color: var(--violet);

    font-size: 0.875rem;
}

.three-card-grid h4 {

    margin-top: 60px;

    font-size: 1.25rem;
}

.three-card-grid p {

    margin-top: 14px;
}


/* =========================================================
   SERVICES
========================================================= */

.service-filters {

    margin-bottom: 35px;

    display: flex;

    flex-wrap: wrap;

    gap: 8px;
}

.service-filter {

    min-height: 42px;

    padding: 0 15px;

    border:
        1px solid var(--border);

    border-radius: 100px;

    background: transparent;

    color: var(--text-secondary);

    cursor: pointer;

    font-size: 0.875rem;
    font-weight: 750;
}

.service-filter:hover,
.service-filter.active {

    color: white;

    border-color: transparent;

    background: var(--gradient);
}

.services-grid {

    display: grid;

    grid-template-columns:
        repeat(3, 1fr);

    gap: 17px;
}

.service-card {

    min-height: 500px;

    padding: 29px;

    border:
        1px solid var(--border);

    border-radius: var(--radius);

    display: flex;

    flex-direction: column;

    background: var(--card);

    transition:
        transform 0.3s ease,
        border-color 0.3s ease;
}

.service-card:hover {

    transform: translateY(-6px);

    border-color: var(--violet);
}

.service-card.hidden {
    display: none;
}

.service-number {

    color: var(--violet);

    font-size: 0.875rem;
}

.service-card > small {

    margin-top: 25px;

    color: var(--text-muted);

    font-size: 0.875rem;
}

.service-card h4 {

    margin-top: 10px;

    font-size: 1.45rem;

    line-height: 1.15;

    letter-spacing: -0.03em;
}

.service-card > p {

    margin-top: 16px;

    font-size: 0.94rem;
}


/* =========================================================
   LARGE CTA
========================================================= */

.large-cta {

    margin-top: 110px;

    padding: 68px;

    border:
        1px solid
        rgba(138,92,255,0.3);

    border-radius: 25px;

    display: grid;

    grid-template-columns:
        1fr 270px;

    gap: 70px;

    align-items: center;

    background:
        radial-gradient(
            circle at 90% 50%,
            rgba(138,92,255,0.13),
            transparent 35%
        ),
        var(--card);
}

.large-cta h3 {

    font-size:
        clamp(2.7rem, 5vw, 5rem);

    line-height: 0.96;

    letter-spacing: -0.055em;
}

.large-cta h3 span {

    display: block;

    background: var(--gradient);

    -webkit-background-clip: text;
    background-clip: text;

    color: transparent;
}

.large-cta p {

    max-width: 700px;

    margin: 22px 0 28px;
}

.cta-mark {

    min-height: 260px;

    border:
        1px solid var(--border);

    border-radius: 20px;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    text-align: center;
}

.cta-mark img {

    width: 90px;
    height: 90px;

    object-fit: contain;
}

.cta-mark strong {

    margin-top: 15px;

    font-size: 0.875rem;
}

.cta-mark span {

    margin-top: 5px;

    color: var(--text-muted);

    font-size: 0.875rem;
}

.cta-code {

    min-height: 270px;

    border:
        1px solid var(--border);

    border-radius: 20px;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    text-align: center;
}

.cta-code span {

    margin-bottom: 18px;

    color: var(--violet);

    font-size: 0.875rem;
}

.cta-code strong,
.cta-code b {

    line-height: 2;

    font-size: 0.875rem;
}

.cta-code b {

    color: var(--text-muted);

    font-weight: 500;
}


/* =========================================================
   RESEARCH
========================================================= */

.research-intro {

    min-height: 650px;

    display: grid;

    grid-template-columns:
        1fr 0.85fr;

    gap: 80px;

    align-items: center;
}

.research-label {

    display: inline-block;

    padding: 8px 11px;

    border:
        1px solid var(--border);

    border-radius: 100px;

    color: var(--violet);

    font-size: 0.875rem;
    font-weight: 750;
}

.research-intro h3 {

    margin-top: 25px;

    font-size:
        clamp(3.4rem, 6vw, 6.7rem);

    line-height: 0.9;

    letter-spacing: -0.065em;
}

.research-intro h3 span {

    display: block;

    background: var(--gradient);

    -webkit-background-clip: text;
    background-clip: text;

    color: transparent;
}

.research-intro p {

    max-width: 690px;

    margin-top: 25px;
}

.research-principle {

    margin-top: 36px;

    padding: 21px;

    border-left:
        2px solid var(--violet);

    background:
        rgba(138,92,255,0.025);
}

.research-principle span {

    display: block;

    color: var(--text-muted);

    font-size: 0.875rem;
}

.research-principle strong {

    display: block;

    margin-top: 7px;
}

.research-principle small {

    display: block;

    margin-top: 5px;

    color: var(--violet);
}

.research-system {

    position: relative;

    min-height: 520px;

    display: flex;

    align-items: center;

    justify-content: center;
}

.research-system::before,
.research-system::after {

    content: "";

    position: absolute;

    border:
        1px solid var(--border);

    border-radius: 50%;
}

.research-system::before {

    width: 390px;
    height: 390px;
}

.research-system::after {

    width: 510px;
    height: 510px;

    border-style: dashed;
}

.research-system-core {

    position: relative;

    z-index: 3;

    width: 210px;
    height: 260px;

    border:
        1px solid
        rgba(138,92,255,0.4);

    border-radius: 23px;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    background: var(--card-solid);

    box-shadow:
        0 0 70px
        rgba(138,92,255,0.11);
}

.research-system-core span {

    margin-bottom: 17px;

    color: var(--violet);

    font-size: 0.875rem;
}

.research-system-core strong {

    font-size: 0.875rem;
}

.research-system-core b {

    color: var(--text-muted);

    font-weight: 400;
}

.research-node {

    position: absolute;

    z-index: 5;

    padding: 9px 12px;

    border:
        1px solid var(--border);

    border-radius: 100px;

    background: var(--card-solid);

    color: var(--text-secondary);

    font-size: 0.875rem;
    font-weight: 700;
}

.rn-1 {
    top: 30px;
}

.rn-2 {
    right: 10px;
    top: 170px;
}

.rn-3 {
    right: 70px;
    bottom: 45px;
}

.rn-4 {
    left: 65px;
    bottom: 50px;
}

.rn-5 {
    left: 0;
    top: 175px;
}


/* RESEARCH CONSOLE */

.research-console {

    margin-top: 50px;

    min-height: 690px;

    border:
        1px solid var(--border);

    border-radius: var(--radius);

    overflow: hidden;

    display: grid;

    grid-template-columns:
        0.42fr 0.58fr;

    background: var(--card);
}

.research-domain-index {

    border-right:
        1px solid var(--border);
}

.research-domain-btn {

    width: 100%;

    min-height: 72px;

    padding: 16px 20px;

    border: 0;

    border-bottom:
        1px solid var(--border);

    background: transparent;

    display: grid;

    grid-template-columns:
        38px 1fr;

    gap: 5px;

    align-items: center;

    text-align: left;

    cursor: pointer;
}

.research-domain-btn:hover,
.research-domain-btn.active {

    background:
        rgba(138,92,255,0.07);
}

.research-domain-btn span {

    color: var(--violet);

    font-size: 0.875rem;
}

.research-domain-btn strong {

    font-size: 0.875rem;
}

.research-domain-screen {

    padding: 48px;

    background:
        radial-gradient(
            circle at 90% 10%,
            rgba(138,92,255,0.09),
            transparent 30%
        );
}

.domain-top {

    display: flex;

    justify-content: space-between;
}

.domain-top span {

    color: var(--violet);

    font-size: 0.875rem;
}

.domain-top strong {

    padding: 6px 9px;

    border:
        1px solid var(--border);

    border-radius: 100px;

    color: var(--cyan);

    font-size: 0.875rem;
}

.research-domain-screen > small {

    display: block;

    margin-top: 45px;

    color: var(--text-muted);

    font-size: 0.875rem;
}

.research-domain-screen h4 {

    margin-top: 7px;

    font-size:
        clamp(2.2rem, 4vw, 4rem);

    line-height: 1;

    letter-spacing: -0.05em;
}

.research-domain-screen h5 {

    margin-top: 14px;

    color: var(--violet);

    font-size: 0.875rem;
}

.research-domain-screen > p {

    margin-top: 23px;
}

.domain-divider {

    height: 1px;

    margin: 30px 0;

    background: var(--border);
}

.domain-focus-list {

    margin-top: 14px;

    display: flex;

    flex-wrap: wrap;

    gap: 7px;
}

.domain-focus-list span {

    padding: 7px 10px;

    border:
        1px solid var(--border);

    border-radius: 100px;

    color: var(--text-secondary);

    font-size: 0.875rem;
}

.domain-outcome {

    margin-top: 28px;

    padding: 20px;

    border:
        1px solid var(--border);

    border-radius: 12px;

    background:
        rgba(138,92,255,0.025);
}

.domain-outcome span {

    color: var(--violet);

    font-size: 0.875rem;
}

.domain-outcome p {

    margin-top: 7px;

    font-size: 0.9rem;
}


/* PROGRAM LEDGER */

.programme-ledger {

    margin-top: 50px;

    border-top:
        1px solid var(--border);
}

.programme-ledger article {

    padding: 27px 8px;

    border-bottom:
        1px solid var(--border);

    display: grid;

    grid-template-columns:
        65px 1fr 150px 115px;

    gap: 22px;

    align-items: center;
}

.programme-ledger > article > span {

    color: var(--violet);

    font-size: 0.875rem;
}

.programme-ledger small {

    color: var(--text-muted);

    font-size: 0.875rem;
}

.programme-ledger h4 {

    margin-top: 5px;

    font-size: 1.15rem;
}

.programme-ledger p {

    margin-top: 7px;

    font-size: 0.88rem;
}

.programme-ledger > article > strong {

    font-size: 0.875rem;
}

.programme-ledger > article > b {

    padding: 7px 9px;

    border-radius: 100px;

    background:
        rgba(138,92,255,0.07);

    color: var(--violet);

    text-align: center;

    font-size: 0.875rem;
}


/* RESEARCH PIPELINE */

.research-pipeline {

    margin-top: 50px;

    display: flex;

    align-items: center;

    gap: 8px;
}

.research-pipeline div {

    flex: 1;

    min-height: 130px;

    padding: 15px 8px;

    border:
        1px solid var(--border);

    border-radius: 11px;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    color: var(--violet);

    text-align: center;

    font-size: 0.875rem;
}

.research-pipeline strong {

    margin-top: 5px;

    color: var(--text-primary);

    font-size: 0.875rem;
}

.research-pipeline > span {

    color: var(--violet);
}

.research-pipeline div.final {

    border-color:
        rgba(138,92,255,0.45);

    background:
        rgba(138,92,255,0.04);
}


/* =========================================================
   PUBLICATIONS
========================================================= */

.publication-count {

    display: grid;

    grid-template-columns:
        repeat(4, 1fr);

    border-top:
        1px solid var(--border);

    border-left:
        1px solid var(--border);
}

.publication-count article {

    min-height: 145px;

    padding: 23px;

    border-right:
        1px solid var(--border);

    border-bottom:
        1px solid var(--border);
}

.publication-count strong {

    display: block;

    font-size: 2.3rem;

    background: var(--gradient);

    -webkit-background-clip: text;
    background-clip: text;

    color: transparent;
}

.publication-count span {

    display: block;

    margin-top: 18px;

    color: var(--text-muted);

    font-size: 0.875rem;
}

.featured-publication {

    padding: 100px 0;

    display: grid;

    grid-template-columns:
        0.8fr 1.2fr;

    gap: 85px;

    align-items: center;
}

.paper-visual {

    min-height: 600px;

    display: flex;

    align-items: center;

    justify-content: center;
}

.paper-sheet {

    position: relative;

    width: 390px;

    max-width: 85%;

    aspect-ratio: 0.72;

    padding: 28px;

    color: #121725;

    background: #f7f8fc;

    box-shadow:
        0 35px 90px
        rgba(0,0,0,0.25);

    transform: rotate(-2deg);

    transition: transform 0.3s ease;
}

.paper-sheet:hover {

    transform:
        rotate(0deg)
        translateY(-6px);
}

.paper-brand {

    display: flex;

    align-items: center;

    gap: 10px;
}

.paper-brand img {

    width: 42px;
    height: 42px;

    object-fit: contain;
}

.paper-brand strong {

    font-size: 0.875rem;
}

.paper-sheet > span {

    display: block;

    margin-top: 23px;

    padding: 7px;

    background: #e9ecf3;

    font-size: 0.875rem;
    font-weight: 750;
}

.paper-gradient {

    height: 5px;

    margin:
        17px -28px 25px;

    background: var(--gradient);
}

.paper-sheet h3 {

    font-size: 1.55rem;

    line-height: 1.03;

    letter-spacing: -0.035em;
}

.paper-sheet > p {

    margin-top: 16px;

    color: #626b7d;

    font-size: 0.875rem;
    line-height: 1.55;
}

.paper-code {

    position: absolute;

    left: 28px;
    bottom: 70px;
}

.paper-code small {

    display: block;

    color: #777f8d;

    font-size: 0.875rem;
}

.paper-code strong {

    display: block;

    margin-top: 4px;

    font-size: 0.875rem;
}

.paper-date {

    position: absolute;

    left: 28px;
    right: 28px;
    bottom: 24px;

    padding-top: 11px;

    border-top:
        1px solid #dadde5;

    display: flex;

    justify-content: space-between;

    color: #777f8d;

    font-size: 0.875rem;
}

.publication-badges {

    display: flex;

    gap: 7px;
}

.publication-badges span {

    padding: 7px 10px;

    border:
        1px solid var(--border);

    border-radius: 100px;

    color: var(--text-secondary);

    font-size: 0.875rem;
}

.publication-details > small {

    display: block;

    margin-top: 26px;

    color: var(--violet);

    font-size: 0.875rem;
}

.publication-details h3 {

    margin-top: 12px;

    font-size:
        clamp(2.2rem, 4vw, 3.8rem);

    line-height: 1.03;

    letter-spacing: -0.05em;
}

.publication-details > p {

    margin-top: 21px;
}

.publication-info {

    margin-top: 27px;

    border-top:
        1px solid var(--border);
}

.publication-info > div {

    padding: 15px 0;

    border-bottom:
        1px solid var(--border);

    display: grid;

    grid-template-columns:
        120px 1fr;

    gap: 18px;
}

.publication-info span {

    color: var(--text-muted);

    font-size: 0.875rem;
}

.publication-info strong {

    font-size: 0.875rem;
}

.publication-actions {

    margin-top: 29px;

    display: flex;

    flex-wrap: wrap;

    gap: 9px;
}

.citation-feedback {

    margin-top: 10px;

    color: var(--cyan);

    font-size: 0.875rem;

    opacity: 0;

    transition: opacity 0.2s ease;
}

.citation-feedback.show {
    opacity: 1;
}

.publication-roadmap {

    margin-top: 45px;

    display: grid;

    grid-template-columns:
        repeat(4, 1fr);

    gap: 16px;
}

.publication-roadmap article {

    min-height: 330px;

    padding: 27px;

    border:
        1px solid var(--border);

    border-radius: 16px;

    display: flex;

    flex-direction: column;

    background: var(--card);
}

.publication-roadmap article.active {

    border-color:
        rgba(138,92,255,0.4);

    background:
        linear-gradient(
            145deg,
            rgba(138,92,255,0.08),
            transparent
        ),
        var(--card);
}

.publication-roadmap span {

    color: var(--violet);

    font-size: 0.875rem;
}

.publication-roadmap h4 {

    margin-top: 28px;

    font-size: 1.3rem;
}

.publication-roadmap p {

    margin-top: 14px;
}

.publication-roadmap strong {

    margin-top: auto;

    padding-top: 20px;

    border-top:
        1px solid var(--border);

    color: var(--text-muted);

    font-size: 0.875rem;
}


/* =========================================================
   JOIN US
========================================================= */

.rolling-badge {

    width: fit-content;

    margin-top: 25px;

    padding: 9px 13px;

    border:
        1px solid var(--border);

    border-radius: 100px;

    display: flex;

    align-items: center;

    gap: 8px;

    color: var(--text-secondary);

    font-size: 0.875rem;
}

.rolling-badge > span {

    width: 7px;
    height: 7px;

    border-radius: 50%;

    background: var(--cyan);

    animation:
        pulse 1.8s infinite;
}

.duration-grid {

    margin-top: 45px;

    display: grid;

    grid-template-columns:
        repeat(4, 1fr);

    gap: 16px;
}

.duration-card {

    min-height: 390px;

    padding: 27px;

    border:
        1px solid var(--border);

    border-radius: var(--radius);

    display: flex;

    flex-direction: column;

    background: var(--card);

    cursor: pointer;

    transition:
        transform 0.3s ease,
        border-color 0.3s ease;
}

.duration-card:hover {

    transform: translateY(-6px);

    border-color: var(--violet);
}

.duration-card.featured {

    border-color:
        rgba(138,92,255,0.38);
}

.duration-card > span {

    color: var(--violet);

    font-size: 0.875rem;
}

.duration-card > strong {

    margin-top: 40px;

    font-size: 4.8rem;

    line-height: 1;

    letter-spacing: -0.07em;

    background: var(--gradient);

    -webkit-background-clip: text;
    background-clip: text;

    color: transparent;
}

.duration-card h4 {

    font-size: 0.9rem;
    letter-spacing: 0.1em;
}

.duration-card small {

    margin-top: 23px;

    color: var(--violet);

    font-size: 0.875rem;
}

.duration-card p {

    margin-top: 13px;
}

.selection-section {

    padding: 105px 0;

    border-top:
        1px solid var(--border);

    display: grid;

    grid-template-columns: minmax(0, 1fr);

    gap: 80px;
}

.selection-list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.selection-list article {

    min-width: 0;
    padding: 24px;
    border: 1px solid var(--border);
    border-radius: 16px;
    background: linear-gradient(135deg, rgba(138,92,255,.07), transparent 70%), var(--card);

    display: grid;

    grid-template-columns:
        42px minmax(0, 1fr);

    gap: 16px;

    align-items: start;
}

.selection-list > article > span {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border: 1px solid rgba(138,92,255,.3);
    border-radius: 12px;
    background: rgba(138,92,255,.1);
    color: var(--text-primary);
    font-size: 0.9375rem;
    font-weight: 750;
    font-variant-numeric: tabular-nums;
}

.selection-list strong {
    display: block;
    font-size: 0.9375rem;
    line-height: 1.45;
}

.selection-list p {
    margin-top: 8px;
    font-size: 1rem;
    line-height: 1.6;
}

.selection-list article:last-child { border-color: rgba(47,210,255,.3); }
.selection-list article:last-child > span { border-color: rgba(47,210,255,.3); background: rgba(47,210,255,.08); }

@media (max-width: 1050px) {
    .selection-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
    .selection-list { grid-template-columns: minmax(0, 1fr); gap: 12px; }
    .selection-list article { padding: 20px; gap: 14px; }
}

.role-cloud {

    margin-top: 42px;

    display: flex;

    flex-wrap: wrap;

    gap: 9px;
}

.role-cloud button {

    min-height: 47px;

    padding: 0 16px;

    border:
        1px solid var(--border);

    border-radius: 100px;

    background: transparent;

    color: var(--text-secondary);

    cursor: pointer;

    font-size: 0.875rem;
    font-weight: 750;

    transition: 0.2s ease;
}

.role-cloud button:hover {

    color: white;

    border-color: transparent;

    background: var(--gradient);
}

.rolling-note {

    max-width: 730px;

    margin-top: 25px;

    padding-left: 14px;

    border-left:
        2px solid var(--violet);

    color: var(--text-muted);

    font-size: 0.875rem;
}


/* CAREER FORM */

.career-wrapper {

    padding: 105px 0;

    border-top:
        1px solid var(--border);

    display: grid;

    grid-template-columns:
        0.53fr 1fr;

    gap: 70px;

    align-items: start;
}

.career-intro {

    position: sticky;

    top: 110px;
}

.career-intro > p {

    margin-top: 20px;
}

.application-flow {

    margin-top: 30px;

    border-top:
        1px solid var(--border);
}

.application-flow span {

    min-height: 52px;

    border-bottom:
        1px solid var(--border);

    display: flex;

    align-items: center;

    color: var(--text-secondary);

    font-size: 0.875rem;
}

.career-form {

    padding: 40px;

    border:
        1px solid var(--border);

    border-radius: 21px;

    background:
        linear-gradient(
            145deg,
            rgba(138,92,255,0.04),
            transparent 60%
        ),
        var(--card);
}

.honeypot {

    position: absolute;

    left: -9999px;

    width: 1px;
    height: 1px;

    overflow: hidden;
}

.form-title {

    margin: 40px 0 18px;

    padding-bottom: 11px;

    border-bottom:
        1px solid var(--border);

    color: var(--text-secondary);

    font-size: 0.875rem;
    font-weight: 750;
}

.form-title:first-of-type {
    margin-top: 0;
}

.application-selector {

    display: grid;

    grid-template-columns:
        repeat(2, 1fr);

    gap: 9px;
}

.application-selector input {
    display: none;
}

.application-selector span {

    min-height: 54px;

    border:
        1px solid var(--border);

    border-radius: 9px;

    display: flex;

    align-items: center;

    justify-content: center;

    color: var(--text-secondary);

    cursor: pointer;

    font-size: 0.875rem;
    font-weight: 750;
}

.application-selector input:checked + span {

    color: white;

    border-color: transparent;

    background: var(--gradient);
}

.form-grid {

    display: grid;

    gap: 16px;
}

.form-grid.two {

    grid-template-columns:
        repeat(2, 1fr);
}

.form-grid.three {

    grid-template-columns:
        repeat(3, 1fr);
}

.form-field {

    margin-top: 15px;
}

.form-field label {

    display: block;

    margin-bottom: 7px;

    color: var(--text-secondary);

    font-size: 0.875rem;
    font-weight: 750;
}

.form-field input,
.form-field select,
.form-field textarea {

    width: 100%;

    padding: 14px;

    border:
        1px solid var(--border);

    border-radius: 9px;

    outline: 0;

    background: var(--bg-secondary);

    color: var(--text-primary);

    font-size: 0.93rem;
}

.form-field textarea {

    resize: vertical;
}

.form-field input:focus,
.form-field select:focus,
.form-field textarea:focus {

    border-color: var(--violet);

    box-shadow:
        0 0 0 3px
        rgba(138,92,255,0.08);
}

.form-field option {

    color: #111;
    background: white;
}

.form-field small {

    display: block;

    margin-top: 6px;

    color: var(--text-muted);

    font-size: 0.875rem;
}

.resume-upload {

    position: relative;
}

.resume-upload input {

    position: absolute;

    opacity: 0;

    pointer-events: none;
}

.resume-upload label {

    min-height: 150px;

    border:
        1px dashed
        rgba(138,92,255,0.45);

    border-radius: 13px;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    cursor: pointer;

    background:
        rgba(138,92,255,0.025);
}

.resume-upload label > span {

    width: 45px;
    height: 45px;

    border:
        1px solid
        rgba(138,92,255,0.4);

    border-radius: 11px;

    display: flex;

    align-items: center;

    justify-content: center;

    color: var(--violet);

    font-size: 0.875rem;
    font-weight: 800;
}

.resume-upload label strong {

    margin-top: 10px;

    font-size: 0.875rem;
}

.resume-upload label small {

    margin-top: 5px;

    color: var(--text-muted);

    font-size: 0.875rem;
}

#selectedFileName {

    margin-top: 9px;

    color: var(--text-secondary);

    font-size: 0.875rem;
}

.consent-row {

    margin-top: 25px;

    display: grid;

    grid-template-columns:
        20px 1fr;

    gap: 10px;

    color: var(--text-secondary);

    font-size: 0.875rem;
    line-height: 1.65;
}

.consent-row input {

    margin-top: 4px;

    accent-color: var(--violet);
}

.career-submit {

    width: 100%;

    min-height: 59px;

    margin-top: 26px;

    padding: 0 23px;

    border: 0;

    border-radius: 9px;

    display: flex;

    justify-content: space-between;

    align-items: center;

    background: var(--gradient);

    color: white;

    cursor: pointer;

    font-size: 0.875rem;
    font-weight: 750;
}

.career-submit:disabled {

    opacity: 0.55;

    cursor: not-allowed;
}

.form-note {

    margin-top: 12px;

    color: var(--text-muted);

    text-align: center;

    font-size: 0.875rem;
}

.career-success {

    display: none;

    padding: 55px;

    border:
        1px solid
        rgba(138,92,255,0.4);

    border-radius: 20px;

    text-align: center;

    background: var(--card);
}

.career-success.show {
    display: block;
}

.success-check {

    width: 65px;
    height: 65px;

    margin: auto;

    border-radius: 50%;

    display: flex;

    align-items: center;

    justify-content: center;

    background: var(--gradient);

    color: white;

    font-size: 1.5rem;
}

.career-success > span {

    display: block;

    margin-top: 20px;

    color: var(--violet);

    font-size: 0.875rem;
}

.career-success h3 {

    margin-top: 8px;

    font-size:
        clamp(2.7rem, 5vw, 4.7rem);

    letter-spacing: -0.055em;
}

.career-success h3 strong {

    background: var(--gradient);

    -webkit-background-clip: text;
    background-clip: text;

    color: transparent;
}

.career-success p {

    max-width: 650px;

    margin:
        15px auto 0;
}

.application-reference {

    width: fit-content;

    margin: 27px auto;

    padding: 19px 30px;

    border:
        1px solid var(--border);

    border-radius: 12px;
}

.application-reference small {

    display: block;

    color: var(--text-muted);

    font-size: 0.875rem;
}

.application-reference strong {

    display: block;

    margin-top: 6px;

    color: var(--violet);

    font-size: 1rem;
}


/* =========================================================
   CONTACT
========================================================= */

.contact-layout {

    display: grid;

    grid-template-columns:
        0.8fr 1.2fr;

    gap: 80px;

    align-items: start;
}

.contact-layout > div:first-child h3 {

    font-size:
        clamp(3rem, 5vw, 5.3rem);

    line-height: 0.95;

    letter-spacing: -0.055em;
}

.contact-layout > div:first-child p {

    margin: 22px 0 28px;
}

.contact-card-grid {

    display: grid;

    grid-template-columns:
        repeat(2, 1fr);

    gap: 15px;
}

.contact-card-grid article {

    min-height: 230px;

    padding: 26px;

    border:
        1px solid var(--border);

    border-radius: 16px;

    background: var(--card);
}

.contact-card-grid span {

    color: var(--violet);

    font-size: 0.875rem;
}

.contact-card-grid strong {

    display: block;

    margin-top: 40px;

    font-size: 0.88rem;
}

.contact-card-grid p {

    margin-top: 12px;

    font-size: 0.88rem;
}


/* =========================================================
   FOOTER
========================================================= */

.site-footer {

    padding: 70px 0 30px;

    border-top:
        1px solid var(--border);

    background: var(--bg-secondary);
}

.footer-grid {

    display: grid;

    grid-template-columns:
        1fr 1fr;

    gap: 35px;
}

.footer-brand {

    display: flex;

    align-items: center;

    gap: 13px;
}

.footer-brand img {

    width: 60px;
    height: 60px;

    object-fit: contain;
}

.footer-brand strong {

    display: block;

    font-size: 1rem;
}

.footer-brand span {

    display: block;

    margin-top: 4px;

    color: var(--text-muted);

    font-size: 0.875rem;
}

.footer-grid > p {

    text-align: right;

    align-self: center;
}

.footer-links {

    grid-column:
        1 / -1;

    padding-top: 25px;

    border-top:
        1px solid var(--border);

    display: flex;

    flex-wrap: wrap;

    gap: 20px;
}

.footer-links a {

    color: var(--text-secondary);

    text-decoration: none;

    font-size: 0.875rem;
    font-weight: 700;
}

.footer-links a:hover {
    color: var(--violet);
}

.footer-bottom {

    grid-column:
        1 / -1;

    padding-top: 24px;

    border-top:
        1px solid var(--border);

    display: flex;

    justify-content: space-between;

    gap: 20px;

    color: var(--text-muted);

    font-size: 0.875rem;
}

.footer-bottom a {

    color: var(--violet);

    text-decoration: none;
}


/* =========================================================
   TOAST
========================================================= */

.global-toast {

    position: fixed;

    z-index: 50000;

    right: 25px;
    bottom: 25px;

    width: 355px;

    max-width:
        calc(100vw - 40px);

    padding: 19px;

    border:
        1px solid
        rgba(138,92,255,0.4);

    border-radius: 13px;

    background: var(--card-solid);

    box-shadow: var(--shadow-large);

    transform:
        translateY(150%);

    opacity: 0;

    transition: 0.3s ease;
}

.global-toast.show {

    transform: translateY(0);

    opacity: 1;
}

.global-toast > span {

    display: block;

    color: var(--violet);

    font-size: 0.875rem;
}

.global-toast strong {

    display: block;

    margin-top: 6px;

    font-size: 0.875rem;
}

.global-toast small {

    display: block;

    margin-top: 6px;

    color: var(--text-muted);

    font-size: 0.875rem;
    line-height: 1.5;
}


/* =========================================================
   ACCESSIBILITY
========================================================= */

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {

    outline:
        3px solid
        rgba(47,210,255,0.55);

    outline-offset: 3px;
}


/* =========================================================
   RESPONSIVE — 1200
========================================================= */

@media(max-width: 1200px) {

    .brand-full {
        display: none;
    }

    .stats-grid {
        grid-template-columns:
            repeat(3, 1fr);
    }

    .services-grid {
        grid-template-columns:
            repeat(2, 1fr);
    }

    .publication-roadmap {
        grid-template-columns:
            repeat(2, 1fr);
    }

}


/* =========================================================
   RESPONSIVE — 1050
========================================================= */

@media(max-width: 1050px) {

    .nav-menu {

        position: fixed;

        top: 78px;
        right: 20px;

        width:
            min(
                360px,
                calc(100vw - 40px)
            );

        padding: 18px;

        border:
            1px solid var(--border);

        border-radius: 16px;

        background: var(--card-solid);

        box-shadow: var(--shadow-large);

        display: flex;

        flex-direction: column;

        align-items: stretch;

        transform:
            translateY(-15px);

        opacity: 0;

        visibility: hidden;

        pointer-events: none;

        transition: 0.25s ease;
    }

    .nav-menu.active {

        transform:
            translateY(0);

        opacity: 1;

        visibility: visible;

        pointer-events: auto;
    }

    .nav-link {

        padding: 13px 10px;

        border-bottom:
            1px solid var(--border);
    }

    .nav-link::after {
        display: none;
    }

    .menu-toggle {
        display: block;
    }

    .hero-container,
    .product-hero,
    .research-intro {

        grid-template-columns:
            1fr;
    }

    .hero-content {
        max-width: 850px;
    }

    .about-intro {

        grid-template-columns:
            1fr;

        gap: 30px;
    }

    .purpose-grid {
        grid-template-columns: 1fr;
    }

    .pillar-grid {
        grid-template-columns: 1fr;
    }

    .sector-directory {
        grid-template-columns: 1fr;
    }

    .research-console {
        grid-template-columns: 1fr;
    }

    .research-domain-index {

        border-right: 0;

        display: grid;

        grid-template-columns:
            repeat(3, 1fr);
    }

    .programme-ledger article {

        grid-template-columns:
            55px 1fr 130px;
    }

    .programme-ledger article > b {

        grid-column:
            2 / -1;

        width: fit-content;
    }

    .research-pipeline {

        display: grid;

        grid-template-columns:
            repeat(3, 1fr);
    }

    .research-pipeline > span {
        display: none;
    }

    .featured-publication {

        grid-template-columns: 1fr;
    }

    .duration-grid {

        grid-template-columns:
            repeat(2, 1fr);
    }

    .selection-section,
    .career-wrapper,
    .contact-layout {

        grid-template-columns:
            1fr;
    }

    .career-intro {
        position: static;
    }

}


/* =========================================================
   RESPONSIVE — 800
========================================================= */

@media(max-width: 800px) {

    body {
        font-size: 16px;
    }

    .section {
        padding: 90px 0;
    }

    .section-heading {

        margin-bottom: 55px;

        grid-template-columns:
            42px 1fr;
    }

    .split-intro {

        grid-template-columns: 1fr;

        gap: 30px;

        padding-bottom: 70px;
    }

    .hero {

        padding-top: 120px;
    }

    .hero-mini-stats {

        grid-template-columns:
            repeat(2, 1fr);
    }

    .sector-strip-inner {

        grid-template-columns:
            1fr;

        padding: 15px 0;
    }

    .sector-list {

        justify-content: flex-start;
    }

    .location-grid {

        grid-template-columns: 1fr;
    }

    .recognition-grid {

        grid-template-columns: 1fr;
    }

    .process-flow {

        display: grid;

        grid-template-columns:
            repeat(2, 1fr);
    }

    .process-flow > b {
        display: none;
    }

    .ecosystem-orbit {

        width:
            min(620px, 95vw);
    }

    .ecosystem-center {

        width: 170px;
        height: 170px;
    }

    .ecosystem-center img {

        width: 60px;
        height: 60px;
    }

    .three-card-grid {

        grid-template-columns: 1fr;
    }

    .large-cta {

        grid-template-columns: 1fr;

        padding: 45px;
    }

    .research-domain-index {

        grid-template-columns:
            repeat(2, 1fr);
    }

    .publication-count {

        grid-template-columns:
            repeat(2, 1fr);
    }

    .publication-roadmap {

        grid-template-columns: 1fr;
    }

    .footer-grid {

        grid-template-columns: 1fr;
    }

    .footer-grid > p {

        text-align: left;
    }

}


/* =========================================================
   RESPONSIVE — MOBILE
========================================================= */

@media(max-width: 600px) {

    body {
        font-size: 15.5px;
    }

    .navbar {

        width: 92%;

        min-height: 70px;
    }

    .nav-menu {
        top: 72px;
    }

    .brand-logo {

        width: 38px;
        height: 38px;
    }

    .section-heading {

        grid-template-columns: 1fr;
    }

    .section-number {
        padding-top: 0;
    }

    .hero {

        min-height: auto;

        padding-top: 110px;
    }

    .hero-title {

        font-size:
            clamp(3rem, 14vw, 4.8rem);
    }

    .hero-description {
        font-size: 0.96rem;
    }

    .hero-actions {

        flex-direction: column;
    }

    .hero-actions .btn {

        width: 100%;
    }

    .hero-mini-stats {

        grid-template-columns:
            repeat(2, 1fr);
    }

    .hero-intelligence-visual {

        min-height: 600px;
    }

    .intel-console {

        border-radius: 18px;
    }

    .intel-system-name {

        font-size: 0.875rem;
    }

    .intel-console-id {

        padding: 21px 16px;
    }

    .intel-pipeline {

        padding: 20px 11px;

        grid-template-columns:
            1fr 12px
            1fr 12px
            1fr 12px
            1fr;
    }

    .intel-stage-icon {

        width: 34px;
        height: 34px;
    }

    .intel-stage strong,
    .intel-stage small {

        font-size: 0.875rem;
    }

    .intel-program-area {

        padding: 22px 17px;
    }

    .intel-program-selector {

        grid-template-columns:
            repeat(2, 1fr);
    }

    .intel-signal-area {

        grid-template-columns: 1fr;

        padding: 14px 17px;
    }

    .intel-plus {
        display: none;
    }

    .intel-console-footer {

        padding: 13px 17px;

        flex-direction: column;

        align-items: flex-start;

        gap: 6px;
    }

    .stats-grid {

        grid-template-columns:
            repeat(2, 1fr);
    }

    .process-flow {

        grid-template-columns: 1fr;
    }

    .ecosystem-orbit {

        min-height: 500px;

        aspect-ratio: auto;

        width: 100%;
    }

    .orbit-ring-a {

        width: 175px;
        height: 175px;
    }

    .orbit-ring-b {

        width: 300px;
        height: 300px;
    }

    .orbit-ring-c {

        width: 425px;
        height: 425px;
    }

    .ecosystem-center {

        width: 145px;
        height: 145px;
    }

    .ecosystem-center img {

        width: 50px;
        height: 50px;
    }

    .orbit-sector {

        min-width: 78px;

        min-height: 35px;

        padding: 6px 8px;

        font-size: 0.875rem;
    }

    .product-meta-grid {

        grid-template-columns: 1fr;
    }

    .product-actions {

        flex-direction: column;
    }

    .product-actions .btn {

        width: 100%;
    }

    .product-visual {

        min-height: 600px;
    }

    .phone-shell {

        width: 285px;
        height: 590px;
    }

    .floating-product-tag {
        display: none;
    }

    .services-grid {

        grid-template-columns: 1fr;
    }

    .research-system {

        min-height: 480px;
    }

    .research-domain-index {

        grid-template-columns: 1fr;
    }

    .research-domain-screen {

        padding: 27px 21px;
    }

    .programme-ledger article {

        grid-template-columns: 1fr;

        gap: 12px;
    }

    .programme-ledger article > b {
        grid-column: auto;
    }

    .research-pipeline {

        grid-template-columns:
            repeat(2, 1fr);
    }

    .publication-count {

        grid-template-columns: 1fr;
    }

    .featured-publication {

        padding: 70px 0;

        gap: 40px;
    }

    .publication-info > div {

        grid-template-columns: 1fr;

        gap: 5px;
    }

    .publication-actions {

        flex-direction: column;
    }

    .publication-actions .btn {

        width: 100%;
    }

    .duration-grid {

        grid-template-columns: 1fr;
    }

    .form-grid.two,
    .form-grid.three,
    .application-selector {

        grid-template-columns: 1fr;
    }

    .career-form {

        padding: 24px;
    }

    .contact-card-grid {

        grid-template-columns: 1fr;
    }

    .footer-bottom {

        flex-direction: column;
    }

}


/* =========================================================
   VERY SMALL SCREENS
========================================================= */

@media(max-width: 430px) {

    .stats-grid {

        grid-template-columns: 1fr;
    }

    .research-pipeline {

        grid-template-columns: 1fr;
    }

    .ecosystem-orbit {

        transform: scale(0.88);

        margin:
            5px auto -25px;
    }

}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media(prefers-reduced-motion: reduce) {

    html {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {

        animation-duration:
            0.01ms !important;

        animation-iteration-count:
            1 !important;

        transition-duration:
            0.01ms !important;
    }

}


/* =========================================================
   END
========================================================= */
/* Hero console readability across themes and screen sizes. */
html[data-theme="light"] .intel-console {
    --text-secondary: #35445d;
    --text-muted: #465773;
    --border: rgba(35, 58, 92, 0.25);
    --border-strong: rgba(35, 58, 92, 0.42);
    --cyan: #006a88;
    --violet: #6940bd;
}
.intel-console-top {
    flex-wrap: wrap;
    gap: 10px;
    padding-block: 14px;
}
.intel-program-heading { flex-wrap: wrap; }
.intel-program-btn:focus-visible {
    outline: 3px solid var(--cyan);
    outline-offset: 3px;
}
@media (max-width: 480px) {
    .intel-pipeline {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 20px 12px;
    }
    .intel-stage-line { display: none; }
    .intel-stage-icon { width: 44px; height: 44px; }
}
/* =========================================================
   KT INDIA HERO — FINAL VIDEO FIX
   KEEP THIS AT THE VERY END OF style.css
========================================================= */


/* ---------------------------------------------------------
   HERO OVERALL PROPORTIONS
--------------------------------------------------------- */

.hero {
    min-height: auto;
    padding-top: 112px;
}


.hero-container {

    width: min(92%, 1500px);

    padding-bottom: 58px;

    grid-template-columns:
        minmax(0, 0.92fr)
        minmax(500px, 1.08fr);

    gap: clamp(36px, 4vw, 68px);

    align-items: center;
}



/* ---------------------------------------------------------
   LEFT CONTENT
--------------------------------------------------------- */

.hero-content {

    min-width: 0;

    max-width: 720px;
}


.company-label {

    margin-bottom: 19px;

    font-size: 0.875rem;
}



/* ---------------------------------------------------------
   MAIN TITLE

   The previous version was too large for 1280 / 1366 screens.
--------------------------------------------------------- */

.hero-title {

    width: 100%;

    max-width: 680px;

    font-size:
        clamp(
            3.4rem,
            5.25vw,
            6.15rem
        );

    line-height: 0.91;

    letter-spacing: -0.062em;

    overflow: visible;
}


.hero-title .gradient-text {

    display: block;
}



/* ---------------------------------------------------------
   "FOR"
--------------------------------------------------------- */

.hero-for {

    display: block !important;

    margin-top: 13px;
    margin-bottom: 2px;

    color: var(--text-secondary);

    font-size: 0.47em;

    line-height: 1;

    letter-spacing: -0.02em;
}



/* ---------------------------------------------------------
   ROTATING WORD

   IMPORTANT:
   - fixed line height
   - no wrapping
   - no detached period
   - fixed minimum space
--------------------------------------------------------- */

.hero-rotating-word {

    display: block !important;

    width: max-content;

    max-width: 100%;

    min-height: 1.05em;

    white-space: nowrap;

    line-height: 1.02;

    transform-origin: left center;

    will-change:
        opacity,
        transform;

    transition:
        opacity 0.26s ease,
        transform 0.26s ease;
}



/* Hide the old independent period */

.hero-dot {
    display: none !important;
}



/* Normal-length rotating words */

.hero-rotating-word.hero-word-normal {
    font-size: 0.96em;
}



/* Slightly long words */

.hero-rotating-word.hero-word-medium {
    font-size: 0.88em;
}



/* Engineering / Intelligence */

.hero-rotating-word.hero-word-long {
    font-size: 0.76em;
}



/* ---------------------------------------------------------
   PROFESSIONAL WORD ANIMATION
--------------------------------------------------------- */

.hero-rotating-word.word-leaving {

    opacity: 0;

    transform:
        translateY(10px);

}


.hero-rotating-word.word-entering {

    opacity: 0;

    transform:
        translateY(-10px);

}



/* ---------------------------------------------------------
   HERO SUPPORTING COPY
--------------------------------------------------------- */

.tagline {

    margin-top: 24px;

    font-size: 0.875rem;
}


.hero-description {

    max-width: 660px;

    margin-top: 17px;

    font-size: 0.92rem;

    line-height: 1.72;
}


.hero-actions {

    margin-top: 25px;
}


.hero-mini-stats {

    margin-top: 29px;
}


.hero-mini-stats > div {

    min-height: 83px;

    padding: 14px;
}


.hero-mini-stats strong {

    font-size: 1.35rem;
}


.hero-mini-stats span {

    margin-top: 6px;

    font-size: 0.875rem;
}



/* =========================================================
   TECHNOLOGY OPERATING SYSTEM — COMPACT VERSION
========================================================= */

.hero-intelligence-visual {

    min-height: 0;

    display: flex;

    align-items: center;

    justify-content: center;
}


.intel-console {

    width: 100%;

    max-width: 620px;

    border-radius: 20px;
}



/* TOP BAR */

.intel-console-top {

    min-height: 48px;

    padding: 0 17px;
}


.intel-system-name {

    font-size: 0.875rem;
}


.intel-system-status span,
.intel-system-status strong {

    font-size: 0.875rem;
}



/* IDENTITY */

.intel-console-id {

    padding: 19px 19px;
}


.intel-console-id span {

    font-size: 0.875rem;
}


.intel-console-id > div > strong {

    margin-top: 4px;

    font-size: 0.92rem;
}


.intel-year strong {

    font-size: 0.95rem;
}



/* PIPELINE */

.intel-pipeline {

    padding: 19px 17px;

    grid-template-columns:
        1fr 24px
        1fr 24px
        1fr 24px
        1fr;
}


.intel-stage > span {

    font-size: 0.875rem;
}


.intel-stage-icon {

    width: 36px;
    height: 36px;

    margin: 7px auto;

    border-radius: 9px;
}


.intel-stage strong {

    font-size: 0.875rem;
}


.intel-stage small {

    font-size: 0.875rem;
}



/* ACTIVE PROGRAM */

.intel-program-area {

    padding: 20px 19px;
}


.intel-caption {

    font-size: 0.875rem;
}


.intel-program-heading h3 {

    margin-top: 3px;

    font-size: 1.45rem;
}


.intel-program-type {

    padding: 5px 8px;

    font-size: 0.875rem;
}


.intel-program-description {

    margin-top: 7px;

    font-size: 0.875rem;

    line-height: 1.62;
}


.intel-phase {

    margin-top: 12px;

    padding: 11px 12px;
}


.intel-phase span {

    font-size: 0.875rem;
}


.intel-phase strong {

    margin-top: 3px;

    font-size: 0.875rem;
}


.intel-tech-tags {

    margin-top: 9px;
}


.intel-tech-tags span {

    padding: 4px 7px;

    font-size: 0.875rem;
}



/* PROGRAM BUTTONS */

.intel-program-selector {

    margin-top: 13px;

    gap: 5px;
}


.intel-program-btn {

    min-height: 36px;

    font-size: 0.875rem;

    border-radius: 7px;
}



/* SIGNAL */

.intel-signal-area {

    min-height: 53px;

    padding: 9px 18px;
}


.intel-signal-block {

    grid-template-columns:
        64px 1fr;
}


.intel-signal-block > span {

    font-size: 0.875rem;
}



/* FOOTER */

.intel-console-footer {

    min-height: 42px;

    padding: 0 18px;

    font-size: 0.875rem;
}



/* =========================================================
   1366 / 1280 LAPTOP SCREENS
========================================================= */

@media
(max-width: 1400px) {

    .hero-container {

        width: 90%;

        grid-template-columns:
            minmax(0, 0.9fr)
            minmax(500px, 1.1fr);

        gap: 42px;
    }


    .hero-title {

        font-size:
            clamp(
                3.25rem,
                5vw,
                5.45rem
            );
    }


    .hero-description {

        font-size: 0.875rem;
    }


    .intel-console {

        max-width: 590px;
    }

}



/* =========================================================
   TABLET
========================================================= */

@media
(max-width: 1050px) {

    .hero {

        padding-top: 112px;
    }


    .hero-container {

        width: 90%;

        grid-template-columns:
            1fr;

        gap: 55px;
    }


    .hero-content {

        max-width: 760px;
    }


    .hero-title {

        max-width: 720px;

        font-size:
            clamp(
                3.5rem,
                8vw,
                6rem
            );
    }


    .hero-rotating-word.hero-word-long {

        font-size: 0.8em;
    }


    .hero-intelligence-visual {

        width: 100%;
    }


    .intel-console {

        max-width: 760px;
    }

}



/* =========================================================
   MOBILE
========================================================= */

@media
(max-width: 600px) {

    .hero {

        padding-top: 95px;
    }


    .hero-container {

        width: 91%;

        padding-bottom: 45px;

        gap: 45px;
    }


    .company-label {

        max-width: 100%;

        font-size: 0.875rem;

        line-height: 1.4;
    }


    .hero-title {

        max-width: 100%;

        font-size:
            clamp(
                2.8rem,
                13vw,
                4.2rem
            );
    }


    .hero-for {

        margin-top: 10px;
    }


    .hero-rotating-word.hero-word-normal {

        font-size: 0.83em;
    }


    .hero-rotating-word.hero-word-medium {

        font-size: 0.72em;
    }


    .hero-rotating-word.hero-word-long {

        font-size: 0.61em;
    }


    .tagline {

        margin-top: 18px;

        font-size: 0.875rem;

        line-height: 1.6;
    }


    .hero-description {

        margin-top: 14px;

        font-size: 0.875rem;
    }


    .hero-mini-stats {

        grid-template-columns:
            repeat(2, 1fr);
    }


    .intel-console {

        border-radius: 14px;
    }


    .intel-console-top {

        padding: 0 12px;
    }


    .intel-system-name {

        max-width: 62%;

        font-size: 0.875rem;

        line-height: 1.3;
    }


    .intel-console-id {

        padding: 16px 13px;
    }


    .intel-console-id > div > strong {

        font-size: 0.875rem;
    }


    .intel-pipeline {

        padding: 15px 9px;

        grid-template-columns:
            1fr 8px
            1fr 8px
            1fr 8px
            1fr;
    }


    .intel-stage-icon {

        width: 30px;
        height: 30px;
    }


    .intel-stage strong {

        font-size: 0.875rem;
    }


    .intel-stage small {

        font-size: 0.875rem;
    }


    .intel-program-area {

        padding: 17px 13px;
    }


    .intel-program-heading {

        gap: 7px;
    }


    .intel-program-heading h3 {

        font-size: 1.25rem;
    }


    .intel-program-description {

        font-size: 0.875rem;
    }


    .intel-program-selector {

        grid-template-columns:
            repeat(2, 1fr);
    }


    .intel-signal-area {

        grid-template-columns:
            1fr;

        padding: 10px 13px;
    }


    .intel-plus {

        display: none;
    }


    .intel-console-footer {

        padding: 11px 13px;

        flex-direction: column;

        align-items: flex-start;

        justify-content: center;

        gap: 3px;
    }

}



/* =========================================================
   REDUCED MOTION
========================================================= */

@media
(prefers-reduced-motion: reduce) {

    .hero-rotating-word {

        transition: none !important;
    }

}

/* Shared content readability: keep these after responsive component styles. */
:root {
    --text-secondary: #d1daea;
    --text-muted: #acbbd1;
    --violet: #b397ff;
    --border: rgba(180, 202, 235, 0.22);
    --border-strong: rgba(180, 202, 235, 0.36);
}

html[data-theme="light"] {
    --text-secondary: #35445d;
    --text-muted: #4c5c74;
    --violet: #6940bd;
    --cyan: #006c8c;
    --border: rgba(35, 58, 92, 0.22);
    --border-strong: rgba(35, 58, 92, 0.34);
}

.purpose-card p,
.location-card address,
.sector-card > p,
.service-card > p,
.three-card-grid p,
.pillar-grid p,
.research-intro p,
.domain-outcome p,
.programme-ledger p,
.publication-roadmap p,
.duration-card p,
.selection-list p,
.contact-card-grid p,
.intel-program-description {
    color: var(--text-secondary);
    font-size: 1rem;
    line-height: 1.75;
}

.purpose-card p {
    font-size: clamp(1.0625rem, 1.2vw, 1.1875rem);
    margin-bottom: 24px;
}

.card-index,
.card-kicker,
.section-eyebrow,
.purpose-card > small,
.location-card > small,
.location-card > p,
.location-top strong,
.sector-card > small,
.service-card > small,
.card-top span,
.card-top strong,
.tag-list span,
.recognition-grid small,
.product-meta-grid small,
.research-label,
.research-principle small,
.programme-ledger small,
.paper-code small,
.duration-card > span,
.duration-card small,
.form-field small,
.contact-card-grid span,
.sector-list span,
.footer-brand span,
.footer-links a,
.footer-bottom,
.intel-system-name,
.intel-system-status span,
.intel-system-status strong,
.intel-console-id span,
.intel-year small,
.intel-stage > span,
.intel-stage strong,
.intel-stage small,
.intel-caption,
.intel-program-type,
.intel-phase span,
.intel-phase strong,
.intel-tech-tags span,
.intel-program-btn,
.intel-signal-block > span,
.intel-console-footer {
    font-size: 0.875rem;
    line-height: 1.5;
}

.card-kicker,
.purpose-card > small {
    color: var(--text-secondary);
    font-weight: 600;
}

.purpose-icon {
    border-color: var(--violet);
    background: var(--bg-tertiary);
}

.intel-console-top,
.intel-console-footer,
.card-top,
.location-top {
    flex-wrap: wrap;
    gap: 10px;
}

.intel-console-top,
.intel-console-footer {
    padding-block: 12px;
}

.intel-program-btn {
    min-height: 44px;
    padding: 8px;
    overflow-wrap: anywhere;
}

.intel-signal-block {
    grid-template-columns: minmax(90px, auto) minmax(0, 1fr);
}

@media (max-width: 600px) {
    .intel-pipeline {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 20px 12px;
    }
    .intel-stage-line { display: none; }
}
/* Consistent, compact vertical spacing across the website. */
:root {
    --section-space: clamp(40px, 4vw, 60px);
    --subsection-space: clamp(24px, 3vw, 36px);
    --content-space: clamp(20px, 2.5vw, 32px);
}

.section { padding-block: var(--section-space); }

.subsection,
.ecosystem-showcase,
.featured-publication,
.selection-section,
.career-wrapper {
    padding-block: var(--subsection-space);
}

.section-heading { margin-bottom: var(--content-space); }
.split-intro { padding-bottom: var(--subsection-space); }

.stats-grid,
.purpose-grid,
.ecosystem-showcase,
.recognition-grid,
.location-grid,
.sector-grid,
.three-card-grid,
.research-console,
.programme-ledger,
.publication-roadmap,
.large-cta {
    margin-top: var(--content-space);
}

/* Avoid stacking a subsection's padding with the next CTA's margin. */
.subsection + .large-cta { margin-top: 0; }
.subsection:last-child { padding-bottom: 0; }

.large-cta { padding: clamp(24px, 3vw, 40px); }
.hero-container { padding-bottom: var(--content-space); }
.site-footer { padding-top: var(--subsection-space); }

.purpose-card {
    min-height: 0;
    padding: clamp(24px, 2.5vw, 32px);
}
.purpose-icon { margin-top: 24px; }
.purpose-card h3 { margin-top: 20px; }
.purpose-card > small { padding-top: 16px; }
.pillar-grid strong,
.three-card-grid h4 { margin-top: 32px; }

.process-flow,
.research-pipeline { margin-top: 28px; }
.process-flow article { min-height: 110px; padding: 16px; }

.research-pipeline {
    display: grid;
    grid-template-columns: repeat(8, minmax(0, 1fr) 14px) minmax(0, 1fr);
    gap: 8px;
}
.research-pipeline > div {
    min-width: 0;
    min-height: 104px;
    padding: 14px 6px;
    background: var(--card);
    font-size: 0.875rem;
    line-height: 1.4;
}
.research-pipeline strong {
    font-size: 0.875rem;
    line-height: 1.4;
    overflow-wrap: anywhere;
}
.research-pipeline > span { text-align: center; }
.research-pipeline > div.final { border-color: var(--violet); }

@media (max-width: 1200px) {
    .research-pipeline {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 12px;
    }
    .research-pipeline > span { display: none; }
}

@media (max-width: 600px) {
    :root {
        --section-space: 40px;
        --subsection-space: 28px;
        --content-space: 24px;
    }
    .research-pipeline > div { min-height: 88px; }
}

/* Smaller sector orbit with readable, consistently sized labels. */
.ecosystem-orbit {
    width: min(640px, 85vw);
    min-height: 0;
    aspect-ratio: 1;
    margin-top: 28px;
}
.ecosystem-center {
    width: 160px;
    height: 160px;
}
.ecosystem-center img { width: 58px; height: 58px; }
.ecosystem-center small { font-size: 0.875rem; }
.orbit-sector {
    width: 152px;
    min-width: 0;
    min-height: 48px;
    padding: 9px 10px;
    font-size: 0.875rem;
    line-height: 1.3;
    font-weight: 750;
    white-space: normal;
    overflow-wrap: anywhere;
}

/* Give larger labels their own space on phones. */
@media (max-width: 600px) {
    .ecosystem-orbit {
        width: 100%;
        aspect-ratio: auto;
        flex-direction: column;
        gap: 24px;
    }
    .ecosystem-center { width: 145px; height: 145px; }
    .orbit-ring { display: none; }
    .sector-orbit-wheel {
        position: relative;
        inset: auto;
        width: 100%;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
        animation: none;
    }
    .sector-orbit-wheel .orbit-sector {
        position: relative;
        inset: auto !important;
        transform: none !important;
        width: 100%;
        min-height: 48px;
    }
}
/* Full-width application form: avoid an empty sidebar beside long content. */
.career-wrapper {
    grid-template-columns: minmax(0, 1fr);
    gap: 24px;
}
.career-intro {
    position: static;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 12px 32px;
    align-items: start;
}
.career-intro > .section-eyebrow {
    grid-column: 1 / -1;
    margin-bottom: 0;
}
.career-intro > p { margin-top: 0; }
.career-intro .application-flow {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    margin-top: 4px;
}
.application-flow span { font-size: 0.875rem; }
.career-form {
    min-width: 0;
    width: 100%;
    padding: clamp(20px, 3vw, 32px);
}
.career-form .form-title {
    margin: 26px 0 16px;
    padding-bottom: 8px;
    font-size: 0.875rem;
}
.career-form .honeypot + .form-title { margin-top: 0; }
.career-form .form-grid { gap: 16px 20px; }
.career-form .form-grid > .form-field { margin-top: 0; }
.career-form .form-field { min-width: 0; }
.career-form .form-field label { font-size: 0.875rem; }
.career-form .form-field input,
.career-form .form-field select {
    min-height: 46px;
    padding: 10px 12px;
}

@media (min-width: 1000px) {
    .career-form .form-grid.two:has(input[type="email"]),
    .career-form .form-grid.two:has(#qualification) {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 600px) {
    .career-intro { grid-template-columns: minmax(0, 1fr); }
    .career-intro .application-flow {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0 16px;
    }
    .career-form .form-grid.two,
    .career-form .form-grid.three {
        grid-template-columns: minmax(0, 1fr);
    }
}
.career-form #applicantPhoneRegion { margin-bottom: 8px; }
.career-form .phone-code-label { font-size: 0.875rem; }
.career-form .field-error { color: #ffb4b4; font-weight: 600; }
.career-form .field-error:empty { display: none; }
html[data-theme="light"] .career-form .field-error { color: #a51d2d; }
.career-form input[aria-invalid="true"] { border-color: #de6370; }
.footer-company-details {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
}
.footer-company-details h3 { font-size: 1rem; margin-bottom: 10px; }
.footer-company-details p { font-size: 0.9375rem; line-height: 1.8; }
.footer-company-details a,
.policy-page a { color: var(--text-secondary); text-underline-offset: 4px; }
.footer-company-details a:hover,
.policy-page a:hover { color: var(--violet); }
.footer-company-details p,
.policy-page p { overflow-wrap: anywhere; }
.footer-policies { gap: 12px 24px; }
.policy-page { max-width: 960px; padding-block: 32px 48px; }
.policy-home { display: inline-block; margin-bottom: 24px; }
.policy-page h1 { font-size: clamp(2rem, 5vw, 3.5rem); line-height: 1.15; margin-bottom: 12px; }
.policy-navigation { display: flex; flex-wrap: wrap; gap: 12px 24px; margin-block: 24px; }
.policy-section { padding-block: 28px; border-top: 1px solid var(--border); scroll-margin-top: 24px; }
.policy-section h2 { font-size: 1.5rem; margin-bottom: 14px; }
.policy-section h3 { font-size: 1.0625rem; margin-top: 20px; }
.policy-section p + p { margin-top: 14px; }
@media (max-width: 600px) {
    .footer-company-details { grid-template-columns: minmax(0, 1fr); }
}/* Footer contact cards and social icons. */
.footer-company-details { grid-template-columns: repeat(2,minmax(0,1fr)); gap:24px; align-items:stretch; }
.footer-detail-card {
    position:relative;
    display:flex;
    flex-direction:column;
    min-width:0;
    padding:clamp(22px,2.5vw,36px);
    border:1px solid var(--border-strong);
    border-radius:22px;
    background:radial-gradient(ellipse at top left,rgba(138,92,255,.1),transparent 65%),var(--card);
}
.footer-detail-card::before {
    content:"";
    position:absolute;
    top:-1px;
    left:32px;
    width:64px;
    height:2px;
    border-radius:2px;
    background:var(--gradient);
}
.footer-card-eyebrow { display:block; color:var(--violet); font-size: 0.875rem; font-weight:700; line-height:1.5; letter-spacing:.08em; margin-bottom:8px; }
.footer-detail-card h3 { font-size:clamp(1.35rem,1.8vw,1.65rem); line-height:1.25; letter-spacing:-.025em; margin-bottom:24px; }
.footer-registration { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.footer-registration > div { min-width:0; padding:16px; border:1px solid var(--border); border-radius:12px; background:var(--bg-secondary); }
.footer-registration dt { color:var(--text-secondary); font-size: 0.875rem; line-height:1.4; margin-bottom:8px; }
.footer-registration dd { color:var(--text-primary); font-size:.9375rem; line-height:1.5; font-weight:600; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.footer-hours { display:flex; align-items:center; gap:10px; margin-top:20px; padding-top:16px; border-top:1px solid var(--border); font-size:.875rem; line-height:1.5; color:var(--text-secondary); }
.footer-hours svg { color:var(--cyan); }
.footer-hours strong { display:inline-block; padding:3px 10px; border-radius:20px; background:var(--bg-tertiary); color:var(--text-primary); }
.footer-hours strong { margin-left:8px; }
.footer-detail-card svg { width:24px; height:24px; flex-shrink:0; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.footer-contact-grid { display:grid; flex:1; grid-template-columns:repeat(2,minmax(0,1fr)); grid-auto-rows:1fr; gap:12px; }
.footer-contact-link { display:grid; grid-template-columns:40px minmax(0,1fr) 14px; align-items:center; gap:12px; min-width:0; min-height:104px; padding:18px 16px; border:1px solid var(--border); border-radius:12px; text-decoration:none; background:var(--bg-secondary); transition:border-color .2s ease,background .2s ease,transform .2s ease; }
.footer-contact-icon { display:grid; place-items:center; width:40px; height:40px; flex-shrink:0; border-radius:10px; color:var(--cyan); background:var(--bg-tertiary); }
.footer-contact-link.whatsapp .footer-contact-icon { color:#53df96; }
.footer-contact-link.linkedin .footer-contact-icon { color:#76baff; }
.footer-contact-link.instagram .footer-contact-icon { color:#ef9bda; }
.footer-contact-link > span:nth-child(2) { min-width:0; }
.footer-contact-link strong { display:block; color:var(--text-primary); font-size:1rem; line-height:1.4; }
.footer-contact-link small { display:block; color:var(--text-secondary); font-size: 0.875rem; overflow-wrap:anywhere; line-height:1.5; margin-top:3px; }
.footer-link-arrow { margin-left:auto; color:var(--text-muted); }
.footer-contact-link:hover { border-color:var(--violet); background:var(--bg-tertiary); }
@media (hover:hover) and (prefers-reduced-motion:no-preference) {
    .footer-contact-link:hover { transform:translateY(-3px); }
}
.footer-contact-link:focus-visible,.footer-policies a:focus-visible { outline:2px solid var(--cyan); outline-offset:4px; }
.footer-policies { padding-top:20px; gap:10px; }
.footer-policies a { padding:8px 12px; border-radius:8px; border:1px solid transparent; font-size: 0.875rem; }
.footer-policies a:hover { border-color:var(--border); background:var(--bg-tertiary); }
html[data-theme="light"] .footer-contact-link.whatsapp .footer-contact-icon { color:#13763e; }
html[data-theme="light"] .footer-contact-link.linkedin .footer-contact-icon { color:#0967b0; }
html[data-theme="light"] .footer-contact-link.instagram .footer-contact-icon { color:#a33186; }
@media(max-width:1100px) { .footer-company-details { grid-template-columns:minmax(0,1fr); } }
@media(max-width:600px) {
    .footer-company-details { gap:16px; }
    .footer-contact-grid { grid-template-columns:minmax(0,1fr); }
    .footer-contact-link { min-height:88px; }
    .footer-detail-card { padding:22px; border-radius:18px; }
    .footer-detail-card h3 { margin-bottom:20px; }
}
@media(max-width:420px) { .footer-registration { grid-template-columns:minmax(0,1fr); } }

/* Final presentation and keyboard-accessibility polish. */
.skip-link { position:fixed; top:8px; left:16px; z-index:10000; padding:10px 18px; border-radius:8px; background:var(--text-primary); color:var(--bg-primary); transform:translateY(-160%); }
.skip-link:focus { transform:translateY(0); }
a:focus-visible, button:focus-visible, select:focus-visible, input:focus-visible, textarea:focus-visible { outline:2px solid var(--cyan); outline-offset:4px; }
.form-note a, .career-intro p a { color:var(--cyan); text-underline-offset:4px; }
.application-selector label:has(input:focus-visible) { outline:2px solid var(--cyan); outline-offset:4px; border-radius:9px; }
.application-selector label { position:relative; }
.application-selector input { display:block; position:absolute; width:1px; height:1px; opacity:0; }
.purpose-card, .location-card, .sector-card, .service-card { border-radius:16px; }
.section-eyebrow { letter-spacing:.1em; }
@media(prefers-reduced-motion:reduce) {
    *, *::before, *::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; scroll-behavior:auto !important; }
}

/* Two locations remain after removal of the Vancouver collaboration listing. */
.location-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 800px) { .location-grid { grid-template-columns: minmax(0, 1fr); } }

/* Application controls: consistent sizing and accessible search results. */
.career-form .form-grid.two.personal-information-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    align-items: start;
    gap: 20px;
}
.personal-information-grid > .form-field { grid-column: span 2; }
.personal-information-grid > .form-field:has(#applicantName),
.personal-information-grid > .form-field:has(#applicantEmail) { grid-column: span 3; }
.personal-information-grid > .form-field:has(#applicantPhone) { grid-column: 1 / -1; }
.personal-information-grid > .form-field:has(#applicantPhone) {
    display: grid;
    grid-template-columns: minmax(180px, 1fr) minmax(0, 2fr);
    gap: 8px 16px;
}
.personal-information-grid label[for="applicantPhone"] { grid-column: 2; grid-row: 1; }
.personal-information-grid .phone-code-label { grid-column: 1; grid-row: 1; }
.career-form .personal-information-grid #applicantPhoneRegion { grid-column: 1; grid-row: 2; margin-bottom: 0; }
.personal-information-grid #applicantPhone { grid-column: 2; grid-row: 2; }
.personal-information-grid #phoneHelp,
.personal-information-grid #phoneError { grid-column: 2; }
.career-form .form-field input,
.career-form .form-field select { min-height: 48px; font-size: 1rem; }
.career-form input[type="date"] { color-scheme: dark; }
html[data-theme="light"] .career-form input[type="date"] { color-scheme: light; }
.career-form input[type="date"]::-webkit-calendar-picker-indicator { cursor: pointer; padding: 4px; }
.city-field { position: relative; }
.city-suggestions {
    position: absolute;
    top: 78px;
    inset-inline: 0;
    z-index: 30;
    max-height: 280px;
    overflow-y: auto;
    padding: 6px;
    border: 1px solid var(--border-strong);
    border-radius: 10px;
    background: var(--card-solid);
    box-shadow: var(--shadow);
}
.city-suggestions[hidden] { display: none; }
.city-suggestions [role="option"] { padding: 12px; border-radius: 6px; cursor: pointer; font-size: 1rem; line-height: 1.4; }
.city-suggestions [role="option"]:hover,
.city-suggestions [aria-selected="true"] { background: var(--bg-tertiary); outline: 1px solid var(--violet); }
.city-credit a { color: var(--text-secondary); text-underline-offset: 3px; }
.date-help-row { display: flex; align-items: start; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.date-today { min-height: 36px; padding: 6px 10px; border: 1px solid var(--border-strong); border-radius: 6px; background: var(--bg-secondary); color: var(--text-primary); font-size: .875rem; cursor: pointer; }
.date-today:hover { border-color: var(--violet); }
.date-today:focus-visible { outline: 2px solid var(--cyan); outline-offset: 3px; }
@media (max-width: 800px) {
    .career-form .form-grid.two.personal-information-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .personal-information-grid > .form-field,
    .personal-information-grid > .form-field:has(#applicantName),
    .personal-information-grid > .form-field:has(#applicantEmail) { grid-column: auto; }
}
@media (max-width: 600px) {
    .career-form .form-grid.two.personal-information-grid { grid-template-columns: minmax(0, 1fr); }
    .personal-information-grid > .form-field:has(#applicantPhone) { display: block; }
    .career-form .personal-information-grid #applicantPhoneRegion { margin-bottom: 8px; }
}

/* A sequential light travels from the research question to its impact. */
.research-pipeline > div {
    position: relative;
    isolation: isolate;
    transition: transform 220ms ease, border-color 220ms ease;
}
.research-pipeline > div::before {
    content: "";
    position: absolute;
    inset: -1px;
    z-index: -1;
    border: 1px solid var(--cyan);
    border-radius: inherit;
    background: linear-gradient(135deg, rgba(47, 210, 255, .12), rgba(138, 92, 255, .12));
    box-shadow: 0 0 22px rgba(47, 210, 255, .16), inset 0 0 16px rgba(138, 92, 255, .08);
    opacity: 0;
}
.research-pipeline > :nth-child(1) { --flow-delay: 0s; }
.research-pipeline > :nth-child(2) { --flow-delay: .5s; }
.research-pipeline > :nth-child(3) { --flow-delay: 1s; }
.research-pipeline > :nth-child(4) { --flow-delay: 1.5s; }
.research-pipeline > :nth-child(5) { --flow-delay: 2s; }
.research-pipeline > :nth-child(6) { --flow-delay: 2.5s; }
.research-pipeline > :nth-child(7) { --flow-delay: 3s; }
.research-pipeline > :nth-child(8) { --flow-delay: 3.5s; }
.research-pipeline > :nth-child(9) { --flow-delay: 4s; }
.research-pipeline > :nth-child(10) { --flow-delay: 4.5s; }
.research-pipeline > :nth-child(11) { --flow-delay: 5s; }
.research-pipeline > :nth-child(12) { --flow-delay: 5.5s; }
.research-pipeline > :nth-child(13) { --flow-delay: 6s; }
.research-pipeline > :nth-child(14) { --flow-delay: 6.5s; }
.research-pipeline > :nth-child(15) { --flow-delay: 7s; }
.research-pipeline > :nth-child(16) { --flow-delay: 7.5s; }
.research-pipeline > :nth-child(17) { --flow-delay: 8s; }
@media (prefers-reduced-motion: no-preference) {
    .research-pipeline.flow-ready > div::before {
        animation: research-stage-glow 10s ease-in-out var(--flow-delay) infinite;
        animation-play-state: paused;
    }
    .research-pipeline.flow-ready > span {
        animation: research-arrow-flow 10s ease-in-out var(--flow-delay) infinite;
        animation-play-state: paused;
    }
    .research-pipeline.flow-visible > div::before,
    .research-pipeline.flow-visible > span { animation-play-state: running; }
}
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
    .research-pipeline > div:hover { transform: translateY(-4px); border-color: var(--cyan); }
}
@keyframes research-stage-glow {
    0%, 20%, 100% { opacity: 0; }
    5%, 11% { opacity: 1; }
}
@keyframes research-arrow-flow {
    0%, 18%, 100% { opacity: .5; transform: translateX(0); }
    6%, 10% { opacity: 1; transform: translateX(3px); color: var(--cyan); }
}

/* Readable type and content-led spacing at every viewport size. */
body { font-size: 1rem; }
p { line-height: 1.65; }
.hero-description,
.form-field input,
.form-field select,
.form-field textarea,
.consent-row,
.policy-page p { font-size: 1rem; }
.section-heading h2,
.large-heading { font-size: clamp(2rem, 4vw, 3.75rem); line-height: 1.08; }
.display-heading { font-size: clamp(2.25rem, 5vw, 4.5rem); line-height: 1.05; }
.hero-container { gap: clamp(24px, 3vw, 40px); }
.about-intro,
.split-intro,
.product-hero,
.research-intro,
.featured-publication,
.selection-section,
.contact-layout { gap: clamp(24px, 3vw, 40px); }
.sector-directory { gap: 32px; }
.services-grid { margin-top: var(--content-space); }
.sector-card,
.service-card,
.pillar-grid article,
.three-card-grid article,
.publication-roadmap article,
.duration-card,
.contact-card-grid article { min-height: 0; }
.pillar-grid strong,
.three-card-grid h4,
.contact-card-grid strong { margin-top: 24px; }
.research-console { min-height: 0; }
.research-domain-index { padding-block: 20px; }
.research-domain-screen { padding: clamp(20px, 3vw, 32px); }
.phone-shell { height: auto; max-width: 100%; }
.phone-screen { height: auto; }
.product-visual { min-height: 0; padding-block: 20px; }
.phone-header,
.paper-brand { flex-wrap: wrap; gap: 8px; }
.intel-program-selector { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.intel-console, .career-form, .service-card, .sector-card { overflow-wrap: anywhere; }
.btn { white-space: normal; text-align: center; }
.nav-menu { gap: 12px; }
.nav-link { letter-spacing: 0.02em; }
.brand-full { max-width: 180px; }
.policy-page { max-width: 800px; }

@media (max-width: 1200px) {
    .nav-link { font-size: 0.875rem; }
    .navbar { gap: 16px; }
}
@media (max-width: 600px) {
    .hero-container { gap: 24px; }
    .hero-description { font-size: 1rem; }
    .section-heading { gap: 10px; }
    .intel-signal-block { grid-template-columns: minmax(0, 1fr); }
    .intel-console-footer { grid-template-columns: minmax(0, 1fr); }
    .research-pipeline { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .hero-mini-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .phone-shell { width: min(330px, 100%); }
    .phone-screen { padding: 24px 14px; }
    .large-cta { gap: 24px; }
}
/* Sector ecosystem and Sustainable Development Goals alignment. */
.ecosystem-impact-layout {
    display:grid;
    grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);
    gap:clamp(24px,3vw,44px);
    align-items:center;
    margin-top:32px;
}
.ecosystem-visual-panel { min-width:0; padding:20px 0; }
.ecosystem-visual-caption { display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px; padding-inline:20px; color:var(--text-secondary); font-size:.875rem; font-weight:650; letter-spacing:.06em; }
.ecosystem-visual-caption > span:first-child { color:var(--cyan); }
.ecosystem-impact-layout .ecosystem-orbit {
    width:100%;
    max-width:640px;
    margin:16px auto;
    background:radial-gradient(circle,rgba(138,92,255,.14),rgba(47,210,255,.035) 45%,transparent 70%);
}
.ecosystem-impact-layout .orbit-ring-a { width:42%; height:42%; border-color:rgba(138,92,255,.35); }
.ecosystem-impact-layout .orbit-ring-b { width:60%; height:60%; border-color:rgba(47,210,255,.28); }
.ecosystem-impact-layout .orbit-ring-c { width:74%; height:74%; border-color:rgba(138,92,255,.3); box-shadow:0 0 40px rgba(138,92,255,.06); }
.ecosystem-impact-layout .ecosystem-center { width:164px; height:164px; border-color:rgba(138,92,255,.65); box-shadow:0 0 45px rgba(138,92,255,.2),inset 0 0 24px rgba(47,210,255,.04); }
.ecosystem-impact-layout .ecosystem-center small { font-size:.75rem; color:var(--text-secondary); }
.ecosystem-impact-layout .orbit-sector { width:22%; max-width:144px; min-height:52px; border-radius:12px; padding:10px 6px; font-size:.875rem; line-height:1.35; background:var(--card-solid); border-color:var(--border-strong); transition:border-color .2s,box-shadow .2s,color .2s; }
.ecosystem-impact-layout .orbit-sector:hover,
.ecosystem-impact-layout .orbit-sector:focus-visible { border-color:var(--cyan); color:var(--text-primary); box-shadow:0 0 22px rgba(47,210,255,.16); }
.ecosystem-impact-layout .ecosystem-live-info { width:calc(100% - 24px); margin:0 auto; padding:16px 20px; border-radius:14px; background:linear-gradient(110deg,rgba(138,92,255,.09),transparent),var(--card); }
.ecosystem-impact-layout .ecosystem-live-info p { font-size:.9375rem; line-height:1.55; }
.ecosystem-sdg-panel { min-width:0; padding:clamp(24px,2.6vw,36px); border:1px solid var(--border-strong); border-radius:22px; background:radial-gradient(ellipse at top right,rgba(47,210,255,.07),transparent 60%),var(--card); }
.sdg-kicker { display:flex; align-items:center; gap:10px; color:var(--text-secondary); font-size:.875rem; font-weight:700; letter-spacing:.08em; }
.sdg-kicker > span { font-size:23px; color:var(--cyan); }
.ecosystem-sdg-panel h3 { margin:14px 0 18px; font-size:clamp(1.8rem,2.6vw,2.65rem); line-height:1.12; letter-spacing:-.04em; }
.ecosystem-sdg-panel h3 > span { color:var(--cyan); }
.sdg-intro { font-size:1rem; line-height:1.65; }
.sdg-intro strong { color:var(--text-primary); font-weight:600; }
.sdg-priorities { display:grid; gap:10px; margin-block:24px; }
.sdg-priority { display:grid; grid-template-columns:52px minmax(0,1fr) 14px; align-items:center; gap:14px; padding:14px; border:1px solid var(--border); border-left:3px solid var(--sdg-color); border-radius:10px; background:var(--bg-secondary); text-decoration:none; }
.sdg-4 { --sdg-color:#c5192d; }
.sdg-9 { --sdg-color:#fd6925; }
.sdg-12 { --sdg-color:#bf8b2e; }
.sdg-17 { --sdg-color:#19486a; }
.sdg-number { display:flex; flex-direction:column; align-items:center; justify-content:center; min-height:54px; border-radius:8px; color:white; background:var(--sdg-color); font-size:1.5rem; font-weight:750; line-height:1.1; }
.sdg-number > small { font-size:.625rem; font-weight:750; letter-spacing:.08em; margin-bottom:3px; }
.sdg-9 .sdg-number,.sdg-12 .sdg-number { color:#171b25; }
.sdg-priority strong { display:block; font-size:.9375rem; line-height:1.35; }
.sdg-priority > span:nth-child(2) > small { display:block; margin-top:5px; color:var(--text-secondary); font-size:.875rem; line-height:1.45; }
.sdg-arrow { color:var(--text-secondary); }
.sdg-priority:hover { border-color:var(--sdg-color); background:var(--bg-tertiary); }
.sdg-explore { display:flex; align-items:center; justify-content:space-between; gap:12px; padding-top:16px; border-top:1px solid var(--border); color:var(--text-secondary); font-size:.875rem; text-decoration:underline; text-underline-offset:4px; }
@media (max-width:1199px) {
    .ecosystem-impact-layout { grid-template-columns:minmax(0,1fr); }
    .ecosystem-sdg-panel { width:100%; }
    .sdg-priorities { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:600px) {
    .ecosystem-impact-layout { margin-top:24px; gap:24px; }
    .ecosystem-impact-layout .ecosystem-orbit { padding:16px 0; gap:24px; }
    .ecosystem-impact-layout .sector-orbit-wheel .orbit-sector { width:100%; max-width:none; }
    .ecosystem-visual-caption { padding-inline:0; font-size:.75rem; }
    .ecosystem-impact-layout .ecosystem-live-info { width:100%; }
    .sdg-priorities { grid-template-columns:minmax(0,1fr); }
    .ecosystem-sdg-panel { padding:22px; }
}
/* Discover → Build → Deliver: staggered entrance and a travelling glow. */
.pillar-grid > article {
    position:relative;
    isolation:isolate;
    --pillar-accent:var(--cyan);
    --pillar-entry-delay:0s;
    --pillar-glow-delay:0s;
}
.pillar-grid > article:nth-child(2) { --pillar-accent:var(--blue); --pillar-entry-delay:.12s; --pillar-glow-delay:1.8s; }
.pillar-grid > article:nth-child(3) { --pillar-accent:var(--violet); --pillar-entry-delay:.24s; --pillar-glow-delay:3.6s; }
.pillar-grid > article::before {
    content:"";
    position:absolute;
    inset:-1px;
    z-index:-1;
    pointer-events:none;
    border:1px solid var(--pillar-accent);
    border-radius:inherit;
    background:linear-gradient(125deg,rgba(47,210,255,.07),rgba(138,92,255,.035) 55%,transparent);
    box-shadow:inset 0 1px 0 var(--pillar-accent),0 8px 24px rgba(47,210,255,.06);
    opacity:0;
}
@media (prefers-reduced-motion:no-preference) {
    .pillar-grid > article { transition:transform .25s ease,border-color .25s ease; }
    .pillar-grid > .pillar-entered { animation:pillar-arrive .65s ease-out var(--pillar-entry-delay) backwards; }
    .pillar-grid > .pillar-entered::before { animation:pillar-glow 6.4s ease-in-out var(--pillar-glow-delay) infinite; animation-play-state:paused; }
    .pillar-grid > .pillar-running::before { animation-play-state:running; }
}
@media (hover:hover) and (prefers-reduced-motion:no-preference) {
    .pillar-grid > article:hover { transform:translateY(-5px); border-color:var(--pillar-accent); }
}
@keyframes pillar-arrive {
    from { opacity:0; transform:translateY(18px); }
    to { opacity:1; transform:translateY(0); }
}
@keyframes pillar-glow {
    0%,38%,100% { opacity:0; }
    12%,22% { opacity:1; }
}

/* Crawlable service links retain a visible keyboard target below the introduction. */
.service-directory { margin-bottom:24px; line-height:1.9; }
.service-directory a { text-decoration:underline; text-underline-offset:3px; }
.service-card[id] { scroll-margin-top:110px; }