.portal-page {
    --portal-ink: #172128;
    --portal-muted: #607078;
    --portal-accent: #217a89;
    --portal-accent-dark: #155a65;
    --portal-soft: #eef6f7;
    --portal-line: #dce7e9;
    background: #fff;
    color: var(--portal-ink);
}

.portal-page main { overflow: hidden; }
.portal-page .portal-section { padding: 6rem 0; }
.portal-page h1, .portal-page h2, .portal-page h3 { color: var(--portal-ink); font-weight: 700; letter-spacing: -.035em; }
.portal-page p { color: var(--portal-muted); }
.portal-page img { display: block; max-width: 100%; }
.portal-page section[id] { scroll-margin-top: 86px; }

.portal-navbar {
    position: fixed;
    inset: 0 0 auto;
    z-index: 1030;
    border-bottom: 1px solid transparent;
    transition: background .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.portal-navbar.scrolled { border-color: rgba(23, 33, 40, .08); background: rgba(255, 255, 255, .94); box-shadow: 0 8px 30px rgba(23, 33, 40, .07); backdrop-filter: blur(14px); }
.portal-nav-inner { display: flex; min-height: 82px; align-items: center; justify-content: space-between; gap: 1.5rem; }
.portal-logo img { width: 46px; height: 58px; object-fit: contain; }
.portal-desktop-nav { display: flex; align-items: center; gap: 1.65rem; }
.portal-desktop-nav a { color: var(--portal-ink); font-size: .92rem; font-weight: 600; }
.portal-desktop-nav a:hover { color: var(--portal-accent); }
.portal-actions { display: flex; align-items: center; gap: .65rem; }

.portal-btn {
    display: inline-flex;
    min-height: 46px;
    align-items: center;
    justify-content: center;
    gap: .55rem;
    padding: .7rem 1.25rem;
    border: 1px solid transparent;
    border-radius: 999px;
    font-weight: 650;
    line-height: 1.1;
    transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.portal-btn:hover { transform: translateY(-2px); }
.portal-btn-primary { border-color: var(--portal-accent); background: var(--portal-accent); color: #fff; }
.portal-btn-primary:hover { background: var(--portal-accent-dark); color: #fff; box-shadow: 0 12px 25px rgba(33, 122, 137, .2); }
.portal-btn-light { border-color: var(--portal-line); background: #fff; color: var(--portal-ink); }
.portal-btn-light:hover { background: var(--portal-soft); color: var(--portal-ink); }
.portal-menu-button { display: none; width: 44px; height: 44px; border: 0; border-radius: 50%; background: var(--portal-soft); color: var(--portal-ink); font-size: 1.5rem; }
.portal-mobile-menu .offcanvas-header img { width: 42px; height: 54px; object-fit: contain; }
.portal-mobile-menu nav { display: grid; gap: .4rem; }
.portal-mobile-menu nav a { padding: .8rem; border-radius: .7rem; color: var(--portal-ink); font-weight: 600; }
.portal-mobile-menu nav a:hover { background: var(--portal-soft); }

.portal-hero { position: relative; min-height: 760px; display: flex; align-items: center; padding-top: 9rem !important; background: radial-gradient(circle at 80% 25%, #dceff2 0, transparent 32%), linear-gradient(145deg, #fff 30%, #f3f8f8 100%); }
.portal-hero h1 { max-width: 680px; margin: 1rem 0 1.4rem; font-size: clamp(3rem, 6vw, 5.7rem); line-height: .98; }
.portal-hero p { max-width: 590px; margin-bottom: 2rem; font-size: 1.18rem; }
.portal-kicker, .portal-section-heading > span { display: inline-block; color: var(--portal-accent); font-size: .78rem; font-weight: 750; letter-spacing: .13em; text-transform: uppercase; }
.portal-hero-image { position: relative; overflow: hidden; border-radius: 38% 62% 55% 45% / 42% 38% 62% 58%; box-shadow: 0 35px 80px rgba(19, 75, 84, .18); }
.portal-hero-image img { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; }

.portal-stats { position: relative; z-index: 2; margin-top: -3rem; }
.portal-stat { display: grid; min-height: 150px; place-content: center; border: 1px solid var(--portal-line); border-radius: 22px; background: #fff; text-align: center; box-shadow: 0 15px 45px rgba(23, 33, 40, .08); }
.portal-stat strong { color: var(--portal-accent-dark); font-size: clamp(2.2rem, 4vw, 3.2rem); line-height: 1; }
.portal-stat > span { margin-top: .6rem; color: var(--portal-muted); font-weight: 600; }

.portal-statement { text-align: center; }
.portal-statement h2 { max-width: 900px; margin: 0 auto 1rem; font-size: clamp(2rem, 4vw, 3.4rem); }
.portal-statement p { font-size: 1.1rem; }
.portal-section-heading { max-width: 760px; margin-bottom: 2.7rem; }
.portal-section-heading h2 { margin-top: .7rem; font-size: clamp(2rem, 4vw, 3.3rem); }

.portal-services { background: #f7fafb; }
.portal-service-card { height: 100%; padding: 2rem; border: 1px solid var(--portal-line); border-radius: 22px; background: #fff; transition: transform .25s ease, box-shadow .25s ease; }
.portal-service-card:hover { transform: translateY(-6px); box-shadow: 0 20px 45px rgba(23, 33, 40, .09); }
.portal-service-card > i { display: grid; width: 52px; height: 52px; place-items: center; border-radius: 16px; background: var(--portal-soft); color: var(--portal-accent); font-size: 1.45rem; }
.portal-service-card h3 { margin: 1.25rem 0 .7rem; font-size: 1.3rem; }
.portal-service-card p { margin: 0; }

.portal-benefits img, .portal-about img { width: 100%; max-height: 560px; border-radius: 28px; object-fit: cover; box-shadow: 0 25px 55px rgba(23, 33, 40, .12); }
.portal-benefits h2, .portal-about h2, .portal-contact h2 { margin: .7rem 0 1.3rem; font-size: clamp(2rem, 4vw, 3.4rem); }
.portal-benefits ul { display: grid; gap: 1rem; margin: 1.8rem 0 0; padding: 0; list-style: none; }
.portal-benefits li { display: flex; align-items: center; gap: .8rem; color: var(--portal-ink); font-weight: 600; }
.portal-benefits li i { color: var(--portal-accent); }

.portal-process { background: var(--portal-ink); }
.portal-process .portal-section-heading h2 { color: #fff; }
.portal-process .portal-section-heading span { color: #89cad3; }
.portal-process-card { height: 100%; padding: 1.8rem; border: 1px solid rgba(255, 255, 255, .13); border-radius: 20px; background: rgba(255, 255, 255, .06); }
.portal-process-card > span { color: #89cad3; font-weight: 800; }
.portal-process-card h3 { margin: 1.5rem 0 .7rem; color: #fff; font-size: 1.3rem; }
.portal-process-card p { margin: 0; color: #b9c6cb; }
.portal-about p { max-width: 650px; font-size: 1.08rem; }

.portal-media { background: #f7fafb; }
.portal-media-slider { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 1rem; }
.portal-media-track { overflow: hidden; border-radius: 24px; background: #101719; box-shadow: 0 25px 60px rgba(23, 33, 40, .15); }
.portal-media-slide { display: none; }
.portal-media-slide.active { display: block; }
.portal-media-slide > img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.portal-media-placeholder { display: grid; min-height: min(55vw, 630px); place-content: center; padding: 2rem; background-position: center; background-size: cover; color: #fff; text-align: center; }
.portal-media-placeholder::before { position: absolute; inset: 0; background: rgba(9, 22, 25, .62); content: ''; }
.portal-media-placeholder > * { position: relative; z-index: 1; }
.portal-media-placeholder i { font-size: 4rem; }
.portal-media-placeholder h3 { margin: 1rem 0; color: #fff; font-size: clamp(1.8rem, 4vw, 3rem); }
.portal-media-placeholder a { color: #fff; font-weight: 700; text-decoration: underline; text-underline-offset: .3rem; }
.portal-media-evaluation { position: relative; background-image: url('../images/portal/hero.jpeg'); }
.portal-media-development { position: relative; background-image: url('../images/portal/aboutt.jpeg'); }
.portal-media-arrow { display: grid; width: 48px; height: 48px; place-items: center; border: 1px solid var(--portal-line); border-radius: 50%; background: #fff; color: var(--portal-ink); }
.portal-media-dots { display: flex; justify-content: center; gap: .55rem; margin-top: 1.3rem; }
.portal-media-dots button { width: 9px; height: 9px; padding: 0; border: 0; border-radius: 50%; background: #b8c5c8; }
.portal-media-dots button.active { width: 28px; border-radius: 8px; background: var(--portal-accent); }

.portal-faq-list { max-width: 900px; margin: auto; }
.portal-faq details { border-bottom: 1px solid var(--portal-line); }
.portal-faq summary { display: flex; padding: 1.35rem 0; align-items: center; justify-content: space-between; gap: 1rem; color: var(--portal-ink); font-size: 1.08rem; font-weight: 650; cursor: pointer; list-style: none; }
.portal-faq summary::-webkit-details-marker { display: none; }
.portal-faq details[open] summary i { transform: rotate(45deg); }
.portal-faq summary i { transition: transform .2s ease; }
.portal-faq details p { padding: 0 2.5rem 1.3rem 0; }

.portal-contact { background: var(--portal-soft); }
.portal-contact address { display: grid; gap: 1rem; margin-top: 2rem; font-style: normal; }
.portal-contact address span { display: grid; grid-template-columns: 26px 1fr; color: var(--portal-ink); }
.portal-contact address i { color: var(--portal-accent); }
.portal-contact address small { grid-column: 2; color: var(--portal-muted); }
.portal-contact-form { display: grid; gap: 1rem; padding: clamp(1.4rem, 4vw, 2.5rem); border-radius: 24px; background: #fff; box-shadow: 0 20px 50px rgba(23, 33, 40, .08); }
.portal-contact-form div { display: grid; gap: .4rem; }
.portal-contact-form label { font-size: .9rem; font-weight: 650; }
.portal-contact-form input, .portal-contact-form textarea { width: 100%; padding: .85rem 1rem; border: 1px solid var(--portal-line); border-radius: 12px; background: #fbfdfd; color: var(--portal-ink); }
.portal-contact-form input:focus, .portal-contact-form textarea:focus { border-color: var(--portal-accent); outline: 3px solid rgba(33, 122, 137, .12); }
.portal-contact-form.was-validated input:invalid, .portal-contact-form.was-validated textarea:invalid { border-color: #b42318; }
.portal-contact-form > small { color: var(--portal-muted); }

.portal-footer { padding: 3rem 0; background: #101719; color: #fff; text-align: center; }
.portal-footer img { width: 42px; height: 55px; margin: 0 auto 1rem; object-fit: contain; }
.portal-footer p { margin-bottom: .35rem; color: #c6d2d6; }
.portal-footer small { color: #8fa0a6; }

.portal-reveal { opacity: 0; transform: translateY(20px); transition: opacity .65s ease, transform .65s ease; }
.portal-reveal.visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .portal-reveal { opacity: 1; transform: none; transition: none; } }

@media (max-width: 1199.98px) {
    .portal-desktop-nav { display: none; }
    .portal-menu-button { display: inline-grid; place-items: center; }
}
@media (max-width: 767.98px) {
    .portal-page .portal-section { padding: 4rem 0; }
    .portal-nav-inner { min-height: 72px; }
    .portal-logo img { width: 38px; height: 50px; }
    .portal-actions .portal-tests { display: none; }
    .portal-actions .portal-login span { display: none; }
    .portal-actions .portal-login { min-height: 42px; padding: .65rem .85rem; }
    .portal-hero { min-height: auto; padding-top: 7.3rem !important; }
    .portal-hero h1 { font-size: clamp(2.65rem, 13vw, 4rem); }
    .portal-stats { margin-top: 0; padding-top: 1.5rem; }
    .portal-stat { min-height: 125px; }
    .portal-media-slider { grid-template-columns: 1fr; }
    .portal-media-arrow { display: none; }
}