:root {
    --navy:#17324d;
    --navy2:#0f263b;
    --orange:#d76a28;
    --ink:#1d2935;
    --muted:#65717c;
    --line:#dce3e8;
    --soft:#f4f7f9;
    --white:#fff;
    --radius:18px;
    --shadow:0 18px 55px #17324d14
}

* {
    box-sizing:border-box
}

html {
    scroll-behavior:smooth;
    font-size:110%
}

body {
    margin:0;
    color:var(--ink);
    background:#fff;
    font-family:Arial,Helvetica,sans-serif;
    line-height:1.6
}

a {
    color:inherit;
    text-decoration:none
}

button,a {
    touch-action:manipulation
}

button {
    font:inherit;
    cursor:pointer
}

img {
    max-width:100%;
    height:auto
}

.container {
    width:min(1160px,calc(100% - 40px));
    margin:auto
}

.narrow {
    max-width:850px
}

.sr-only {
    position:absolute;
    width:1px;
    height:1px;
    padding:0;
    margin:-1px;
    overflow:hidden;
    clip:rect(0,0,0,0);
    white-space:nowrap;
    border:0
}

.skip-link {
    position:fixed;
    z-index:999;
    top:8px;
    left:8px;
    padding:10px 14px;
    background:#fff;
    transform:translateY(-150%)
}

.skip-link:focus {
    transform:none
}

.site-header {
    position:sticky;
    z-index:50;
    top:0;
    background:#fffffff2;
    border-bottom:1px solid var(--line);
    backdrop-filter:blur(12px)
}

.header-inner {
    height:82px;
    display:flex;
    align-items:center;
    justify-content:space-between
}

.brand {
    display:flex;
    align-items:center;
    gap:12px;
    font-size:1.3125rem;
    letter-spacing:1.5px;
    color:var(--navy)
}

.brand strong {
    color:var(--orange)
}

.brand small {
    display:block;
    margin-top:-5px;
    color:var(--muted);
    font-size:0.5rem;
    letter-spacing:1.2px
}

.brand-mark {
    width:42px;
    height:42px;
    display:grid;
    place-items:center;
    border-radius:10px;
    background:var(--navy);
    color:#fff;
    font:400 1.6875rem Georgia,serif;
    box-shadow:inset -8px -8px 0 #ffffff08
}

.brand-mark::after {
    content:"";
    position:absolute
}

.site-header nav {
    display:flex;
    align-items:center;
    gap:28px;
    font-size:0.8125rem
}

.site-header nav>a:not(.button) {
    padding:29px 0 25px;
    border-bottom:3px solid transparent
}

.site-header nav>a[aria-current=page] {
    color:var(--orange);
    border-color:var(--orange)
}

.menu-toggle {
    display:none;
    border:0;
    background:none;
    font-size:1.5rem
}

.button {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:50px;
    padding:0 23px;
    border:1px solid var(--navy);
    border-radius:7px;
    background:var(--navy);
    color:#fff;
    font-weight:700;
    font-size:0.8125rem;
    transition:transform .2s,box-shadow .2s
}

.button:hover {
    transform:translateY(-2px);
    box-shadow:0 10px 25px #17324d24
}

.button-small {
    min-height:42px;
    padding:0 17px
}

.button-orange {
    border-color:var(--orange);
    background:var(--orange)
}

.button-navy {
    background:var(--navy)
}

.text-link {
    display:inline-flex;
    gap:8px;
    align-items:center;
    color:var(--navy);
    font-size:0.8125rem;
    font-weight:700
}

.text-link span,.text-link:hover {
    color:var(--orange)
}

.text-link.light {
    color:#fff
}

.eyebrow {
    display:block;
    color:var(--orange);
    font-size:0.6875rem;
    font-weight:700;
    letter-spacing:2.2px;
    text-transform:uppercase
}

.hero {
    padding:105px 0 90px;
    background:linear-gradient(135deg,#fff 55%,#f1f5f8 55%)
}

.hero-grid {
    display:grid;
    grid-template-columns:1.15fr .85fr;
    gap:85px;
    align-items:center
}

.hero h1,.page-hero h1,.ruper-hero h1 {
    margin:16px 0 24px;
    font:400 clamp(2.6875rem,5vw,4.3125rem)/1.06 Georgia,'Times New Roman',serif;
    letter-spacing:-2px
}

.hero h1 em,.page-hero h1 em,.ruper-hero h1 em {
    color:var(--orange);
    font-style:normal
}

.lead {
    max-width:660px;
    color:var(--muted);
    font-size:1.125rem
}

.actions {
    display:flex;
    align-items:center;
    gap:25px;
    margin-top:32px;
    flex-wrap:wrap
}

.institution-card {
    padding:30px;
    border:1px solid var(--line);
    border-radius:var(--radius);
    background:#fff;
    box-shadow:var(--shadow)
}

.institution-card>.card-label {
    display:block;
    margin-bottom:12px;
    color:var(--muted);
    font-size:0.6875rem;
    text-transform:uppercase;
    letter-spacing:1.5px
}

.institution-card>div {
    display:grid;
    grid-template-columns:44px 1fr;
    gap:2px 12px;
    padding:18px 0;
    border-top:1px solid var(--line)
}

.institution-card b {
    grid-row:1/3;
    color:var(--orange);
    font:400 1.75rem Georgia,serif
}

.institution-card strong {
    color:var(--navy)
}

.institution-card small {
    color:var(--muted)
}

.section {
    padding:90px 0
}

.section-soft {
    background:var(--soft)
}

.section-title {
    max-width:700px;
    margin-bottom:45px
}

.section-title h2,.carousel-head h2,.cta-box h2,.split-content h2 {
    margin:10px 0;
    font:400 clamp(2.125rem,4vw,3.25rem)/1.12 Georgia,serif;
    color:var(--navy)
}

.section-title p {
    color:var(--muted)
}

.carousel-head {
    display:flex;
    align-items:end;
    justify-content:space-between;
    margin-bottom:28px
}

.carousel-controls {
    display:flex;
    align-items:center;
    gap:12px;
    color:var(--muted);
    font-size:0.75rem
}

.carousel-controls button {
    width:42px;
    height:42px;
    border:1px solid var(--line);
    border-radius:50%;
    background:#fff;
    color:var(--navy)
}

.carousel-stage {
    min-height:450px
}

.product-slide {
    min-height:450px;
    display:grid;
    grid-template-columns:1.05fr .95fr;
    align-items:center;
    padding:52px 70px;
    border:1px solid var(--line);
    border-radius:24px;
    background:linear-gradient(135deg,#fff,#f3f6f8);
    box-shadow:var(--shadow);
    overflow:hidden;
    animation:panel-in .8s ease both
}

.product-slide[hidden] {
    display:none
}

.product-copy {
    max-width:560px
}

.product-copy h2 {
    margin:12px 0 0;
    font:400 3.6875rem Georgia,serif;
    color:var(--navy)
}

.product-copy h3 {
    margin:5px 0 16px;
    font:400 1.8125rem/1.2 Georgia,serif;
    color:var(--navy)
}

.product-copy p {
    color:var(--muted)
}

.ruper-slide {
    background:linear-gradient(135deg,#17202a,#0b1117);
    color:#fff;
    border-color:#26394b
}

.ruper-slide .product-copy h2,.ruper-slide .product-copy h3 {
    color:#fff
}

.ruper-slide .product-copy p {
    color:#bdc6ce
}

.ruper-slide>img {
    max-height:390px;
    justify-self:center;
    filter:drop-shadow(0 18px 28px #0007)
}

.pill {
    display:inline-flex;
    padding:6px 11px;
    border-radius:999px;
    background:#fff0e8;
    color:var(--orange);
    font-size:0.625rem;
    font-weight:700;
    letter-spacing:1px;
    text-transform:uppercase
}

.pill-blue {
    background:#e9f0f5;
    color:var(--navy)
}

.abstract-window {
    width:90%;
    height:280px;
    justify-self:end;
    padding:40px;
    border:1px solid var(--line);
    border-radius:18px;
    background:#fff;
    box-shadow:0 18px 45px #17324d16
}

.abstract-window i {
    display:inline-block;
    width:9px;
    height:9px;
    margin-right:6px;
    border-radius:50%;
    background:#dfe5e9
}

.abstract-window i:first-child {
    background:var(--orange)
}

.abstract-window span {
    display:block;
    height:145px;
    margin-top:25px;
    border-radius:9px;
    background:linear-gradient(90deg,#edf2f5 30%,transparent 30%,transparent 33%,#edf2f5 33%)
}

.code-map {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px
}

.code-map span {
    height:115px;
    border:1px solid var(--line);
    border-radius:14px;
    background:#fff;
    box-shadow:var(--shadow)
}

.code-map span:first-child {
    grid-column:1/3;
    background:var(--navy)
}

.carousel-dots {
    display:flex;
    justify-content:center;
    gap:30px;
    margin-top:22px
}

.carousel-dots button {
    padding:8px 0;
    border:0;
    border-bottom:2px solid transparent;
    background:none;
    color:var(--muted)
}

.carousel-dots button[aria-selected=true] {
    color:var(--navy);
    border-color:var(--orange)
}

.cards-three {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:20px
}

.cards-three article {
    padding:30px;
    border:1px solid var(--line);
    border-radius:var(--radius);
    background:#fff
}

.cards-three article>span {
    color:var(--orange);
    font:400 1.5rem Georgia,serif
}

.cards-three h3 {
    margin:22px 0 12px;
    color:var(--navy);
    font:400 1.5625rem Georgia,serif
}

.cards-three p {
    color:var(--muted);
    font-size:0.875rem
}

.cards-three a {
    color:var(--orange);
    font-size:0.75rem;
    font-weight:700
}

.cta-section {
    padding-top:40px
}

.cta-box {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:30px;
    padding:52px 60px;
    border-radius:22px;
    background:var(--navy);
    color:#fff
}

.cta-box h2 {
    color:#fff;
    margin-bottom:0
}

.page-hero {
    padding:90px 0 75px;
    background:linear-gradient(180deg,var(--soft),#fff);
    border-bottom:1px solid var(--line)
}

.page-hero p {
    max-width:700px;
    color:var(--muted);
    font-size:1.0625rem
}

.expertise-list>article {
    display:grid;
    grid-template-columns:110px 1fr;
    gap:30px;
    padding:55px 0;
    border-bottom:1px solid var(--line)
}

.expertise-list .number {
    color:var(--orange);
    font:400 2.625rem Georgia,serif
}

.expertise-list h2,.solution-detail h2,.contact-card h2 {
    margin:0 0 10px;
    color:var(--navy);
    font:400 2.4375rem Georgia,serif
}

.expertise-list p,.expertise-list li {
    color:var(--muted)
}

.expertise-list ul {
    columns:2;
    padding-left:18px
}

.solution-stack {
    display:grid;
    gap:28px
}

.solution-detail {
    display:grid;
    grid-template-columns:1.2fr .8fr;
    align-items:center;
    min-height:350px;
    padding:50px 60px;
    border:1px solid var(--line);
    border-radius:22px;
    background:var(--soft);
    overflow:hidden
}

.solution-detail h3 {
    font:400 1.5rem Georgia,serif
}

.solution-detail p {
    max-width:650px;
    color:var(--muted)
}

.solution-detail img {
    max-height:300px;
    justify-self:center
}

.solution-ruper {
    background:#111b24;
    color:#fff
}

.solution-ruper h2,.solution-ruper h3 {
    color:#fff
}

.solution-ruper p {
    color:#c1c8cf
}

.solution-symbol {
    justify-self:center;
    color:var(--navy);
    font:400 9.375rem Georgia,serif;
    opacity:.12
}

.solution-symbol.brackets {
    font-size:6.25rem
}

.ruper-hero {
    padding:85px 0 0;
    background:linear-gradient(135deg,#111a23,#172b3b);
    color:#fff;
    overflow:hidden
}

.ruper-hero-grid {
    display:grid;
    grid-template-columns:1.15fr .85fr;
    align-items:center
}

.ruper-hero p {
    max-width:650px;
    color:#cad2d8;
    font-size:1.125rem
}

.ruper-hero img {
    max-height:520px;
    justify-self:center;
    filter:drop-shadow(0 22px 30px #0008)
}

.split-content {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:80px;
    align-items:center
}

.split-content p {
    color:var(--muted)
}

.contact-grid {
    display:grid;
    grid-template-columns:1.2fr .8fr;
    gap:35px
}

.contact-card,.contact-grid aside {
    padding:45px;
    border:1px solid var(--line);
    border-radius:20px
}

.contact-card {
    background:var(--soft)
}

.contact-card h2 {
    overflow-wrap:anywhere
}

.contact-grid aside {
    background:var(--navy);
    color:#fff
}

.contact-grid aside h2 {
    font:400 1.875rem Georgia,serif
}

.contact-grid aside a {
    color:#ffd4b8;
    text-decoration:underline;
    text-underline-offset:3px
}

.contact-grid aside small {
    color:#bdc7cf
}

.legal-hero {
    padding-bottom:55px
}

.legal-page {
    max-width:900px
}

.legal-page article {
    padding:30px 0;
    border-bottom:1px solid var(--line)
}

.legal-page h2 {
    color:var(--navy);
    font:400 1.6875rem Georgia,serif
}

.legal-page p {
    color:#4f5d69
}

.legal-page a {
    color:var(--orange);
    text-decoration:underline;
    text-underline-offset:3px
}

.share-strip {
    border-top:1px solid var(--line);
    background:var(--soft)
}

.share-inner {
    min-height:70px;
    display:flex;
    align-items:center;
    gap:20px;
    color:var(--muted);
    font-size:0.75rem
}

.share-inner>span {
    color:var(--navy);
    font-weight:700
}

.share-inner a,.share-inner button {
    border:0;
    background:none;
    color:var(--orange);
    padding:5px
}

.share-inner small {
    min-width:70px
}

.site-footer {
    padding:65px 0 25px;
    background:#101f2d;
    color:#cad2d8
}

.footer-grid {
    display:grid;
    grid-template-columns:1.5fr repeat(3,1fr);
    gap:45px
}

.brand-footer {
    color:#fff
}

.footer-grid p {
    max-width:280px;
    font-size:0.8125rem
}

.footer-grid h2 {
    margin:0 0 15px;
    color:#fff;
    font-size:0.8125rem
}

.footer-grid>div>a:not(.brand) {
    display:block;
    margin:8px 0;
    color:#aebac4;
    font-size:0.75rem
}

.footer-grid>div>a:hover {
    color:#fff
}

.footer-bottom {
    display:flex;
    justify-content:space-between;
    margin-top:45px;
    padding-top:20px;
    border-top:1px solid #ffffff14;
    color:#8797a4;
    font-size:0.6875rem
}

.back-to-top {
    position:fixed;
    right:20px;
    bottom:20px;
    width:44px;
    height:44px;
    padding-top: 8px;
    border:0;
    border-radius:50%;
    background:var(--orange);
    color:#fff;
    box-shadow:0 8px 25px #0003
}

.back-to-top[hidden] {
    display:none
}

@keyframes panel-in {
    from {
        opacity:0;
        transform:translateY(12px)
    }

    to {
        opacity:1;
        transform:none
    }

}

@media(max-width:900px) {
    .header-inner {
        height:72px
    }

    .menu-toggle {
        display:block
    }

    .site-header nav {
        position:absolute;
        top:72px;
        left:0;
        right:0;
        display:none;
        padding:20px;
        background:#fff;
        border-bottom:1px solid var(--line);
        box-shadow:var(--shadow)
    }

    .site-header nav.is-open {
        display:grid;
        gap:4px
    }

    .site-header nav>a:not(.button) {
        padding:10px;
        border-bottom:0
    }

    .hero {
        padding:70px 0
    }

    .hero-grid,.product-slide,.solution-detail,.ruper-hero-grid,.split-content,.contact-grid {
        grid-template-columns:1fr
    }

    .hero-grid {
        gap:45px
    }

    .product-slide {
        padding:38px;
        min-height:520px
    }

    .product-slide>img {
        max-height:260px
    }

    .cards-three {
        grid-template-columns:1fr
    }

    .cta-box {
        padding:40px;
        align-items:flex-start;
        flex-direction:column
    }

    .solution-detail {
        padding:38px
    }

    .solution-symbol {
        display:none
    }

    .ruper-hero-grid>div {
        padding-bottom:20px
    }

    .ruper-hero img {
        max-height:360px
    }

    .footer-grid {
        grid-template-columns:1fr 1fr
    }

    .expertise-list ul {
        columns:1
    }

}

@media(max-width:600px) {
    .container {
        width:min(100% - 28px,1160px)
    }

    .brand {
        font-size:1.0625rem
    }

    .brand-mark {
        width:37px;
        height:37px
    }

    .hero h1,.page-hero h1,.ruper-hero h1 {
        font-size:2.5rem;
        letter-spacing:-1px
    }

    .hero {
        background:#fff
    }

    .actions {
        align-items:flex-start;
        flex-direction:column
    }

    .button {
        width:100%
    }

    .carousel-head {
        align-items:flex-start;
        gap:20px
    }

    .carousel-controls {
        flex-shrink:0
    }

    .product-slide {
        padding:30px 24px
    }

    .product-copy h2 {
        font-size:2.8125rem
    }

    .product-copy h3 {
        font-size:1.5rem
    }

    .carousel-dots {
        gap:15px;
        font-size:0.75rem
    }

    .expertise-list>article {
        grid-template-columns:1fr;
        gap:5px
    }

    .expertise-list .number {
        font-size:1.75rem
    }

    .solution-detail {
        padding:30px 24px
    }

    .ruper-hero {
        padding-top:60px
    }

    .share-inner {
        flex-wrap:wrap;
        padding:15px 0;
        gap:12px
    }

    .footer-grid {
        grid-template-columns:1fr;
        gap:28px
    }

    .footer-bottom {
        flex-direction:column;
        gap:7px
    }

    .contact-card,.contact-grid aside {
        padding:30px 24px
    }

}

@media(prefers-reduced-motion:reduce) {
    html {
        scroll-behavior:auto
    }

    *,*:before,*:after {
        animation:none!important;
        transition:none!important
    }

}