@font-face {
    font-family: 'TM Bespoke';
    src: url("/resources/fonts/TM_Bespoke/tm01_bespoke-webfont.woff2") format("woff2"),
         url("/resources/fonts/TM_Bespoke/tm01_bespoke-webfont.woff") format("woff"),
         url("/resources/fonts/TM_Bespoke/tm01_bespoke-webfont.otf") format("opentype");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

:root {
    --ink: #111416;
    --paper: #ffffff;
    --paper-bright: #ffffff;
    --paper-deep: #f2f2f2;
    --line: rgba(17, 20, 22, .20);
    --line-soft: rgba(17, 20, 22, .09);
    --muted: #626262;
    --orange: #f5a000;
    --teal: #176f66;
    --coral: #e85b40;
    --gold: #edb84a;
    --blue: #5c83c6;
    --violet: #8370d8;
    --page-accent: #176f66;
    --page-accent-2: #e85b40;
    --gutter: clamp(20px, 4vw, 64px);
    --wrap: 1460px;
    --radius: 8px;
    --shadow: 0 22px 58px rgba(17, 20, 22, .14);
    --display-font: 'Poppins', 'Open Sans', 'Segoe UI', Arial, sans-serif;
    --accent-font: 'TM Bespoke', 'Poppins', system-ui, sans-serif;
    --body-font: 'Open Sans', 'Segoe UI', Arial, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background: var(--paper);
    color: var(--ink);
    font-family: var(--body-font);
    font-size: 16px;
    line-height: 1.55;
    overflow-x: hidden;
}
a { color: inherit; }
img { display: block; max-width: 100%; }
button, input, select, textarea { font: inherit; }
::selection { background: var(--page-accent); color: #fff; }

body::before {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: -4;
    opacity: .18;
    background-image:
        linear-gradient(rgba(245,160,0,.10) 1px, transparent 1px),
        linear-gradient(90deg, rgba(17,20,22,.045) 1px, transparent 1px);
    background-size: 52px 52px;
    mask-image: linear-gradient(to bottom, #000 0%, transparent 60%);
}

.ambient {
    display: none;
    position: fixed;
    width: 48vw;
    height: 48vw;
    min-width: 460px;
    min-height: 460px;
    border-radius: 50%;
    filter: blur(110px);
    opacity: .075;
    pointer-events: none;
    z-index: -5;
    animation: ambient-drift 18s ease-in-out infinite alternate;
}
.ambient--one { top: -25vw; right: -14vw; background: var(--page-accent); }
.ambient--two { bottom: -28vw; left: -18vw; background: var(--page-accent-2); animation-delay: -8s; }

@keyframes ambient-drift {
    from { transform: translate3d(-2%, 0, 0) scale(.92); }
    to { transform: translate3d(5%, 7%, 0) scale(1.08); }
}

.wrap,
.site-header__inner,
.site-footer__inner {
    width: min(var(--wrap), calc(100% - (var(--gutter) * 2)));
    margin: 0 auto;
}

.site-header {
    position: sticky;
    top: 0;
    z-index: 100;
    background: rgba(255, 255, 255, .93);
    border-top: 7px solid var(--orange);
    border-bottom: 1px solid rgba(17,20,22,.24);
    backdrop-filter: blur(16px) saturate(140%);
    transition: transform .35s ease, background .35s ease;
}
.site-header.is-hidden { transform: translateY(-100%); }
.site-header__inner {
    min-height: 86px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
}
.brand {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 14px;
    text-decoration: none;
    font-family: var(--display-font);
    font-size: 28px;
    font-weight: 800;
    letter-spacing: 0;
}
.brand::before {
    content: "";
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    border: 1px solid var(--ink);
    background: #fff url("/resources/sitemedia/Outside.png") 50% 50% / contain no-repeat;
}
.brand i {
    width: 26px;
    height: 6px;
    border-radius: 0;
    background: var(--orange);
    box-shadow: none;
}
.site-nav { display: flex; align-items: center; gap: clamp(18px, 2.4vw, 38px); }
.site-nav a {
    padding: 8px 0;
    border-bottom: 1px solid transparent;
    text-decoration: none;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0;
}
.site-nav a:hover, .site-nav a.active { border-color: currentColor; }
.nav-toggle {
    display: none;
    position: relative;
    width: 46px;
    height: 46px;
    flex: 0 0 46px;
    border: 1px solid rgba(17,20,22,.18);
    border-radius: 999px;
    padding: 0;
    background: var(--ink);
    cursor: pointer;
}
.nav-toggle span {
    position: absolute;
    left: 13px;
    right: 13px;
    height: 2px;
    border-radius: 999px;
    background: #fff;
    transform-origin: center;
}
.nav-toggle span:nth-child(1) { top: 15px; }
.nav-toggle span:nth-child(2) { top: 22px; }
.nav-toggle span:nth-child(3) { top: 29px; }
.nav-toggle.is-active span:nth-child(1) {
    top: 22px;
    transform: rotate(45deg);
}
.nav-toggle.is-active span:nth-child(2) {
    opacity: 0;
    transform: scaleX(0);
}
.nav-toggle.is-active span:nth-child(3) {
    top: 22px;
    transform: rotate(-45deg);
}

.hero {
    position: relative;
    min-height: min(780px, 84vh);
    display: grid;
    align-items: center;
    padding: clamp(84px, 10vw, 150px) 0 clamp(74px, 9vw, 130px);
}
.hero--compact { min-height: 0; }
.hero--shop { overflow: hidden; }
.hero::after {
    content: "";
    position: absolute;
    left: var(--gutter);
    right: var(--gutter);
    bottom: 0;
    height: 1px;
    background: var(--ink);
}
.hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(380px, .72fr);
    gap: clamp(48px, 8vw, 120px);
    align-items: center;
}
.hero-grid--product { grid-template-columns: minmax(0, .95fr) minmax(450px, .8fr); }
.hero-copy { position: relative; z-index: 2; }
.eyebrow {
    margin: 0 0 19px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: uppercase;
    color: var(--orange);
}
h1, h2, h3, p { margin-top: 0; }
h1 {
    max-width: 1120px;
    margin-bottom: 30px;
    font-size: 7rem;
    line-height: .98;
    letter-spacing: 0;
    font-family: var(--display-font);
    font-weight: 400;
    text-transform: uppercase;
    overflow-wrap: break-word;
}
.hero--product h1 { font-size: 6.2rem; }
.lede {
    max-width: 820px;
    margin-bottom: 0;
    font-size: clamp(20px, 2vw, 30px);
    line-height: 1.36;
    letter-spacing: 0;
    overflow-wrap: break-word;
}
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 38px; }
.button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 50px;
    padding: 13px 20px;
    border: 1px solid var(--ink);
    border-radius: var(--radius);
    text-decoration: none;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: uppercase;
    cursor: pointer;
    transition: transform .2s ease, background .2s ease, color .2s ease, opacity .2s ease;
}
.button:hover { transform: translateY(-2px); }
.button--dark { background: var(--ink); color: #fff; }
.button--dark:hover { background: var(--orange); color: var(--ink); }
.button--light { background: #fff; color: var(--ink); }
.button--light:hover { background: var(--paper-deep); }

.colour-ribbon {
    height: 8px;
    display: grid;
    grid-template-columns: 1.5fr 1fr .7fr 1.3fr .9fr;
}
.colour-ribbon i:nth-child(1) { background: var(--teal); }
.colour-ribbon i:nth-child(2) { background: #84c9bd; }
.colour-ribbon i:nth-child(3) { background: var(--gold); }
.colour-ribbon i:nth-child(4) { background: var(--coral); }
.colour-ribbon i:nth-child(5) { background: var(--violet); }
.colour-ribbon--image i:nth-child(1) { background: var(--coral); }
.colour-ribbon--image i:nth-child(2) { background: var(--gold); }
.colour-ribbon--image i:nth-child(3) { background: var(--blue); }
.colour-ribbon--image i:nth-child(4) { background: var(--violet); }
.colour-ribbon--image i:nth-child(5) { background: var(--teal); }

.hero-console,
.optics-console {
    position: relative;
    min-height: 520px;
    overflow: hidden;
    border: 1px solid rgba(17,20,22,.25);
    border-radius: var(--radius);
    background: #111416;
    color: #fff;
    box-shadow: var(--shadow);
}
.hero-console::after,
.optics-console::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(135deg, rgba(255,255,255,.08), transparent 35%);
}
.hero-console__grid {
    position: absolute;
    inset: 0;
    opacity: .22;
    background-image:
        linear-gradient(rgba(255,255,255,.14) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.14) 1px, transparent 1px);
    background-size: 38px 38px;
}
.hero-console__scope {
    position: absolute;
    left: 7%; right: 7%; top: 23%; height: 48%;
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 20px;
    border-top: 1px solid rgba(255,255,255,.25);
    border-bottom: 1px solid rgba(255,255,255,.25);
}
.hero-console__scope i {
    flex: 1;
    height: var(--v);
    min-width: 2px;
    background: linear-gradient(to top, var(--page-accent), var(--page-accent-2));
    opacity: .82;
    transform-origin: center;
    animation: scope-pulse 2.4s ease-in-out infinite alternate;
    animation-delay: calc(var(--n) * -43ms);
}
@keyframes scope-pulse { from { transform: scaleY(.65); opacity: .52; } to { transform: scaleY(1.1); opacity: .95; } }
.hero-console__labels {
    position: absolute;
    left: 8%; right: 8%; bottom: 7%;
    display: flex;
    justify-content: space-between;
    font-size: 9px;
    letter-spacing: 0;
    color: rgba(255,255,255,.62);
}
.hero-console__scan {
    position: absolute;
    top: 0; bottom: 0; width: 1px;
    background: #fff;
    box-shadow: 0 0 24px 4px var(--page-accent-2);
    animation: scan-console 5.6s linear infinite;
}
@keyframes scan-console { from { left: 7%; } to { left: 93%; } }

.optics-console { min-height: 520px; background: radial-gradient(circle at 50% 43%, #242b2b 0%, #111416 46%, #070809 100%); }
.optics-console__lens {
    position: absolute;
    width: 270px; height: 270px;
    left: 50%; top: 45%;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    background:
        radial-gradient(circle at 42% 36%, rgba(255,255,255,.18), transparent 18%),
        radial-gradient(circle at 50% 50%, var(--page-accent) 0%, rgba(0,0,0,.1) 16%, var(--page-accent-2) 42%, #091315 70%);
    filter: saturate(.9);
    box-shadow: inset 0 0 55px #000, 0 0 0 12px rgba(255,255,255,.04), 0 0 90px rgba(255,255,255,.08);
    animation: lens-breathe 7s ease-in-out infinite alternate;
}
@keyframes lens-breathe { from { transform: translate(-50%,-50%) scale(.96) rotate(-3deg); } to { transform: translate(-50%,-50%) scale(1.04) rotate(3deg); } }
.optics-console__rings i {
    position: absolute;
    left: 50%; top: 45%;
    width: calc(310px + (var(--i, 0) * 55px));
    height: calc(310px + (var(--i, 0) * 55px));
    transform: translate(-50%, -50%);
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 50%;
}
.optics-console__rings i:nth-child(1){--i:0}.optics-console__rings i:nth-child(2){--i:1}.optics-console__rings i:nth-child(3){--i:2}.optics-console__rings i:nth-child(4){--i:3}
.optics-console__spectrum {
    position: absolute;
    inset: auto 8% 18% 8%; height: 4px;
    background: linear-gradient(90deg, #5c83c6, #8370d8, #d97886, #edb84a, #82c8bc);
    filter: blur(.15px);
}
.optics-console__data {
    position: absolute;
    inset: auto 8% 5% 8%;
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 3px 12px;
    font-size: 9px;
    letter-spacing: 0;
}
.optics-console__data span { color: rgba(255,255,255,.45); }
.optics-console__data strong { font-size: 9px; font-weight: 700; }

.rule-section { border-top: 1px solid var(--ink); padding: clamp(64px, 8vw, 118px) 0; }
.rule-section--soft { background: var(--paper-deep); }
.rule-section--dark { background: var(--ink); color: #fff; }
.section-heading {
    display: grid;
    grid-template-columns: minmax(180px, .56fr) 2fr;
    gap: 46px;
    margin-bottom: clamp(48px, 6vw, 78px);
}
.section-heading h2 {
    max-width: 940px;
    margin-bottom: 20px;
    font-size: clamp(36px, 4.5vw, 66px);
    line-height: 1.02;
    letter-spacing: 0;
    font-family: var(--display-font);
    font-weight: 400;
    text-transform: uppercase;
}
.section-heading p { max-width: 760px; margin-bottom: 0; font-size: 18px; }
.section-heading--light p { color: rgba(255,255,255,.72); }
.section-heading--spaced { margin-top: clamp(72px, 8vw, 128px); }

.product-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.product-card {
    --mx: 50%; --my: 50%;
    position: relative;
    isolation: isolate;
    overflow: hidden;
    min-height: 470px;
    padding: clamp(30px, 4vw, 56px);
    border: 1px solid rgba(17,20,22,.2);
    border-radius: var(--radius);
    background: rgba(255,255,255,.88);
    display: flex;
    flex-direction: column;
    box-shadow: 0 18px 54px rgba(17,20,22,.06);
    transition: transform .28s ease, box-shadow .28s ease;
}
.product-card:hover { transform: translateY(-5px); box-shadow: 0 30px 80px rgba(17,20,22,.12); }
.product-card__wash {
    position: absolute;
    z-index: -1;
    width: 520px; height: 520px;
    left: calc(var(--mx) - 260px); top: calc(var(--my) - 260px);
    border-radius: 50%;
    opacity: .16;
    background: radial-gradient(circle, var(--card-accent) 0%, var(--card-accent-2) 42%, transparent 70%);
    filter: blur(28px);
    transition: opacity .2s ease;
}
.product-card:hover .product-card__wash { opacity: .28; }
.product-card__top { display: flex; justify-content: space-between; gap: 24px; align-items: flex-start; }
.product-card__tag { font-size: 10px; font-weight: 800; letter-spacing: 0; text-transform: uppercase; }
.product-card__price { font-size: 14px; font-weight: 760; white-space: nowrap; }
.product-card__signal {
    height: 84px;
    margin: clamp(46px, 7vw, 92px) 0 30px;
    display: flex;
    align-items: end;
    gap: 8px;
}
.product-card__signal span { flex: 1; border-radius: 999px; background: linear-gradient(to top, var(--card-accent), var(--card-accent-2)); }
.product-card__signal span:nth-child(1){height:28%}.product-card__signal span:nth-child(2){height:64%}.product-card__signal span:nth-child(3){height:100%}.product-card__signal span:nth-child(4){height:52%}.product-card__signal span:nth-child(5){height:76%}
.product-card h2 { margin: 0 0 12px; font-size: clamp(42px, 4.4vw, 68px); line-height: 1; letter-spacing: 0; font-family: var(--display-font); font-weight: 400; text-transform: uppercase; }
.product-card__strap { max-width: 600px; margin-bottom: 12px !important; font-size: 21px !important; line-height: 1.25; font-weight: 650; letter-spacing: 0; }
.product-card p { max-width: 640px; margin-bottom: 28px; color: #343735; font-size: 16px; }
.product-card__links { margin-top: auto; display: flex; align-items: center; gap: 20px; flex-wrap: wrap; }
.text-link { font-size: 11px; font-weight: 800; letter-spacing: 0; text-transform: uppercase; text-decoration-thickness: 1px; text-underline-offset: 4px; }

.tool-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.tool-tile {
    --mx: 50%; --my: 50%;
    position: relative;
    min-height: 360px;
    overflow: hidden;
    padding: 24px;
    border: 1px solid rgba(17,20,22,.22);
    border-radius: var(--radius);
    background: rgba(255,255,255,.56);
    display: flex;
    flex-direction: column;
    text-decoration: none;
    transition: transform .25s ease, background .25s ease;
}
.tool-tile:hover { transform: translateY(-4px); background: rgba(255,255,255,.82); }
.tool-tile__type { font-size: 9px; font-weight: 800; letter-spacing: 0; text-transform: uppercase; }
.tool-tile__orb {
    width: 120px; height: 120px;
    margin: 45px auto 42px;
    border-radius: 50%;
    background: radial-gradient(circle at 35% 30%, rgba(255,255,255,.9), var(--tile-accent-2) 18%, var(--tile-accent) 52%, #111 115%);
    box-shadow: 0 20px 55px color-mix(in srgb, var(--tile-accent) 25%, transparent);
    transition: transform .35s ease;
}
.tool-tile:hover .tool-tile__orb { transform: scale(1.08) rotate(8deg); }
.tool-tile strong { margin-top: auto; font-size: 24px; line-height: 1.02; letter-spacing: 0; font-family: var(--display-font); font-weight: 400; text-transform: uppercase; }
.tool-tile p { margin: 10px 0 22px; color: #454745; font-size: 14px; }
.tool-tile__price { display: flex; justify-content: space-between; align-items: center; font-size: 11px; font-weight: 800; letter-spacing: 0; text-transform: uppercase; }
.tool-tile__price b { font-size: 20px; }

.feature-list { border-top: 1px solid var(--line); }
.feature-row {
    display: grid;
    grid-template-columns: minmax(220px, .8fr) 2fr;
    gap: 42px;
    padding: 32px 0;
    border-bottom: 1px solid var(--line);
}
.feature-row h3 { margin: 0; font-size: 22px; letter-spacing: 0; }
.feature-row p { max-width: 850px; margin: 0; color: #343735; font-size: 17px; }
.feature-list--colour .feature-row { position: relative; padding-left: 18px; }
.feature-list--colour .feature-row::before { content:""; position:absolute; left:0; top:26px; bottom:26px; width:4px; border-radius:999px; background:linear-gradient(var(--page-accent),var(--page-accent-2)); opacity:.75; }

.callout {
    display: grid;
    grid-template-columns: 1.4fr .7fr;
    gap: 62px;
    padding: clamp(42px, 6vw, 82px);
    border-radius: var(--radius);
    background: var(--ink);
    color: #fff;
    overflow: hidden;
}
.callout--colour { position: relative; background: linear-gradient(135deg, #111416 0%, #111416 55%, color-mix(in srgb, var(--page-accent) 55%, #111416) 100%); }
.callout--colour::after { display:none; }
.callout h2 { max-width: 850px; margin-bottom: 22px; font-size: clamp(42px, 5.5vw, 78px); line-height: 1; letter-spacing: 0; font-family: var(--display-font); font-weight: 400; text-transform: uppercase; }
.callout p { max-width: 730px; margin: 0; font-size: 18px; }
.callout__side { position: relative; z-index:2; display:flex; flex-direction:column; justify-content:flex-end; align-items:flex-start; }
.callout .button { margin-top: 28px; border-color:#fff; background:#fff; color:#111; }

.finesync-demo {
    border: 1px solid rgba(17,20,22,.22);
    border-radius: var(--radius);
    overflow: hidden;
    background: #111416;
    color: #fff;
    box-shadow: var(--shadow);
}
.demo-toolbar {
    min-height: 52px;
    padding: 0 16px;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: 14px;
    align-items: center;
    border-bottom: 1px solid rgba(255,255,255,.12);
    font-size: 9px;
    letter-spacing: 0;
}
.demo-toolbar > div { display:flex; gap:6px; }
.demo-dot { width:8px; height:8px; border-radius:50%; background:rgba(255,255,255,.3); }
.demo-dot:nth-child(2){background:var(--page-accent)}.demo-dot:nth-child(3){background:var(--page-accent-2)}
.demo-status { justify-self:end; color:#9bd0c8; }
.demo-stage { position:relative; padding: 24px 22px 20px; min-height: 380px; }
.demo-ruler { display:flex; justify-content:space-between; margin:0 0 14px 116px; font-size:8px; color:rgba(255,255,255,.45); letter-spacing:0; }
.demo-track { display:grid; grid-template-columns:100px 1fr; gap:16px; align-items:center; min-height:92px; border-top:1px solid rgba(255,255,255,.1); }
.demo-track:last-of-type { border-bottom:1px solid rgba(255,255,255,.1); }
.demo-track__label strong,.demo-track__label span { display:block; }
.demo-track__label strong { font-size:9px; letter-spacing:0; }
.demo-track__label span { margin-top:3px; font-size:8px; color:rgba(255,255,255,.45); }
.waveform { height:58px; display:flex; align-items:center; gap:2px; overflow:hidden; }
.waveform i { flex:1; min-width:1px; height:var(--h); background:linear-gradient(to top,var(--page-accent),#d4fff7); opacity:.86; }
.take-lane { display:flex; align-items:center; gap:6px; min-width:0; }
.take { flex:1; min-width:0; height:50px; border:1px solid rgba(255,255,255,.15); background:rgba(255,255,255,.06); display:flex; align-items:center; justify-content:center; padding:6px; font-size:8px; letter-spacing:0; text-transform:uppercase; transition:.45s ease; }
.take.is-active { flex:1.7; border-color:var(--page-accent-2); background:color-mix(in srgb,var(--page-accent) 28%, transparent); color:#fff; box-shadow:inset 0 0 35px color-mix(in srgb,var(--page-accent) 25%,transparent); }
.demo-match-line { position:absolute; top:47px; bottom:108px; width:1px; left:58%; background:var(--page-accent-2); box-shadow:0 0 14px var(--page-accent-2); transition:left .6s cubic-bezier(.2,.8,.2,1); }
.demo-readout { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin-top:20px; }
.demo-readout > div { min-width:0; padding:10px; border:1px solid rgba(255,255,255,.1); background:rgba(255,255,255,.035); }
.demo-readout span,.demo-readout strong { display:block; }
.demo-readout span { margin-bottom:4px; font-size:7px; letter-spacing:0; color:rgba(255,255,255,.42); }
.demo-readout strong { font-size:9px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.demo-caption { display:grid; grid-template-columns:42px 1fr; gap:18px; padding:20px 22px; border-top:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.035); }
.demo-caption span { font-size:10px; font-weight:800; color:var(--page-accent-2); }
.demo-caption p { margin:0; font-size:12px; color:rgba(255,255,255,.72); }

.workflow {
    counter-reset: workflow;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    border-top: 1px solid rgba(255,255,255,.4);
    border-bottom: 1px solid rgba(255,255,255,.4);
}
.workflow--five { grid-template-columns: repeat(5, 1fr); }
.workflow article { counter-increment: workflow; padding: 34px 25px 38px 0; }
.workflow article + article { border-left: 1px solid rgba(255,255,255,.15); padding-left:25px; }
.workflow article::before { content:"0" counter(workflow); display:block; margin-bottom:58px; font-size:10px; font-weight:800; letter-spacing:0; color:var(--orange); }
.workflow h3 { margin-bottom:14px; font-size:22px; line-height:1.05; letter-spacing:0; }
.workflow p { margin:0; color:rgba(255,255,255,.64); font-size:14px; }

.split-feature { display:grid; grid-template-columns:minmax(0,1fr) minmax(460px,.9fr); gap:clamp(60px,9vw,130px); align-items:start; }
.split-feature h2 { max-width:760px; font-size:clamp(42px,5vw,74px); line-height:1; letter-spacing:0; font-family:var(--display-font); font-weight:400; text-transform:uppercase; }
.large-copy { max-width:720px; font-size:20px; }
.output-stack { border-top:1px solid var(--ink); }
.output-stack article { display:grid; grid-template-columns:44px 150px 1fr; gap:14px; padding:23px 0; border-bottom:1px solid var(--line); align-items:start; }
.output-stack span { color:var(--page-accent); font-size:11px; font-weight:800; }
.output-stack strong { font-size:15px; }
.output-stack p { margin:0; color:#4e514f; font-size:14px; }

.science-card { display:grid; grid-template-columns:minmax(280px,.85fr) 1.45fr; gap:clamp(48px,8vw,110px); padding:clamp(40px,6vw,78px); border:1px solid var(--line); border-radius:var(--radius); background:rgba(255,255,255,.88); }
.science-card--sync { background:linear-gradient(135deg,rgba(23,111,102,.10),rgba(255,255,255,.65) 44%,rgba(232,91,64,.08)); }
.science-card h2 { margin:0; font-size:clamp(38px,4.6vw,66px); line-height:1; letter-spacing:0; font-family:var(--display-font); font-weight:400; text-transform:uppercase; }
.science-card p { max-width:780px; font-size:18px; }
.science-card p:last-child { margin-bottom:0; }
.comparison-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:18px; }
.comparison-grid article { min-height:260px; padding:34px; border:1px solid var(--line); border-radius:var(--radius); background:rgba(255,255,255,.68); }
.comparison-grid h3 { font-size:28px; line-height:1; letter-spacing:0; }
.comparison-grid p { margin:0; color:#454846; }

.accuracy-note { display:grid; grid-template-columns:minmax(230px,.6fr) 1.5fr; gap:clamp(50px,8vw,120px); align-items:center; }
.accuracy-note__number { font-size:clamp(96px,13vw,190px); font-weight:780; line-height:.82; letter-spacing:0; color:var(--orange); }
.accuracy-note h2 { font-size:clamp(40px,5vw,72px); line-height:1; letter-spacing:0; font-family:var(--display-font); font-weight:400; text-transform:uppercase; }
.accuracy-note p { max-width:800px; font-size:18px; }

.dctl-nav { display:grid; grid-template-columns:repeat(auto-fit,minmax(135px,1fr)); gap:1px; margin-bottom:70px; border:1px solid var(--ink); border-radius:var(--radius); overflow:hidden; background:var(--ink); }
.dctl-nav a { min-height:92px; padding:17px; display:flex; align-items:flex-end; background:var(--paper); text-decoration:none; font-size:13px; font-weight:700; line-height:1.1; transition:.2s ease; }
.dctl-nav a:hover,.dctl-nav a.active { background:var(--ink); color:#fff; }

.compare { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(280px,.55fr); gap:34px; align-items:stretch; }
.compare__media { position:relative; min-height:560px; overflow:hidden; border:1px solid rgba(17,20,22,.2); border-radius:var(--radius); background:#141719; box-shadow:var(--shadow); }
.compare__image { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.compare__after { position:absolute; left:0; top:0; bottom:0; width:50%; overflow:hidden; }
.compare__after .compare__image { width:calc(100vw); max-width:none; height:100%; object-fit:cover; object-position:left center; }
.compare__line { position:absolute; top:0; bottom:0; left:50%; width:2px; background:#fff; transform:translateX(-1px); box-shadow:0 0 18px rgba(0,0,0,.35); pointer-events:none; }
.compare__line span { position:absolute; left:50%; top:50%; width:42px; height:42px; transform:translate(-50%,-50%); border-radius:50%; border:1px solid rgba(255,255,255,.75); background:rgba(17,20,22,.55); backdrop-filter:blur(8px); }
.compare__line span::before,.compare__line span::after { content:""; position:absolute; top:50%; width:7px; height:7px; border-top:1px solid #fff; border-right:1px solid #fff; }
.compare__line span::before { left:9px; transform:translateY(-50%) rotate(-135deg); }.compare__line span::after { right:9px; transform:translateY(-50%) rotate(45deg); }
.compare__range { position:absolute; inset:0; width:100%; height:100%; opacity:0; cursor:ew-resize; margin:0; }
.compare__label { position:absolute; top:18px; z-index:4; padding:7px 10px; border-radius:var(--radius); background:rgba(17,20,22,.78); color:#fff; font-size:9px; font-weight:800; letter-spacing:0; backdrop-filter:blur(8px); }
.compare__label--left { left:18px; }.compare__label--right { right:18px; }
.compare__copy { padding:34px; border:1px solid var(--line); border-radius:var(--radius); background:rgba(255,255,255,.82); display:flex; flex-direction:column; justify-content:flex-end; }
.compare__copy h3 { font-size:36px; line-height:1; letter-spacing:0; }
.compare__copy p { color:#444744; }
.demo-disclaimer { margin-top:28px; padding-top:18px; border-top:1px solid var(--line); font-size:12px !important; color:var(--muted) !important; }
.compare__missing { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; padding:40px; color:#fff; text-align:center; }
.compare--compact { grid-template-columns:1fr; }.compare--compact .compare__media { min-height:300px; }
.compare-grid--real { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.demo-card { min-width:0; }
.demo-card__caption { margin:0 0 10px; color:#4c504d; font-size:11px; font-weight:800; line-height:1.25; text-transform:uppercase; }
.compare--real-demo .compare__media { background:#101315; }
.compare--mini .compare__media { min-height:clamp(220px,20vw,320px); aspect-ratio:16 / 9; box-shadow:0 16px 42px rgba(17,20,22,.14); }
.compare--mini .compare__line span { width:34px; height:34px; }
.compare--mini .compare__label { top:12px; padding:6px 8px; font-size:8px; }
.compare--mini .compare__label--left { left:12px; }
.compare--mini .compare__label--right { right:12px; }
.suite-demo { margin-bottom:clamp(78px,8vw,132px); padding:clamp(16px,2.4vw,28px); border:1px solid var(--ink); border-radius:var(--radius); background:rgba(255,255,255,.72); box-shadow:0 20px 58px rgba(17,20,22,.10); }
.demo-picker { display:flex; flex-wrap:wrap; gap:14px; margin-bottom:18px; }
.demo-picker label { flex:1 1 240px; max-width:360px; display:flex; flex-direction:column; gap:7px; }
.demo-picker span { font-size:10px; font-weight:800; letter-spacing:0; text-transform:uppercase; color:#4c504d; }
.demo-picker select { width:100%; min-height:48px; padding:0 14px; border:1px solid rgba(17,20,22,.45); border-radius:var(--radius); background:#f7f7f7; color:var(--ink); font:inherit; font-size:14px; outline:none; transition:border .2s ease,box-shadow .2s ease,background .2s ease; }
.demo-picker select:hover { background:#ededed; }
.demo-picker select:focus { border-color:var(--ink); box-shadow:0 5px 0 rgba(245,160,0,.36); background:#fff; }
.compare--suite-demo .compare__media { min-height:clamp(400px,50vw,720px); aspect-ratio:16 / 9; box-shadow:none; }
.suite-demo__caption { display:flex; flex-wrap:wrap; gap:6px; margin:14px 0 0; color:#4c504d; font-size:12px; font-weight:800; text-transform:uppercase; }

.spec-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.spec { min-height:250px; padding:34px; border:1px solid var(--line); border-radius:var(--radius); background:rgba(255,255,255,.78); }
.spec .eyebrow { margin-bottom:48px; color:var(--page-accent); }
.spec h3 { margin:0 0 14px; font-size:30px; line-height:1; letter-spacing:0; }
.spec p { margin:0; color:#414441; }

.pipeline { position:relative; display:grid; grid-template-columns:1fr auto 1fr auto 1.15fr auto 1fr auto 1.15fr; gap:12px; align-items:stretch; }
.pipeline__rail { position:absolute; left:3%; right:3%; top:50%; height:1px; background:rgba(255,255,255,.2); }
.pipeline-node { position:relative; z-index:2; min-height:170px; padding:20px; border:1px solid rgba(255,255,255,.16); border-radius:var(--radius); background:#171b1d; display:flex; flex-direction:column; }
.pipeline-node--transform { background:#1d2224; }
.pipeline-node--active { border-color:var(--page-accent-2); background:linear-gradient(135deg,color-mix(in srgb,var(--page-accent) 55%,#171b1d),color-mix(in srgb,var(--page-accent-2) 35%,#171b1d)); box-shadow:0 0 50px color-mix(in srgb,var(--page-accent) 20%,transparent); }
.pipeline-node__index { margin-bottom:auto; font-size:9px; letter-spacing:0; color:rgba(255,255,255,.45); }
.pipeline-node strong { margin-bottom:8px; font-size:17px; line-height:1.1; }
.pipeline-node small { color:rgba(255,255,255,.55); font-size:11px; line-height:1.35; }
.pipeline-arrow { position:relative; z-index:3; display:flex; align-items:center; color:rgba(255,255,255,.38); }
.pipeline-note { max-width:900px; margin:28px 0 0; color:rgba(255,255,255,.65); font-size:14px; }
.pipeline-guidance { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:50px; }
.pipeline-guidance article { padding:24px; border-top:1px solid rgba(255,255,255,.34); }
.pipeline-guidance span { display:block; margin-bottom:16px; font-size:10px; font-weight:800; letter-spacing:0; text-transform:uppercase; color:var(--orange); }
.pipeline-guidance p { margin:0; color:rgba(255,255,255,.62); font-size:14px; }

.pricing-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.price-card { min-height:300px; padding:34px; border:1px solid var(--ink); border-radius:var(--radius); background:rgba(255,255,255,.88); display:flex; flex-direction:column; justify-content:space-between; gap:42px; }
.price-card__label { font-size:26px; font-weight:700; letter-spacing:0; }
.price-card__note { margin-top:6px; color:var(--muted); }
.price-card__buy { display:flex; justify-content:space-between; align-items:flex-end; gap:18px; }
.price-card__buy strong { font-size:clamp(48px,5vw,72px); line-height:.9; letter-spacing:0; font-family:var(--display-font); font-weight:400; }
.price-card__buy .button { min-height:44px; padding:10px 15px; }
.pricing-grid--single { grid-template-columns:minmax(300px,.7fr) 1.3fr; }
.bundle-upsell { min-height:300px; padding:36px; border-radius:var(--radius); background:var(--ink); color:#fff; display:flex; flex-direction:column; align-items:flex-start; justify-content:flex-end; }
.bundle-upsell h2 { margin-bottom:14px; font-size:clamp(42px,5vw,72px); line-height:1; letter-spacing:0; font-family:var(--display-font); font-weight:400; text-transform:uppercase; }
.bundle-upsell p { max-width:650px; color:rgba(255,255,255,.7); }
.bundle-upsell .button { border-color:#fff; color:#fff; }

.order-layout { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(320px,.58fr); gap:clamp(48px,7vw,110px); align-items:start; }
.order-form { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.form-section-title { margin-top:28px; padding:22px 0 14px; border-top:1px solid var(--ink); display:grid; grid-template-columns:48px 1fr; gap:14px; }
.form-section-title:first-of-type { margin-top:0; }
.form-section-title > span { color:var(--orange); font-size:11px; font-weight:800; }
.form-section-title strong,.form-section-title small { display:block; }
.form-section-title strong { font-size:24px; letter-spacing:0; }
.form-section-title small { margin-top:3px; color:var(--muted); }
.field { display:flex; flex-direction:column; gap:8px; }
.field--full { grid-column:1 / -1; }
.field label { font-size:10px; font-weight:800; letter-spacing:0; text-transform:uppercase; }
.field input,.field select,.field textarea { width:100%; min-height:54px; padding:13px 15px; border:1px solid rgba(17,20,22,.55); border-radius:var(--radius); background:#f7f7f7; color:#111; outline:none; transition:border .2s ease,box-shadow .2s ease,background .2s ease; }
.field input:hover,.field select:hover,.field textarea:hover { background:#ededed; }
.field input:focus,.field select:focus,.field textarea:focus { border-color:var(--ink); box-shadow:0 5px 0 rgba(245,160,0,.45); background:#fff; }
.field textarea { min-height:130px; resize:vertical; }
.checkline { grid-column:1/-1; display:flex; align-items:flex-start; gap:11px; font-size:14px; }
.checkline input { margin-top:4px; accent-color:var(--orange); }
.form-note { grid-column:1/-1; color:var(--muted); font-size:13px; }
.error-box { padding:18px 20px; margin-bottom:28px; border:1px solid #8f1d1d; border-radius:var(--radius); background:#fff3f0; }
.error-box strong { display:block; margin-bottom:5px; }
.hp { position:absolute!important; left:-10000px!important; width:1px!important; height:1px!important; overflow:hidden!important; }
.order-summary { position:sticky; top:122px; overflow:hidden; padding:28px; border:1px solid var(--ink); border-radius:var(--radius); background:#111416; color:#fff; box-shadow:var(--shadow); }
.order-summary__orb { width:180px; height:180px; margin:10px auto 42px; border-radius:50%; background:radial-gradient(circle at 34% 28%,#fff 0%,var(--page-accent-2) 8%,var(--page-accent) 38%,#111 100%); box-shadow:0 0 80px color-mix(in srgb,var(--page-accent) 30%,transparent); }
.order-summary h2 { margin-bottom:30px; font-size:34px; line-height:1; letter-spacing:0; font-family:var(--display-font); font-weight:400; text-transform:uppercase; }
.summary-row { display:flex; justify-content:space-between; gap:20px; padding:11px 0; border-top:1px solid rgba(255,255,255,.13); font-size:13px; }
.order-summary .summary-row span:first-child { color:rgba(255,255,255,.52); }
.summary-price { margin-top:24px; padding-top:24px; border-top:1px solid rgba(255,255,255,.36); font-size:68px; line-height:.9; font-weight:760; letter-spacing:0; font-family:var(--display-font); }
.summary-note { margin:24px 0 0; color:rgba(255,255,255,.55); font-size:12px; }

.confirmation { max-width:900px; }
.confirmation h1 { font-size:clamp(56px,8vw,105px); }
.confirmation-box { margin-top:48px; padding:32px 0; border-top:1px solid var(--ink); border-bottom:1px solid var(--ink); }

.site-footer { margin-top:clamp(90px,12vw,180px); padding:60px 0; border-top:1px solid var(--ink); background:#111416; color:#fff; }
.site-footer__inner { display:grid; grid-template-columns:1.4fr .8fr; gap:70px; }
.site-footer h2 { max-width:780px; margin:0; font-size:clamp(36px,4vw,58px); line-height:1; letter-spacing:0; font-family:var(--display-font); font-weight:400; text-transform:uppercase; }
.site-footer nav { display:flex; flex-wrap:wrap; align-content:start; gap:18px 28px; }
.site-footer nav a { font-size:10px; font-weight:800; letter-spacing:0; text-decoration:none; }
.footer-meta { grid-column:1/-1; margin-top:30px; padding-top:26px; border-top:1px solid rgba(255,255,255,.14); display:flex; justify-content:space-between; gap:24px; color:rgba(255,255,255,.45); font-size:12px; }
.footer-meta a { color:inherit; }

[data-reveal] { opacity:0; transform:translateY(20px); transition:opacity .7s ease,transform .7s cubic-bezier(.2,.75,.25,1); }
[data-reveal].is-visible { opacity:1; transform:none; }

@media (max-width: 1180px) {
    .tool-grid { grid-template-columns:repeat(3,1fr); }
    .workflow--five { grid-template-columns:repeat(3,1fr); }
    .workflow--five article:nth-child(4) { border-left:0; padding-left:0; border-top:1px solid rgba(255,255,255,.15); }
    .workflow--five article:nth-child(5) { border-top:1px solid rgba(255,255,255,.15); }
    .pipeline { grid-template-columns:1fr 1fr; gap:12px; }
    .pipeline-arrow,.pipeline__rail { display:none; }
    .pipeline-node--active { grid-column:1/-1; }
    .compare { grid-template-columns:1fr; }
    .compare__copy { min-height:240px; }
}

@media (max-width: 940px) {
    .site-header__inner { min-height:78px; position:relative; }
    .nav-toggle { display:block; }
    .site-nav {
        display:flex;
        position:absolute;
        top:calc(100% + 8px);
        left:0;
        right:0;
        max-height:0;
        padding:0 var(--gutter);
        overflow:hidden;
        opacity:0;
        pointer-events:none;
        background:rgba(246,243,236,.98);
        border-top:1px solid var(--line);
        border-bottom:1px solid var(--ink);
        flex-direction:column;
        align-items:flex-start;
        gap:14px;
        transform:translateY(-8px);
        box-shadow:0 22px 60px rgba(17,20,22,.16);
    }
    .site-nav.is-open {
        max-height:320px;
        padding:24px var(--gutter) 32px;
        opacity:1;
        pointer-events:auto;
        transform:translateY(0);
    }
    .hero { min-height:0; }
    h1 { font-size: 5rem; }
    .hero--product h1 { font-size: 4.5rem; }
    .hero-grid,.hero-grid--product,.section-heading,.split-feature,.science-card,.accuracy-note,.callout,.order-layout { grid-template-columns:1fr; }
    .hero-console,.optics-console { min-height:430px; }
    .product-grid { grid-template-columns:1fr; }
    .tool-grid { grid-template-columns:repeat(2,1fr); }
    .workflow,.workflow--five { grid-template-columns:1fr; }
    .workflow article,.workflow--five article { padding:26px 0 30px !important; border-left:0 !important; border-top:1px solid rgba(255,255,255,.15); }
    .workflow article:first-child { border-top:0; }
    .workflow article::before { margin-bottom:28px; }
    .output-stack article { grid-template-columns:38px 130px 1fr; }
    .dctl-nav { grid-template-columns:repeat(3,1fr); }
    .compare__media { min-height:470px; }
    .compare-grid--real { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .compare--suite-demo .compare__media { min-height:clamp(360px,58vw,560px); }
    .spec-grid,.comparison-grid { grid-template-columns:1fr; }
    .pipeline-guidance { grid-template-columns:1fr; }
    .pricing-grid { grid-template-columns:1fr; }
    .pricing-grid--single { grid-template-columns:1fr; }
    .order-summary { position:static; }
    .site-footer__inner { grid-template-columns:1fr; }
    .footer-meta { grid-column:auto; }
}

@media (max-width: 620px) {
    :root { --gutter:18px; }
    .brand { font-size:20px; }
    .wrap,
    .site-header__inner,
    .site-footer__inner {
        width: min(354px, calc(100% - (var(--gutter) * 2)));
        margin-left: var(--gutter);
        margin-right: auto;
    }
    h1 { max-width:100%; font-size:2.85rem; }
    .hero--product h1 { font-size:2.7rem; }
    .lede { max-width:100%; font-size:1.16rem; }
    .hero-console,.optics-console { min-height:360px; border-radius:var(--radius); }
    .hero-console__labels { flex-direction:column; gap:5px; }
    .optics-console__lens { width:210px; height:210px; }
    .section-heading { gap:12px; }
    .product-card { min-height:430px; border-radius:var(--radius); }
    .tool-grid { grid-template-columns:1fr; }
    .tool-tile { min-height:310px; }
    .feature-row { grid-template-columns:1fr; gap:10px; }
    .demo-stage { padding:18px 14px; }
    .demo-toolbar { grid-template-columns:1fr auto; }
    .demo-toolbar strong { display:none; }
    .demo-track { grid-template-columns:72px 1fr; gap:10px; }
    .demo-ruler { margin-left:82px; }
    .demo-readout { grid-template-columns:1fr 1fr; }
    .demo-match-line { display:none; }
    .split-feature { gap:48px; }
    .output-stack article { grid-template-columns:34px 1fr; }
    .output-stack p { grid-column:2; }
    .science-card { padding:28px; border-radius:var(--radius); }
    .accuracy-note { gap:28px; }
    .accuracy-note__number { font-size:110px; }
    .dctl-nav { grid-template-columns:1fr 1fr; }
    .dctl-nav a { min-height:70px; }
    .compare__media { min-height:340px; border-radius:var(--radius); }
    .compare-grid--real { grid-template-columns:1fr; gap:26px; }
    .compare--mini .compare__media { min-height:clamp(210px,62vw,260px); }
    .suite-demo { padding:14px; }
    .demo-picker { display:grid; grid-template-columns:1fr; }
    .demo-picker label { max-width:none; }
    .compare--suite-demo .compare__media { min-height:clamp(250px,72vw,360px); }
    .compare__copy { padding:26px; }
    .spec-grid { gap:10px; }
    .pipeline { grid-template-columns:1fr; }
    .pipeline-node--active { grid-column:auto; }
    .price-card__buy { align-items:flex-start; flex-direction:column; }
    .order-form { grid-template-columns:1fr; }
    .field--full,.checkline,.form-note,.form-section-title { grid-column:auto; }
    .order-summary__orb { width:140px; height:140px; }
    .site-footer nav { flex-direction:column; align-items:flex-start; }
    .footer-meta { flex-direction:column; }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior:auto; }
    *, *::before, *::after { animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
    [data-reveal] { opacity:1; transform:none; }
}