/* TÜV NORD Vietnam – Botble "main" theme (Bootstrap 5 base) */

@font-face { font-family: "TNG Pro"; font-style: normal; font-weight: 300; font-display: swap; src: url(../fonts/tng_pro_light-webfont.woff2) format("woff2"); }
@font-face { font-family: "TNG Pro"; font-style: normal; font-weight: 400; font-display: swap; src: url(../fonts/tng_pro_regular-webfont.woff2) format("woff2"); }
@font-face { font-family: "TNG Pro"; font-style: normal; font-weight: 500; font-display: swap; src: url(../fonts/tng_pro_medium-webfont.woff2) format("woff2"); }

:root {
    --tn-blue: #001ed2;
    --tn-blue-700: #0018a8;
    --tn-blue-900: #00127e;
    --tn-blue-400: #334bdb;
    --tn-blue-50: #e6e9fb;
    --tn-blue-10: #f2f4fd;
    --tn-darkblue: #00003c;
    --tn-darkblue-400: #333363;
    --tn-darkblue-300: #66668a;
    --tn-darkblue-200: #9999b1;
    --tn-gray: #ececf0;
    --tn-gray-400: #f6f6f8;
    --tn-gray-600: #d6dce2;
    --tn-font: "TNG Pro", ui-sans-serif, system-ui, sans-serif;
    --tn-gutter: 28px;
    --tn-header-h: 73px;

    --bs-body-font-family: var(--tn-font);
    --bs-body-color: var(--tn-darkblue);
    --bs-body-font-size: 1rem;
    --bs-body-line-height: 1.5;
    --bs-link-color: var(--tn-blue);
    --bs-link-color-rgb: 0, 30, 210;
    --bs-link-hover-color: var(--tn-blue-900);
    --bs-link-hover-color-rgb: 0, 18, 126;
    --bs-primary: var(--tn-blue);
    --bs-primary-rgb: 0, 30, 210;
    --bs-border-color: var(--tn-gray-600);
    --bs-border-radius: 4px;
}

@media (min-width: 768px) { :root { --tn-gutter: 32px; } }
@media (min-width: 1024px) { :root { --tn-gutter: 40px; } }
@media (min-width: 1280px) { :root { --tn-header-h: 114px; } }
@media (min-width: 1440px) { :root { --tn-gutter: 72px; } }
@media (min-width: 1920px) { :root { --tn-gutter: 156px; } }

html { scroll-padding-top: var(--tn-header-h); }
body {
    font-family: var(--tn-font);
    color: var(--tn-darkblue);
    background: #fff;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
body.tn-locked { overflow: hidden; }
h1, h2, h3, h4, h5, h6 { font-weight: 400; color: inherit; }
a { color: var(--tn-blue); }
::selection { background: var(--tn-blue-50); color: var(--tn-blue-400); }
button { color: inherit; }
:focus-visible { outline: 2px solid var(--tn-blue); outline-offset: 2px; border-radius: 4px; }

.tn-container {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding-left: var(--tn-gutter);
    padding-right: var(--tn-gutter);
}
@media (min-width: 1920px) { .tn-container { width: min(2232px, 100%); } }

.tn-icon { width: 24px; height: 24px; flex: none; display: block; fill: currentColor; }

.tn-skip-link {
    position: absolute; left: 50%; top: -100px; transform: translateX(-50%); z-index: 2000;
    background: var(--tn-blue); color: #fff; padding: 8px 16px; border-radius: 4px; font-weight: 500;
}
.tn-skip-link:focus { top: 8px; color: #fff; }

/* ---------- Header ---------- */
.tn-header {
    position: sticky; top: 0; z-index: 1030;
    background: #fff; color: var(--tn-darkblue);
    border-bottom: 1px solid var(--tn-gray);
}
.tn-header__inner {
    display: flex; align-items: center; justify-content: space-between; gap: 24px;
    padding-top: 24px; padding-bottom: 16px;
}
@media (min-width: 1280px) { .tn-header__inner { align-items: flex-start; } }

.tn-logo { display: flex; margin-top: -24px; border-radius: 4px; color: var(--tn-blue); }
.tn-logo__svg { height: 56px; width: auto; display: block; }
@media (min-width: 1440px) { .tn-logo__svg { height: 64px; } }
@media (min-width: 1920px) { .tn-logo__svg { height: 80px; } }

.tn-header__right { flex-direction: column; align-items: flex-end; gap: 24px; }

.tn-lang { display: flex; align-items: center; gap: 4px; height: 24px; }
.tn-lang__globe { color: #374151; display: flex; border-radius: 4px; }
.tn-lang__globe:hover { color: var(--tn-blue); }
.tn-lang__flag {
    display: flex; width: 24px; height: 24px; padding: 2px; border: 0; background: none; border-radius: 4px;
    align-items: center; justify-content: center;
}
.tn-lang__flag .tn-icon { width: 20px; height: 20px; }
.tn-lang__menu {
    --bs-dropdown-border-width: 0; --bs-dropdown-border-radius: 4px; --bs-dropdown-padding-x: 16px; --bs-dropdown-padding-y: 16px;
    margin-top: 14px !important; box-shadow: 0 4px 24px 0 rgba(0, 0, 0, .15); color: var(--tn-darkblue);
}
.tn-lang__label { font-size: .84375rem; line-height: 1.3; letter-spacing: .015em; margin-bottom: 16px; }
.tn-lang__item { display: flex; align-items: center; font-size: .9375rem; line-height: 1.5; color: var(--tn-darkblue); text-decoration: none; }
.tn-lang__item + .tn-lang__item { margin-top: 12px; }
a.tn-lang__item:hover { color: var(--tn-blue); }
.tn-lang__radio {
    width: 24px; height: 24px; margin-right: 8px; border-radius: 50%; background: var(--tn-gray-400);
    border: 1px solid var(--tn-gray); position: relative;
}
.tn-lang__item.is-current .tn-lang__radio::after {
    content: ""; position: absolute; left: 50%; top: 50%; width: 12px; height: 12px; border-radius: 50%;
    background: var(--tn-blue); transform: translate(-50%, -50%);
}

.tn-nav__list { display: flex; gap: 40px; margin: 0; padding: 0; list-style: none; }
.tn-nav__item { display: flex; }
.tn-nav__link {
    position: relative; display: flex; align-items: center; padding: 0; border: 0; background: none;
    font-size: 1.25rem; line-height: 1.25; letter-spacing: .0025em; color: var(--tn-darkblue);
    text-decoration: none; transition: color .2s;
}
.tn-nav__link:hover, .tn-nav__link[aria-expanded="true"], .tn-nav__link.is-active { color: var(--tn-blue); }
.tn-nav__link::after {
    content: ""; position: absolute; left: 0; right: 0; top: 100%; margin-top: 13px; height: 4px;
    background: var(--tn-blue); transform: scaleY(0); transform-origin: bottom; transition: transform .2s;
}
.tn-nav__link.is-active::after { transform: scaleY(1); }
.tn-nav__search { height: 25px; }
.tn-nav__search::after { display: none; }
.tn-nav__search .tn-icon { width: 24px; height: 24px; }
.tn-nav__search-close, .tn-nav__search[aria-expanded="true"] .tn-nav__search-open { display: none; }
.tn-nav__search[aria-expanded="true"] .tn-nav__search-close { display: block; }

.tn-header__mobile { align-items: center; gap: 24px; }
.tn-icon-btn { display: flex; padding: 0; border: 0; background: none; color: var(--tn-darkblue); border-radius: 4px; }
.tn-icon-btn .tn-icon { width: 28px; height: 28px; }
.tn-burger__close, .tn-burger[aria-expanded="true"] .tn-burger__open { display: none; }
.tn-burger[aria-expanded="true"] .tn-burger__close { display: block; }

/* ---------- Mega menu ---------- */
.tn-mega {
    position: absolute; left: 0; right: 0; top: 100%; margin-top: 1px;
    height: calc(100vh - var(--tn-header-h)); overflow: hidden;
}
.tn-mega[hidden] { display: none; }
.tn-mega__panel--columns { position: absolute; inset: 0; pointer-events: none; z-index: 1; }
.tn-mega__grid { display: flex; height: 100%; }
.tn-mega__col {
    pointer-events: auto; position: relative; width: 33.3333%; height: 100%; background: #fff;
    padding: 32px 16px; margin-left: -16px; border-right: 1px solid var(--tn-gray);
    overflow-y: auto; overscroll-behavior: contain;
}
.tn-mega__col:first-child::before {
    content: ""; position: absolute; top: 0; right: 100%; width: 25vw; height: 100%; background: #fff;
}
.tn-mega__col:first-child { overflow: visible; }
.tn-mega__col--sub { margin-left: 0; padding-left: 16px; }
.tn-mega__col--sub:not(.has-open) { visibility: hidden; }
.tn-mega__overlay-wrap { position: absolute; inset: 0; }
.tn-mega__overlay {
    position: absolute; inset: 0; width: 100%; border: 0; padding: 0;
    background: rgba(0, 0, 60, .85); cursor: default;
}
.tn-mega__close {
    position: absolute; top: 16px; left: calc(66.6667% + 13px); z-index: 2;
    display: flex; padding: 4px; border: 0; background: none; color: #fff; border-radius: 4px;
}
.tn-mega__close .tn-icon { width: 24px; height: 24px; }
@media (min-width: 1440px) {
    .tn-mega__close { left: calc(var(--tn-gutter) + (100% - 2 * var(--tn-gutter)) * .6667 + 13px); }
}

.tn-mega__title {
    font-size: 1.4375rem; line-height: 1.2; letter-spacing: -.005em; margin-bottom: 8px;
}
@media (min-width: 1440px) { .tn-mega__title { font-size: 1.75rem; letter-spacing: -.015em; } }
.tn-mega__overview {
    display: inline-block; font-size: .96875rem; line-height: 1.5; letter-spacing: .005em;
    color: var(--tn-darkblue); text-decoration: none; border-bottom: 1px solid var(--tn-darkblue);
}
.tn-mega__overview:hover { color: var(--tn-blue); border-color: var(--tn-blue); }
.tn-mega__list { list-style: none; margin: 32px 0 0; padding: 0; }
.tn-mega__link {
    display: flex; width: 100%; gap: 8px; justify-content: space-between; align-items: flex-start;
    padding: 4px 0; border: 0; background: none; text-align: left; text-decoration: none;
    font-size: 1.125rem; line-height: 1.3; color: var(--tn-darkblue); transition: color .2s;
}
@media (min-width: 1440px) { .tn-mega__link { font-size: 1.28125rem; letter-spacing: -.005em; } }
.tn-mega__link:hover, .tn-mega__link[aria-expanded="true"] { color: var(--tn-blue); }
.tn-mega__back {
    display: flex; align-items: center; gap: 4px; padding: 0; margin-bottom: 12px; border: 0; background: none;
    font-size: .96875rem; line-height: 1.5; color: var(--tn-darkblue);
}
.tn-mega__back:hover { color: var(--tn-blue); }
.tn-mega__back .tn-icon { width: 20px; height: 20px; }

.tn-mega--search .tn-mega__panel { position: relative; z-index: 1; background: #fff; padding: 32px 0 40px; }
.tn-search { display: flex; gap: 16px; }
.tn-search__input {
    flex: 1; width: 100%; padding: 16px; border: 1px solid var(--tn-gray-600); border-radius: 4px; outline: none;
    font-size: 1rem; color: var(--tn-darkblue); font-family: inherit;
}
.tn-search__input::placeholder { color: var(--tn-darkblue-200); }
.tn-search__input:focus { border-color: var(--tn-blue); box-shadow: 0 0 0 1px var(--tn-blue); }

/* ---------- Mobile offcanvas ---------- */
.tn-offcanvas {
    position: fixed; left: 0; right: 0; bottom: 0; top: var(--tn-header-h); z-index: 1029;
    background: #fff; overflow-y: auto; overscroll-behavior: contain;
    transform: translateX(100%); visibility: hidden; transition: transform .3s, visibility .3s;
}
.tn-offcanvas.is-open { transform: none; visibility: visible; }
.tn-offcanvas__body { padding-top: 24px; padding-bottom: 24px; }
.tn-mnav[hidden] { display: none; }
.tn-mnav__list { list-style: none; margin: 0; padding: 0; }
.tn-mnav__title { font-size: 1.4375rem; line-height: 1.2; letter-spacing: -.005em; margin: 4px 0 12px; }
.tn-mnav .tn-mega__overview + .tn-mnav__list { margin-top: 16px; }
.tn-mnav__link {
    display: flex; width: 100%; align-items: center; justify-content: space-between; padding: 12px 0;
    border: 0; background: none; text-align: left; text-decoration: none;
    font-size: 1rem; line-height: 1.55; color: var(--tn-darkblue);
}
.tn-mnav__link:hover { color: var(--tn-blue); }
.tn-mnav__back {
    display: flex; align-items: center; gap: 4px; padding: 12px 0; border: 0; background: none;
    font-size: .96875rem; color: var(--tn-darkblue);
}
.tn-mnav__back .tn-icon { width: 20px; height: 20px; }
.tn-mnav__meta { list-style: none; margin: 32px 0 0; padding: 0; }
.tn-mnav__meta li, .tn-mnav__meta a {
    display: flex; align-items: center; gap: 8px; padding: 12px 0; font-size: .9375rem;
    color: var(--tn-darkblue-400); text-decoration: none;
}
.tn-mnav__meta li.is-current { color: var(--tn-blue); }

/* ---------- Buttons ---------- */
.tn-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 0; max-width: 100%;
    padding: 14px; border: 1px solid var(--tn-blue-700); border-radius: 4px;
    background: var(--tn-blue); color: #fff; text-decoration: none; text-align: left;
    font-size: 1rem; transition: background-color .2s, border-color .2s; cursor: pointer;
}
.tn-btn span { padding: 0 4px; font-weight: 500; line-height: 1.1; letter-spacing: .005em; }
.tn-btn .tn-icon { width: 18px; height: 18px; }
.tn-btn:hover, .tn-btn:focus-visible { background: var(--tn-blue-900); border-color: var(--tn-blue); color: #fff; }
.tn-btn--outline { background: #fff; color: var(--tn-blue); border-color: #ccd2f6; }
.tn-btn--outline:hover { background: var(--tn-blue-10); color: var(--tn-blue); border-color: #6678e4; }

/* ---------- Hero ---------- */
.tn-hero {
    position: relative; isolation: isolate; overflow: hidden; color: #fff; background: var(--tn-darkblue);
    min-height: calc(100vh - var(--tn-header-h));
}
.tn-hero__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; z-index: -2; }
.tn-hero__shade { position: absolute; inset: 0; z-index: -1; background: linear-gradient(to bottom, rgba(0, 0, 0, .4), rgba(0, 0, 0, 0)), rgba(0, 0, 0, .25); }
.tn-hero__content { padding-top: 31px; }
@media (min-width: 1280px) { .tn-hero__content { padding-top: 38px; } }
@media (min-width: 1440px) { .tn-hero__content { padding-top: 55px; } }
.tn-hero__overline { text-transform: uppercase; font-size: .8125rem; line-height: 1.25; letter-spacing: .035em; }
.tn-hero__title {
    margin: 16px 0 0; font-weight: 400; text-wrap: balance;
    font-size: 2.5rem; line-height: 1.15; letter-spacing: -.01em;
}
@media (min-width: 768px) { .tn-hero__title { font-size: 4rem; line-height: 1.1; letter-spacing: -.015em; } }
@media (min-width: 1440px) { .tn-hero__title { font-size: 4.34375rem; line-height: 1.05; } }

/* ---------- Sections / typography ---------- */
.tn-section { padding-top: 32px; padding-bottom: 32px; }
@media (min-width: 768px) { .tn-section { padding-top: 40px; padding-bottom: 40px; } }
@media (min-width: 1440px) { .tn-section { padding-top: 48px; padding-bottom: 48px; } }
@media (min-width: 1920px) { .tn-section { padding-top: 64px; padding-bottom: 64px; } }

.tn-h2 { margin: 0 0 16px; font-size: 1.4375rem; line-height: 1.2; letter-spacing: -.005em; text-wrap: balance; }
@media (min-width: 1280px) { .tn-h2 { margin-bottom: 24px; } }
@media (min-width: 1440px) { .tn-h2 { font-size: 1.75rem; letter-spacing: -.015em; } }

.tn-teasers { display: grid; gap: 48px 24px; }
@media (min-width: 1024px) { .tn-teasers { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 64px; } }
@media (min-width: 1280px) { .tn-teasers { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1440px) { .tn-teasers { gap: 80px; } }
.tn-teaser { display: flex; flex-direction: column; align-items: flex-start; }
.tn-teaser__title { width: 100%; margin: 0 0 4px; font-size: 1.25rem; line-height: 1.25; text-wrap: balance; overflow-wrap: break-word; }
@media (min-width: 1024px) { .tn-teaser__title { margin-bottom: 8px; } }
@media (min-width: 1440px) { .tn-teaser__title { font-size: 1.5rem; line-height: 1.2; letter-spacing: -.005em; } }
.tn-teaser__text { color: var(--tn-darkblue-400); font-size: 1rem; line-height: 1.55; margin-bottom: 16px; }
@media (min-width: 1024px) { .tn-teaser__text { margin-bottom: 24px; } }
@media (min-width: 1440px) { .tn-teaser__text { font-size: 1.0625rem; } }
.tn-teaser .tn-btn { width: 100%; justify-content: space-between; }
@media (min-width: 768px) { .tn-teaser .tn-btn { width: auto; justify-content: center; } }

/* ---------- Breadcrumb / page title ---------- */
.tn-breadcrumb { border-bottom: 1px solid var(--tn-gray); padding: 4px 0; overflow-x: auto; scrollbar-width: none; }
@media (min-width: 1440px) { .tn-breadcrumb { padding: 8px 0; } }
.tn-breadcrumb ol { display: flex; align-items: center; margin: 0; padding: 8px 0; list-style: none; }
.tn-breadcrumb li { display: flex; align-items: center; white-space: nowrap; font-size: .875rem; line-height: 1.25; letter-spacing: .015em; color: var(--tn-darkblue-400); }
.tn-breadcrumb a { display: flex; color: var(--tn-darkblue); text-decoration: none; border-radius: 4px; }
.tn-breadcrumb a:hover { color: var(--tn-blue); text-decoration: underline; }
.tn-breadcrumb__sep { width: 16px; height: 16px; margin: 0 4px; color: var(--tn-darkblue-200); }
@media (min-width: 1440px) { .tn-breadcrumb__sep { margin: 0 8px; } }

.tn-page-title { border-bottom: 1px solid var(--tn-gray); padding: 32px 0 24px; }
@media (min-width: 1440px) { .tn-page-title { padding-top: 48px; } }
.tn-page-title h1 { margin: 0; font-size: 1.75rem; line-height: 1.15; letter-spacing: -.015em; text-wrap: balance; }
@media (min-width: 1440px) { .tn-page-title h1 { font-size: 2.125rem; line-height: 1.1; letter-spacing: -.025em; } }
.tn-page-title p { margin: 12px 0 0; color: var(--tn-darkblue-400); font-size: 1rem; line-height: 1.55; max-width: 60rem; }
@media (min-width: 1440px) { .tn-page-title p { font-size: 1.0625rem; } }

.tn-content { font-size: 1rem; line-height: 1.55; }

/* ---------- Footer ---------- */
.tn-footer { background: var(--tn-blue); color: #fff; padding: 24px 0; overflow: hidden; }
@media (min-width: 1024px) { .tn-footer { padding: 40px 0; } }
@media (min-width: 1280px) { .tn-footer { padding: 64px 0; } }
@media (min-width: 1440px) { .tn-footer { padding: 48px 0; } }
.tn-footer ::selection { background: var(--tn-blue-400); color: #ccccd8; }
.tn-footer a { color: #fff; }
.tn-footer__inner { display: flex; flex-direction: column; gap: 40px; }
@media (min-width: 1024px) { .tn-footer__inner { gap: 64px; } }
@media (min-width: 1440px) { .tn-footer__inner { gap: 80px; } }
.tn-footer__top { display: flex; justify-content: space-between; gap: 16px; }
.tn-footer .tn-logo--footer { color: var(--tn-blue); }
.tn-totop {
    display: flex; flex: none; width: 42px; height: 42px; padding: 11px; align-self: flex-start;
    border: 1px solid var(--tn-darkblue-300); border-radius: 4px; color: #fff; transition: background-color .2s, color .2s;
}
@media (min-width: 1440px) { .tn-totop { width: 44px; height: 44px; padding: 12px; } }
.tn-totop .tn-icon { width: 18px; height: 18px; }
@media (min-width: 1440px) { .tn-totop .tn-icon { width: 20px; height: 20px; } }
.tn-totop:hover { background: #fff; color: var(--tn-blue) !important; }

.tn-footer__offices { display: grid; gap: 40px 24px; }
.tn-footer__offices:empty { display: none; }
@media (min-width: 1024px) { .tn-footer__offices { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.tn-office { display: flex; flex-direction: column; gap: 12px; }
.tn-office__title { margin: 0; font-size: 1.125rem; line-height: 1.3; text-wrap: balance; }
@media (min-width: 1440px) { .tn-office__title { font-size: 1.28125rem; letter-spacing: -.005em; } }
.tn-office__list { display: flex; flex-direction: column; gap: 8px; margin: 0; padding: 0; list-style: none; }
.tn-office__list li { display: flex; gap: 10px; align-items: flex-start; font-size: .9375rem; line-height: 1.5; letter-spacing: .0005em; }
@media (min-width: 1440px) { .tn-office__list li { font-size: 1rem; line-height: 1.55; } }
.tn-office__list .tn-icon { width: 20px; height: 20px; margin-top: 2px; opacity: .85; }
.tn-office__list address { font-style: normal; }
.tn-office__list a { color: inherit; text-decoration: none; }
.tn-office__list a:hover { text-decoration: underline; }
.tn-office__map {
    display: inline-flex; align-items: center; gap: 4px; align-self: flex-start; margin-top: 4px;
    font-size: .9375rem; font-weight: 500; color: inherit; text-decoration: none; border-bottom: 1px solid currentColor;
}
.tn-office__map .tn-icon { width: 16px; height: 16px; transition: transform .2s; }
.tn-office__map:hover .tn-icon { transform: translateX(3px); }
@media (min-width: 1280px) { .tn-footer .tn-office { padding-right: 16px; } }

.tn-office--card { height: 100%; background: #fff; border: 1px solid var(--tn-gray-600); padding: 24px; color: var(--tn-darkblue); }
.tn-office--card .tn-office__list .tn-icon { color: var(--tn-blue); opacity: 1; }
.tn-office--card .tn-office__map { color: var(--tn-blue); }
.tn-office__embed { display: block; width: calc(100% + 48px); margin: auto -24px -24px; min-height: 240px; height: 240px; border: 0; border-top: 1px solid var(--tn-gray-600); }

.tn-offices { display: grid; gap: 24px; }
@media (min-width: 1024px) { .tn-offices { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.tn-section--gray { background: var(--tn-gray-400); }

.tn-quick { display: grid; gap: 24px; }
@media (min-width: 768px) { .tn-quick { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.tn-quick__item {
    position: relative; display: flex; flex-direction: column; gap: 4px; padding: 24px 56px 24px 24px;
    border: 1px solid var(--tn-gray-600); color: var(--tn-darkblue); text-decoration: none; transition: border-color .2s, box-shadow .2s;
}
.tn-quick__item:hover { color: var(--tn-darkblue); border-color: var(--tn-blue); box-shadow: 0 4px 24px 0 rgba(0, 0, 0, .15); }
.tn-quick__label { text-transform: uppercase; font-size: .8125rem; line-height: 1.25; letter-spacing: .035em; color: var(--tn-blue); }
.tn-quick__value { font-size: 1.25rem; line-height: 1.25; overflow-wrap: anywhere; }
.tn-quick__item .tn-icon { position: absolute; right: 24px; top: 50%; width: 16px; height: 16px; transform: translateY(-50%); transition: transform .2s; }
.tn-quick__item:hover .tn-icon { transform: translate(4px, -50%); color: var(--tn-blue); }

.tn-footer__legal { position: relative; display: flex; flex-direction: column; padding-top: 16px; }
.tn-footer__legal::before {
    content: ""; position: absolute; top: 0; left: 50%; width: 100vw; transform: translateX(-50%);
    border-top: 1px solid var(--tn-blue-400);
}
@media (min-width: 1440px) { .tn-footer__legal { flex-direction: row; justify-content: space-between; align-items: flex-end; } }
.tn-social { display: flex; flex-wrap: wrap; gap: 20px; margin: 0; padding: 0; list-style: none; }
@media (min-width: 1440px) { .tn-social { order: 2; } }
.tn-social a {
    display: flex; width: 40px; height: 40px; padding: 10px; border-radius: 50%;
    color: #fff; transition: background-color .2s, color .2s;
}
@media (min-width: 1440px) { .tn-social a { width: 48px; height: 48px; } }
.tn-social a .tn-icon { width: 100%; height: 100%; }
.tn-social a:hover { background: var(--tn-blue-50); color: var(--tn-blue); }
.tn-footer__copyright { margin-top: 40px; font-size: .84375rem; line-height: 1.3; letter-spacing: .015em; }
@media (min-width: 1440px) { .tn-footer__copyright { margin-top: 0; } }

/* ---------- Certificate pages ---------- */
.tn-cert { max-width: 760px; }
.tn-cert__intro { color: var(--tn-darkblue-400); font-size: 1rem; line-height: 1.55; margin-bottom: 32px; }
@media (min-width: 1440px) { .tn-cert__intro { font-size: 1.0625rem; } }
.tn-cert__intro p { margin: 0 0 8px; }
.tn-cert__intro a { color: var(--tn-blue); }
.tn-card {
    background: #fff; border: 1px solid var(--tn-gray); border-radius: 4px; padding: 24px;
    box-shadow: 0 4px 24px 0 rgba(0, 0, 0, .08);
}
@media (min-width: 1024px) { .tn-card { padding: 32px; } }
.tn-form-label { display: block; margin-bottom: 8px; font-size: 1rem; font-weight: 500; line-height: 1.5; color: var(--tn-darkblue); }
.tn-form-label .text-danger, .tn-required { color: #c8102e !important; }
.tn-radio { display: flex; align-items: center; gap: 12px; padding: 6px 0; margin: 0; cursor: pointer; font-size: 1rem; line-height: 1.5; }
.tn-radio input {
    appearance: none; flex: none; width: 24px; height: 24px; margin: 0; border-radius: 50%;
    border: 1px solid var(--tn-darkblue-300); background: #fff; display: grid; place-items: center; cursor: pointer;
}
.tn-radio input::after { content: ""; width: 12px; height: 12px; border-radius: 50%; background: var(--tn-blue); transform: scale(0); transition: transform .15s; }
.tn-radio input:checked { border-color: var(--tn-blue); }
.tn-radio input:checked::after { transform: scale(1); }
.tn-input {
    display: block; width: 100%; padding: 15px 16px; border: 1px solid var(--tn-gray-600); border-radius: 4px;
    font-family: inherit; font-size: 1rem; line-height: 1.5; color: var(--tn-darkblue); background: #fff; outline: none;
}
.tn-input::placeholder { color: var(--tn-darkblue-200); }
.tn-input:focus { border-color: var(--tn-blue); box-shadow: 0 0 0 1px var(--tn-blue); }
.tn-input.is-invalid { border-color: #c8102e; }
.tn-hint { display: block; margin-top: 8px; font-size: .875rem; color: var(--tn-darkblue-300); }
.tn-alert {
    display: flex; gap: 12px; align-items: flex-start; margin-top: 16px; padding: 16px; border-radius: 4px;
    border-left: 4px solid var(--tn-blue); background: var(--tn-blue-10); color: var(--tn-darkblue); font-size: 1rem; line-height: 1.5;
}
.tn-alert--error { border-left-color: #c8102e; background: #fdf2f4; }
.tn-alert--warning { border-left-color: #e6a100; background: #fff8e6; }
.tn-alert select { margin-left: 8px; }
.tn-select {
    padding: 8px 36px 8px 12px; border: 1px solid var(--tn-gray-600); border-radius: 4px; font-family: inherit; font-size: 1rem;
    color: var(--tn-darkblue); background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%2300003c' d='M12 15.5 6.5 10l1-1 4.5 4.5L16.5 9l1 1z'/%3E%3C/svg%3E") no-repeat right 8px center / 20px;
    appearance: none;
}

.tn-tabs { display: flex; gap: 32px; margin: 0 0 24px; padding: 0; list-style: none; border-bottom: 1px solid var(--tn-gray-600); }
.tn-tabs .nav-link {
    position: relative; padding: 12px 0; border: 0; background: none; border-radius: 0;
    font-size: 1.125rem; line-height: 1.3; color: var(--tn-darkblue-400);
}
.tn-tabs .nav-link:hover { color: var(--tn-blue); }
.tn-tabs .nav-link.active { color: var(--tn-blue); }
.tn-tabs .nav-link.active::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 4px; background: var(--tn-blue); }

.tn-facts { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--tn-gray); }
.tn-facts li { display: grid; grid-template-columns: 1fr; gap: 2px; padding: 14px 0; border-bottom: 1px solid var(--tn-gray); font-size: 1rem; line-height: 1.55; }
@media (min-width: 768px) { .tn-facts li { grid-template-columns: 240px 1fr; gap: 24px; } }
.tn-facts dt, .tn-facts .tn-facts__label { font-weight: 400; color: var(--tn-darkblue-300); }
.tn-facts .tn-facts__value { color: var(--tn-darkblue); }
.tn-status { display: inline-flex; align-items: center; gap: 8px; }
.tn-status::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--tn-darkblue-200); }
.tn-status--active::before { background: #00a651; }
.tn-status--suspended::before { background: #e6a100; }
.tn-status--revoked::before, .tn-status--inactive::before { background: #c8102e; }

.tn-table { --bs-table-color: var(--tn-darkblue); --bs-table-striped-bg: var(--tn-gray-400); --bs-table-border-color: var(--tn-gray); font-size: .9375rem; }
.tn-table thead th { background: var(--tn-blue); color: #fff; font-weight: 500; border-color: var(--tn-blue-700); vertical-align: middle; }
.tn-table td, .tn-table th { padding: 12px 16px; }

/* ---------- Certificate landing (cards) & search ---------- */
.tn-section--lg { padding-top: 48px; padding-bottom: 64px; }
@media (min-width: 1440px) { .tn-section--lg { padding-top: 48px; padding-bottom: 96px; } }
.tn-overline { margin-bottom: 8px; text-transform: uppercase; font-size: .8125rem; line-height: 1.25; letter-spacing: .035em; color: var(--tn-darkblue); }
.tn-intro { display: grid; gap: 16px; margin-bottom: 24px; }
@media (min-width: 1024px) { .tn-intro { grid-template-columns: 1fr 1fr; gap: 24px 64px; align-items: end; } }
.tn-intro__text { margin: 0; font-size: 1rem; line-height: 1.55; color: var(--tn-darkblue); }
.tn-cards { display: grid; gap: 24px; }
@media (min-width: 768px) { .tn-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1280px) { .tn-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.tn-card-link {
    display: flex; flex-direction: column; border: 1px solid var(--tn-gray-600); background: #fff;
    color: var(--tn-darkblue); text-decoration: none; transition: box-shadow .2s, border-color .2s;
}
.tn-card-link:hover { color: var(--tn-darkblue); border-color: var(--tn-blue); box-shadow: 0 4px 24px 0 rgba(0, 0, 0, .15); }
.tn-card-link__head { display: flex; flex-direction: column; gap: 12px; min-height: 190px; padding: 24px; border-bottom: 1px solid var(--tn-gray-600); }
.tn-card-link__overline { text-transform: uppercase; font-size: .8125rem; line-height: 1.25; letter-spacing: .035em; color: var(--tn-blue); }
.tn-card-link__title { font-size: 1.25rem; line-height: 1.25; text-wrap: balance; }
@media (min-width: 1440px) { .tn-card-link__title { font-size: 1.4375rem; line-height: 1.2; letter-spacing: -.005em; } }
.tn-card-link__body { display: flex; flex: 1; flex-direction: column; justify-content: space-between; gap: 24px; padding: 24px; }
.tn-card-link__text { font-size: 1rem; line-height: 1.55; }
.tn-card-link__body .tn-icon { width: 16px; height: 16px; transition: transform .2s; }
.tn-card-link:hover .tn-card-link__body .tn-icon { transform: translateX(4px); color: var(--tn-blue); }

.tn-band-wrap { padding: 0 0 64px; }
@media (min-width: 1440px) { .tn-band-wrap { padding: 0 32px 80px; } }
.tn-band { background: var(--tn-gray-400); padding: 40px 0; }
.tn-band__inner { display: grid; gap: 16px; }
@media (min-width: 1024px) { .tn-band__inner { grid-template-columns: 1fr 2fr; gap: 24px; } }
.tn-band__title { margin: 0; font-size: 1.4375rem; line-height: 1.2; letter-spacing: -.005em; max-width: 14ch; }
@media (min-width: 1440px) { .tn-band__title { font-size: 1.75rem; letter-spacing: -.015em; } }
.tn-band__text { margin: 0 0 24px; font-size: 1rem; line-height: 1.55; max-width: 38rem; }

.tn-search-form { max-width: 636px; }
@media (min-width: 1024px) { .tn-search-form { margin-left: calc((100% - 11 * 24px) / 12 * 3 + 3 * 24px); } }
.tn-search-form__label { display: block; margin-bottom: 16px; font-size: .9375rem; line-height: 1.5; color: var(--tn-darkblue); }
.tn-search-form .tn-input { padding: 12px; border-radius: 2px; }
.tn-search-form__hint { margin-top: 8px; font-size: 1rem; line-height: 1.5; color: var(--tn-darkblue); }
.tn-search-form__submit { margin-top: 40px; }
.tn-search-form__submit .tn-icon { width: 16px; height: 16px; }
@media (min-width: 1440px) { .tn-band .tn-container { padding-left: calc(var(--tn-gutter) - 32px); padding-right: calc(var(--tn-gutter) - 32px); } }
@media (min-width: 1024px) { .tn-section > .tn-container > .tn-h2 { max-width: calc(50% - 12px); } }
@media (min-width: 1440px) { .tn-hero__overline { max-width: calc((100% - 11 * 24px) / 12 * 4 + 3 * 24px); } }