/* ICC Shipping draft preview — one stylesheet for all pages.
   Visual target: docs/design/references/eight-page-overview.png (grid wins over approved-homepage.png). */
:root {
  --navy: #0b2c4d;
  --navy-deep: #071f38;
  --ink: #12263f;
  --muted: #5b6b7e;
  --teal: #0b79a6;
  --cyan: #2fd8f2;
  --cyan-soft: #d6f6fc;
  --line: #e2e9f1;
  --soft: #f3f7fb;
  --white: #fff;
  --serif: "Source Serif 4", "Source Serif Pro", Georgia, "Times New Roman", serif;
  --sans: "Inter", "Segoe UI", system-ui, -apple-system, Arial, sans-serif;
  --wrap: 1300px;
  --shadow: 0 6px 22px rgba(11, 44, 77, 0.09);
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; } }
body { margin: 0; font-family: var(--sans); color: var(--ink); background: var(--white); line-height: 1.55; -webkit-font-smoothing: antialiased; }
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
h1, h2, h3, h4 { font-family: var(--serif); font-weight: 600; line-height: 1.12; margin: 0; letter-spacing: -0.01em; }
p { margin: 0; }
svg.i { width: 1.15em; height: 1.15em; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.icon-library { position: absolute; width: 0; height: 0; overflow: hidden; }
.wrap { width: min(var(--wrap), 100% - 48px); margin-inline: auto; }
.eyebrow { font: 600 0.78rem/1 var(--sans); letter-spacing: 0.17em; text-transform: uppercase; color: var(--teal); margin-bottom: 14px; }
.on-dark .eyebrow, .eyebrow.light { color: var(--cyan); }
.rule { display: block; width: 46px; height: 3px; background: var(--cyan); margin-top: 14px; border-radius: 2px; }
.stub { position: relative; cursor: not-allowed; opacity: .65; text-decoration: underline dotted; text-underline-offset: 3px; }
.stub:hover::after, .stub:focus-visible::after { content: attr(data-tip); position: absolute; left: 0; top: calc(100% + 6px); z-index: 60; white-space: nowrap; font: 500 .72rem/1 var(--sans); background: #0c2b4d; color: #fff; padding: 7px 9px; border-radius: 5px; text-decoration: none; pointer-events: none; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.social .stub, .lang.stub { text-decoration: none; }

/* Draft notice (must stay visible on every page) */
.preview-bar { background: var(--navy-deep); color: #c5d6e8; font-size: 0.74rem; text-align: center; padding: 6px 16px; letter-spacing: 0.01em; }
.preview-bar b { color: var(--cyan); font-weight: 600; }

/* Header */
.site-header { position: sticky; top: 0; z-index: 50; background: #fff; border-bottom: 1px solid var(--line); }
.site-header .wrap { display: flex; align-items: center; gap: 28px; height: 92px; }
.brand { display: inline-flex; align-items: center; }
.brand img { height: 68px; width: auto; }
.primary-nav { margin-left: auto; display: flex; align-items: center; gap: 30px; font-size: 0.86rem; font-weight: 500; }
.primary-nav a.link { position: relative; padding: 34px 0; color: #223850; }
.primary-nav a.link[aria-current="page"] { color: var(--ink); }
.primary-nav a.link[aria-current="page"]::after { content: ""; position: absolute; left: 0; right: 0; bottom: 24px; height: 2px; background: var(--cyan); }
.lang { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--line); border-radius: 6px; padding: 7px 10px; font-size: 0.78rem; font-weight: 600; background: #fff; }
.lang .i { width: 0.9em; height: 0.9em; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; font: 600 0.9rem/1 var(--sans); padding: 15px 22px; border-radius: 7px; border: 1.5px solid transparent; cursor: pointer; transition: transform .15s, background .15s; white-space: nowrap; }
.btn:hover { transform: translateY(-1px); }
.btn-navy { background: var(--navy); color: #fff; }
.btn-navy:hover { background: #0f3a66; }
.btn-cyan { background: var(--cyan); color: #06243d; }
.btn-cyan:hover { background: #5de6f8; }
.btn-ghost { border-color: rgba(255,255,255,.55); color: #fff; background: rgba(255,255,255,.06); }
.btn-ghost-cyan { border-color: var(--cyan); color: var(--cyan); }
.btn-outline { border-color: #b8c7d8; color: var(--navy); background: #fff; }
.btn[disabled] { opacity: .6; cursor: not-allowed; transform: none; }
.nav-quote { padding: 12px 18px; font-size: 0.82rem; }
.menu-button { display: none; margin-left: auto; width: 44px; height: 44px; border: 1px solid var(--line); border-radius: 8px; background: #fff; color: var(--ink); align-items: center; justify-content: center; }
.menu-button .i { width: 22px; height: 22px; }

/* Heroes */
.hero, .page-hero { position: relative; color: #fff; background: var(--navy-deep); overflow: hidden; isolation: isolate; }
.hero > img.bg, .page-hero > img.bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; }
.hero::before, .page-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(8,35,64,.93) 0%, rgba(8,35,64,.78) 34%, rgba(8,35,64,.2) 66%, rgba(8,35,64,0) 100%); }
.hero { min-height: 640px; display: flex; flex-direction: column; justify-content: space-between; }
.hero .hero-body { padding: 92px 0 40px; max-width: 840px; }
.hero h1 { font-size: clamp(2.4rem, 5.3vw, 4.7rem); margin-bottom: 24px; }
.hero p.lead { font-size: 1.12rem; color: #e1ebf5; max-width: 520px; }
.hero .actions { display: flex; gap: 16px; margin-top: 34px; flex-wrap: wrap; }
.hero .actions .btn { padding: 19px 30px; font-size: 1rem; border-radius: 9px; }
.hero .hero-img-pos { object-position: 70% 50%; }
.trust { background: linear-gradient(0deg, rgba(8,35,64,.72), rgba(8,35,64,0)); padding: 26px 0 24px; }
.trust ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, auto); justify-content: space-between; gap: 18px; }
.trust li { display: flex; align-items: center; gap: 12px; font-size: 0.9rem; font-weight: 500; }
.trust .i { width: 26px; height: 26px; }
.page-hero { min-height: 480px; display: flex; align-items: center; }
.page-hero.tall { min-height: 450px; }
.page-hero .body { padding: 64px 0; max-width: 900px; }
.page-hero h1 { font-size: clamp(2.3rem, 5.5vw, 4.7rem); margin-bottom: 22px; }
.page-hero p.lead { color: #e4edf7; max-width: 680px; font-size: 1.28rem; }
.page-hero.light::before { background: linear-gradient(90deg, rgba(8,35,64,.95) 0%, rgba(8,35,64,.8) 38%, rgba(8,35,64,.1) 100%); }

/* Sections */
section { position: relative; }
.pad { padding: 64px 0; }
.pad-sm { padding: 44px 0; }
.soft { background: var(--soft); }
.section-head h2 { font-size: clamp(2rem, 3.6vw, 3rem); color: var(--navy-deep); }
.cards-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 34px; }
.card { background: #fff; border-radius: 10px; box-shadow: var(--shadow); overflow: hidden; border: 1px solid #edf2f7; }
.card .ph { aspect-ratio: 2.15 / 1; overflow: hidden; }
.card .ph img { width: 100%; height: 100%; object-fit: cover; }
.card .txt { display: grid; grid-template-columns: 56px 1fr; gap: 6px 16px; padding: 22px 24px 24px; }
.card .txt .ic { grid-row: span 3; color: var(--navy); }
.card .txt .ic .i { width: 52px; height: 52px; stroke-width: 1.5; }
.card h3, .card h2 { font-size: 1.45rem; color: var(--navy-deep); }
.card p { font-size: 0.98rem; color: var(--muted); }
.more { display: inline-flex; align-items: center; gap: 8px; font-size: 0.86rem; font-weight: 600; color: var(--teal); margin-top: 6px; }
.more .i { width: 1em; height: 1em; }
.card.plain { padding: 26px; background: var(--soft); box-shadow: none; }
.card.plain .ic { color: var(--teal); }
.card.plain .ic .i { width: 40px; height: 40px; }
.card.plain h3, .card.plain h2 { margin: 14px 0 8px; }
.card.plain p { margin-bottom: 18px; }

/* Quote band */
.quote-band { color: #fff; background: var(--navy-deep); overflow: hidden; isolation: isolate; }
.quote-band > img.bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; opacity: .5; }
.quote-band::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(7,31,56,.96) 0%, rgba(7,31,56,.84) 55%, rgba(7,31,56,.7) 100%); }
.quote-band .top { padding: 54px 0 34px; max-width: 760px; }
.quote-band h2 { font-size: clamp(2.2rem, 4vw, 3.2rem); margin-bottom: 14px; }
.quote-band .top p { color: #d4e1ee; font-size: 1.05rem; max-width: 540px; }
.mini-form { max-width: 100%; padding-bottom: 36px; }
.mini-form .row { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.mini-form label.f, .mini-form .legend { display: block; font-size: .82rem; font-weight: 600; margin-bottom: 7px; color: #eaf2fa; }
.input-icon { position: relative; }
.input-icon .i { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--navy); width: 1.05em; }
.input-icon input[type=text] { padding-left: 40px; }
.quote-band .input-icon input[type=text] { padding-top: 16px; padding-bottom: 16px; font-size: 1rem; }
input[type=text], input[type=email], input[type=tel], input[type=date], select, textarea { width: 100%; font: 400 .9rem var(--sans); color: var(--ink); background: #fff; border: 1px solid #cfd9e5; border-radius: 6px; padding: 13px 14px; }
input::placeholder, textarea::placeholder { color: #8b99a9; }
/* Focus: 3:1 against light backgrounds (navy) and against dark ones (white), plus a halo for imagery. */
input:focus-visible, select:focus-visible, textarea:focus-visible, .btn:focus-visible, a:focus-visible, button:focus-visible, [tabindex]:focus-visible { outline: 3px solid #0b3d91; outline-offset: 2px; box-shadow: 0 0 0 5px rgba(255,255,255,.9); }
.hero :focus-visible, .page-hero :focus-visible, .quote-band :focus-visible, .cta-band :focus-visible, .cta-img :focus-visible, .dark-band :focus-visible, .footer-bar :focus-visible, .preview-bar :focus-visible, .poti :focus-visible { outline-color: #fff; box-shadow: 0 0 0 5px rgba(8,35,64,.9); }
main:focus { outline: none; }
.skip { position: absolute; left: 12px; top: -60px; z-index: 100; background: #fff; color: var(--navy); padding: 12px 16px; border-radius: 6px; font-weight: 600; border: 2px solid var(--navy); }
.skip:focus { top: 12px; }
.mode-row { display: grid; grid-template-columns: repeat(3, 1fr) 1.6fr; gap: 14px; margin-top: 20px; align-items: end; }
.mode-tile { position: relative; }
.mode-tile input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.mode-tile span { display: flex; align-items: center; justify-content: center; gap: 10px; border: 1.5px solid rgba(255,255,255,.35); border-radius: 8px; padding: 19px 10px; font-size: .95rem; font-weight: 600; color: #fff; }
.mode-tile input:checked + span { background: var(--cyan); border-color: var(--cyan); color: #06243d; }
.mode-tile input:focus-visible + span { outline: 3px solid #fff; outline-offset: 2px; }
.features-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; border-top: 1px solid rgba(255,255,255,.14); padding: 26px 0 34px; }
.features-row > div { display: flex; gap: 16px; align-items: flex-start; padding-right: 20px; }
.features-row > div + div { padding-left: 28px; border-left: 1px solid rgba(255,255,255,.14); }
.features-row .i { width: 38px; height: 38px; color: var(--cyan); stroke-width: 1.4; }
.features-row strong { display: block; font-size: .88rem; }
.features-row span.s { font-size: .8rem; color: #b8cde2; }

/* Network */
.network { background: linear-gradient(180deg, #f7fafd, #eef4fa); padding: 60px 0; }
.network .grid { display: grid; grid-template-columns: 0.9fr 1.35fr 0.62fr; gap: 24px; align-items: center; }
.network h2 { font-size: clamp(2rem, 3.3vw, 2.8rem); color: var(--navy-deep); margin-bottom: 14px; }
.network p { color: #46586d; margin-bottom: 26px; max-width: 360px; }
.map { position: relative; }
.map img { width: 100%; opacity: .95; }
.poti { background: var(--navy); color: #fff; border-radius: 10px; overflow: hidden; box-shadow: var(--shadow); }
.poti .t { padding: 20px 22px; }
.poti .kick { font-size: .7rem; letter-spacing: .14em; text-transform: uppercase; color: var(--cyan); margin-bottom: 8px; }
.poti h3, .poti h2 { color: #fff; font-size: 1.4rem; margin-bottom: 8px; }
.poti p { font-size: .84rem; color: #cbdbeb; margin: 0 0 12px; max-width: none; }
.poti .more { color: var(--cyan); }
.poti img { width: 100%; aspect-ratio: 16/9; object-fit: cover; }

/* About */
.split { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; }
.split.rev .media { order: 2; }
.media img { width: 100%; border-radius: 10px; object-fit: cover; }
.split h2 { font-size: clamp(2rem, 3.6vw, 2.9rem); color: var(--navy-deep); margin-bottom: 16px; }
.split p { color: #46586d; font-size: 1.15rem; max-width: 560px; margin-bottom: 18px; }
.values { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; padding: 34px 0; }
.values > div { display: flex; gap: 16px; align-items: center; }
.values-icon { width: 54px; height: 54px; flex: 0 0 54px; display: grid; place-items: center; border: 1px solid #d5e5ef; border-radius: 15px; background: #eaf4fa; }
.values-icon .i { width: 28px; height: 28px; color: var(--navy); stroke-width: 1.75; }
.values-copy { min-width: 0; }
.values strong { font-size: 1.15rem; display: block; margin-bottom: 4px; }
.values span.s { font-size: 1.02rem; color: var(--muted); }
.dark-band { background: var(--navy-deep); color: #fff; overflow: hidden; }
.dark-band .grid { display: grid; grid-template-columns: .9fr 1.3fr; gap: 30px; align-items: center; padding: 56px 0; }
.dark-band h2 { font-size: clamp(2rem, 3.6vw, 3rem); margin-bottom: 16px; }
.dark-band p { color: #cfdceb; font-size: 1.1rem; max-width: 500px; margin-bottom: 26px; }

/* Breadcrumb, tabs */
.crumbs { background: var(--soft); font-size: .76rem; font-weight: 500; color: #3d5068; border-bottom: 1px solid var(--line); }
.crumbs .wrap { padding: 12px 0; display: flex; gap: 10px; align-items: center; }
.crumbs span.sep { color: #94a3b4; }
.tabs { border-bottom: 1px solid var(--line); }
.tabs .wrap { display: flex; gap: 44px; overflow-x: auto; }
.tabs a, .tabs .stub { padding: 22px 2px; font-size: 1.2rem; font-weight: 500; color: #4a5d73; white-space: nowrap; border-bottom: 2px solid transparent; margin-bottom: -1px; }
.tabs [aria-current="true"] { color: var(--teal); border-color: var(--cyan); font-weight: 600; }
.tabs .stub { color: #4a5d73; }
.check { list-style: none; padding: 0; margin: 0 0 8px; display: grid; gap: 12px; }
.check li { display: flex; gap: 12px; align-items: center; font-size: 1.2rem; color: #33475d; }
.check .i { width: 20px; height: 20px; color: var(--navy); }
.routes { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-top: 22px; }
.routes figure { margin: 0; background: #fff; border-radius: 8px; box-shadow: var(--shadow); overflow: hidden; border: 1px solid #edf2f7; }
.routes img { width: 100%; aspect-ratio: 3/2; object-fit: cover; }
.routes figcaption { padding: 18px 20px; font-weight: 600; font-size: 1.12rem; color: var(--navy-deep); }
.h-sm { font-size: 1.9rem; color: var(--navy-deep); }
.cta-band { background: var(--navy-deep); color: #fff; }
.cta-band .wrap { display: flex; align-items: center; justify-content: space-between; gap: 30px; padding: 58px 0; }
.cta-band h2 { font-size: clamp(1.9rem, 3.2vw, 2.7rem); margin-bottom: 8px; }
.cta-band p { color: #cfdceb; max-width: 560px; font-size: 1.08rem; }
.cta-img { color: #fff; background: var(--navy-deep); isolation: isolate; overflow: hidden; }
.cta-img > img.bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; }
.cta-img::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(7,31,56,.92), rgba(7,31,56,.55)); }
.cta-img .body { padding: 130px 0; max-width: 680px; }
.cta-img h2 { font-size: clamp(2rem, 3.8vw, 3.1rem); margin-bottom: 14px; }
.cta-img p { color: #dce8f4; font-size: 1.1rem; margin-bottom: 28px; }

/* Resources */
.res-grid { display: grid; grid-template-columns: 1.7fr 1fr; gap: 56px; padding: 44px 0 70px; }
.res-grid h2 { font-size: 1.8rem; margin-bottom: 18px; color: var(--navy-deep); }
.docs { display: grid; gap: 12px; }
.doc { display: flex; align-items: center; gap: 16px; border: 1px solid var(--line); border-radius: 8px; padding: 14px 18px; background: #fff; }
.doc .i { width: 30px; height: 30px; color: var(--navy); stroke-width: 1.4; }
.doc strong { display: block; font-size: .92rem; }
.doc small { color: var(--muted); font-size: .76rem; }
.doc .dl { margin-left: auto; font-size: .84rem; font-weight: 600; color: #7a8da1; text-decoration: underline; text-underline-offset: 3px; }
.links { list-style: none; padding: 0; margin: 0; display: grid; gap: 18px; }
.links li { display: flex; align-items: center; gap: 12px; font-size: .92rem; color: #33475d; }
.links .i { color: var(--teal); }

/* Contact */
.contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; padding: 50px 0 70px; }
.contact-list { display: grid; gap: 24px; align-content: start; }
.contact-list > div { display: flex; gap: 16px; }
.contact-list .i { width: 28px; height: 28px; color: var(--teal); stroke-width: 1.5; margin-top: 2px; }
.contact-list strong { display: block; font-size: 1.05rem; }
.contact-list span.v { font-size: 1rem; color: var(--muted); }
.contact-callout { align-self: start; background: #f1f6fa; border: 1px solid var(--line); border-radius: 12px; padding: clamp(24px, 4vw, 42px); }
.contact-callout h2 { margin: 0 0 14px; font-size: clamp(1.6rem, 3vw, 2.2rem); line-height: 1.15; }
.contact-callout p { color: var(--muted); line-height: 1.65; margin: 0 0 24px; max-width: 36ch; }
.draft-tag { display: inline-block; font-size: .66rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #8a5a00; background: #fff3d6; border-radius: 4px; padding: 2px 6px; margin-left: 8px; vertical-align: middle; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px 24px; }
.form-grid .full { grid-column: 1 / -1; }
.fld > span { display: block; font-size: .82rem; font-weight: 600; margin-bottom: 7px; color: #223850; }
.fld > span em, .fld > label > span em { color: #b42318; font-style: normal; }
.fld > label > span { display: block; font-size: .82rem; font-weight: 600; margin-bottom: 7px; color: #223850; }

/* Telephone field: searchable country list plus a separate national number */
.phone-row { display: flex; gap: 10px; align-items: stretch; max-width: 100%; min-width: 0; }
.phone-nat { flex: 1 1 auto; min-width: 0; width: 0; }
.cc { position: relative; flex: none; }
.cc-btn { height: 100%; min-height: 44px; display: inline-flex; align-items: center; gap: 6px; padding: 0 12px; border: 1px solid #8396ab; border-radius: 6px; background: #fff; color: var(--ink); font: 600 .9rem var(--sans); cursor: pointer; }
.cc-btn .iso { color: var(--navy); }
.cc-btn .i { width: .9em; height: .9em; }
.cc-pop { position: absolute; z-index: 40; top: calc(100% + 6px); left: 0; width: min(340px, 86vw); background: #fff; border: 1px solid #8396ab; border-radius: 8px; box-shadow: 0 14px 36px rgba(8,35,64,.22); padding: 8px; }
.cc-search { width: 100%; margin-bottom: 6px; }
.cc-list { list-style: none; margin: 0; padding: 0; max-height: 252px; overflow-y: auto; }
.cc-list li { display: flex; justify-content: space-between; gap: 12px; padding: 9px 10px; border-radius: 5px; font-size: .92rem; cursor: pointer; color: var(--ink); }
.cc-list li .c { color: #4a5d73; font-variant-numeric: tabular-nums; }
.cc-list li.sel { font-weight: 700; }
.cc-list li.act { background: #e3eefb; outline: 2px solid var(--navy); outline-offset: -2px; }
.cc-none { margin: 8px 10px; font-size: .9rem; color: #4a5d73; }
.hint { margin: 6px 0 0; font-size: .8rem; color: #4a5d73; }
.guide { margin: 0 0 8px; padding: 9px 12px; border-left: 4px solid var(--navy); border-radius: 4px; background: #eef4fb; color: #1d3350; font-size: .9rem; line-height: 1.45; display: flex; flex-wrap: wrap; align-items: center; gap: 2px 6px; }
.guide strong { font-weight: 700; color: var(--navy-deep); }
.guide.chosen { border-left-color: #1f7a4d; }
.flag { display: inline-flex; flex: none; align-items: center; justify-content: center; width: 22px; height: 16px; border-radius: 2px; overflow: hidden; box-shadow: 0 0 0 1px rgba(8,35,64,.28); background: #e6ecf3; vertical-align: middle; }
.flag img { display: block; width: 100%; height: 100%; object-fit: cover; }
.flag.fb { font: 700 .6rem var(--sans); color: var(--navy-deep); }
.cc-btn .dial { font-variant-numeric: tabular-nums; }
.cc-list li { align-items: center; }
.cc-list li .n { flex: 1; min-width: 0; }
.cc-list li .flag { margin-right: -2px; }
.err { margin: 6px 0 0; font-size: .84rem; font-weight: 600; color: #b42318; }
.phone-nat[aria-invalid="true"] { border-color: #b42318; box-shadow: 0 0 0 1px #b42318; }
textarea { min-height: 150px; resize: vertical; }
.draft-note { background: #fff8e6; border: 1px solid #f1d58d; color: #6a4b00; border-radius: 8px; padding: 12px 14px; font-size: .84rem; margin-bottom: 18px; }
.form-status { margin-top: 14px; font-size: .86rem; color: #0b4d6f; background: var(--cyan-soft); border-radius: 8px; padding: 12px 14px; }
.form-status[hidden] { display: none; }

/* Quote page */
.quote-head { padding: 34px 0 6px; }
.quote-head h1 { font-size: clamp(2rem, 3.4vw, 2.8rem); color: var(--navy-deep); margin-bottom: 10px; }
.quote-head p { color: #46586d; }
.stepper { list-style: none; padding: 0; margin: 26px 0 22px; display: flex; align-items: center; gap: 14px; }
.stepper li { display: flex; align-items: center; gap: 10px; font-size: .84rem; color: #5b6b7e; }
.stepper li::after { content: ""; flex: 1; min-width: 40px; height: 1px; background: var(--line); margin-left: 6px; }
.stepper li:last-child::after { display: none; }
.stepper li { flex: 1; }
.stepper li:last-child { flex: 0 0 auto; }
.stepper .n { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; background: #e9eef4; color: #4a5d73; font-weight: 600; font-size: .85rem; flex: none; }
.stepper .on .n { background: var(--cyan); color: #06243d; }
.stepper .on { color: var(--ink); font-weight: 600; }
.stepper .done .n { background: var(--navy); color: #fff; }
.step-card { border: 1px solid var(--line); border-radius: 12px; padding: 34px 36px 30px; background: #fff; box-shadow: var(--shadow); margin-bottom: 70px; }
.step-card h2 { font-family: var(--sans); font-weight: 600; font-size: 1.25rem; margin-bottom: 20px; color: var(--navy-deep); }
.qmodes { display: flex; gap: 16px; margin: 8px 0 0; flex-wrap: wrap; }
.qmode { position: relative; }
.qmode input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.qmode span { display: flex; align-items: center; gap: 12px; padding: 16px 22px; min-width: 170px; border: 1.5px solid #d3deea; border-radius: 8px; font-weight: 600; font-size: .9rem; color: #33475d; background: #fff; }
.qmode .i { width: 26px; height: 26px; color: var(--navy); }
.qmode input:checked + span { background: var(--cyan-soft); border-color: var(--cyan); color: var(--navy-deep); }
.qmode input:focus-visible + span { outline: 3px solid var(--cyan); outline-offset: 2px; }
.step-controls { display: flex; justify-content: space-between; margin-top: 30px; gap: 12px; }
.step-controls .sp { flex: 1; }
.step-card fieldset { border: 0; padding: 0; margin: 20px 0 0; }
.step-card legend { font-size: .82rem; font-weight: 600; margin-bottom: 8px; padding: 0; }
.legend em { color: #d33; font-style: normal; }
.review { display: grid; grid-template-columns: 190px 1fr; gap: 10px 20px; margin: 0 0 18px; font-size: .92rem; }
.review dt { color: var(--muted); }
.review dd { margin: 0; font-weight: 500; overflow-wrap: anywhere; }

/* Footer (white, dark logo — per the creative) */
.footer-main { background: #fff; border-top: 1px solid var(--line); }
.footer-main .wrap { display: grid; grid-template-columns: 1.5fr repeat(4, 1fr) auto; gap: 30px; padding: 44px 0 40px; align-items: start; position: relative; }
.footer-main .brand img { height: 66px; margin-bottom: 14px; }
.footer-main p.tag { font-size: .8rem; color: var(--muted); max-width: 270px; }
.social { display: flex; gap: 16px; margin-top: 16px; color: var(--navy); }
.social .i { width: 20px; height: 20px; }
.footer-main .fh { font-family: var(--sans); font-size: .84rem; font-weight: 700; margin-bottom: 12px; color: var(--navy-deep); }
.footer-main ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 8px; font-size: .8rem; color: var(--muted); }
.footer-main ul a:hover { color: var(--teal); }
.fcol-end { position: relative; }
.footer-map { display: block; margin-top: 18px; width: 120px; max-width: 100%; opacity: .55; pointer-events: none; }
.footer-bar { background: var(--navy); color: #d3e0ee; font-size: .78rem; }
.footer-bar .wrap { display: flex; justify-content: space-between; align-items: center; padding: 16px 0; gap: 20px; flex-wrap: wrap; }
.footer-bar nav { display: flex; gap: 30px; }

.net-hero { background: linear-gradient(100deg, #0b2c4d 0%, #1d5f95 36%, #9cc0de 68%, #e3eef7 100%); }
.net-hero::before { display: none; }
.net-hero .wrap { display: grid; grid-template-columns: 1.3fr 1.25fr .75fr; gap: 24px; align-items: center; padding: 20px 0; }
.net-hero .body { max-width: none; }

/* Responsive */
@media (max-width: 1060px) {
  .primary-nav { gap: 18px; }
  .footer-main .wrap { grid-template-columns: 1.4fr 1fr 1fr; }
  .network .grid { grid-template-columns: 1fr 1fr; }
  .network .poti { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; }
  .network .poti img { height: 100%; aspect-ratio: auto; order: 2; }
}
@media (max-width: 900px) {
  .net-hero { background: linear-gradient(180deg, #0b2c4d 0%, #1d5f95 55%, #7fadd3 100%); }
  .net-hero .wrap { grid-template-columns: 1fr; }
  .net-hero .map { order: 3; }
  .menu-button { display: inline-flex; }
  .primary-nav { position: absolute; left: 0; right: 0; top: 76px; background: #fff; border-bottom: 1px solid var(--line); flex-direction: column; align-items: stretch; gap: 0; padding: 8px 24px 20px; display: none; box-shadow: var(--shadow); margin: 0; }
  .primary-nav.open { display: flex; }
  .primary-nav a.link { padding: 14px 0; border-bottom: 1px solid var(--line); }
  .primary-nav a.link[aria-current="page"]::after { display: none; }
  .primary-nav .lang { align-self: flex-start; margin: 14px 0; }
  .nav-quote { justify-content: center; }
  .site-header .wrap { height: 68px; }
  .primary-nav { top: 68px; }
  .brand img { height: 46px; }
  .cards-3, .routes { grid-template-columns: 1fr 1fr; }
  .split, .split.rev, .dark-band .grid, .res-grid, .contact-grid { grid-template-columns: 1fr; gap: 30px; }
  .split.rev .media { order: 0; }
  .values { grid-template-columns: 1fr 1fr; }
  .trust ul { grid-template-columns: 1fr 1fr; }
  .mode-row { grid-template-columns: 1fr 1fr; }
  .mode-row .btn { grid-column: 1 / -1; }
  .features-row { grid-template-columns: 1fr; gap: 20px; }
  .features-row > div + div { padding-left: 0; border-left: 0; }
  .cta-band .wrap { flex-direction: column; align-items: flex-start; }
  .stepper { gap: 6px; }
  .stepper li::after { min-width: 6px; margin-left: 2px; }
  .stepper li span.t { display: none; }
  .stepper .on span.t { display: inline; white-space: nowrap; font-size: .78rem; }
  .stepper li { flex: 0 1 auto; }
  .stepper li:not(:last-child) { flex: 1 1 auto; }
}
@media (max-width: 620px) {
  .page-hero { min-height: 260px; }
  .page-hero.tall { min-height: 300px; }
  .page-hero .body { padding: 44px 0; }
  .page-hero:not(.net-hero) h1 br { display: none; }
  .wrap { width: calc(100% - 32px); }
  .hero { min-height: 0; }
  .hero .hero-body { padding: 52px 0 26px; }
  .hero::before, .page-hero::before { background: linear-gradient(180deg, rgba(8,35,64,.88), rgba(8,35,64,.7)); }
  .cards-3, .routes, .values, .form-grid, .mini-form .row { grid-template-columns: 1fr; }
  .network .grid, .network .poti { grid-template-columns: 1fr; }
  .network .poti img { order: 0; aspect-ratio: 16/9; height: auto; }
  .footer-main .wrap { grid-template-columns: 1fr 1fr; }
  .footer-main .wrap > :first-child { grid-column: 1 / -1; }
  .footer-map { display: none; }
  .step-card { padding: 22px 18px; }
  .qmode span { min-width: 0; padding: 14px; }
  .review { grid-template-columns: 1fr; gap: 2px; }
  .review dd { margin-bottom: 10px; }
  .pad { padding: 44px 0; }
  .doc { flex-wrap: wrap; }
}

/* Target sizes: standalone links and controls are at least 24px tall (WCAG 2.2 AA 2.5.8) */
.footer-main ul a, .footer-main ul .stub, .footer-bar nav a, .footer-bar nav .stub, .links li a, .links li .stub, .crumbs a { display: inline-block; padding: 4px 0; min-height: 24px; }
.footer-main ul { gap: 4px; }
.social a, .social .stub { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; margin: -6px 0; }
.more, .doc .dl { min-height: 28px; display: inline-flex; align-items: center; }
.cc-btn.bad { border-color: #b42318; box-shadow: 0 0 0 1px #b42318; }
.phone { min-width: 0; }

/* Detail pages: wider text column, smaller image (matches the approved creative) */
@media (min-width: 901px) {
  .split.detail { grid-template-columns: 1.45fr 1fr; }
  .split.detail .media img { max-height: 420px; }
}
@media (max-width: 620px) {
  .page-hero p.lead { font-size: 1.1rem; }
  .tabs a, .tabs .stub { font-size: 1.05rem; }
  .check li { font-size: 1.08rem; }
}

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

/* Services overview: proportions measured against the approved creative (desktop only) */
@media (min-width: 901px) {
  .page-hero.tall.light:not(.net-hero) { min-height: 540px; }
  .cards-3.svc { gap: 34px 28px; }
  .svc .card .ph { aspect-ratio: 1.45 / 1; }
  .svc .card .txt { grid-template-columns: 64px 1fr; gap: 8px 18px; padding: 40px 40px 52px 32px; }
  .svc .card .txt .ic .i { width: 60px; height: 60px; }
  .svc .card h2 { font-size: 1.85rem; }
  .svc .card p { font-size: 1.25rem; line-height: 1.5; }
  .svc .card .more { font-size: 1.05rem; }
  .svc .card.plain { padding: 52px 44px 56px 36px; }
  .svc .card.plain .ic .i { width: 60px; height: 60px; }
  .svc .card.plain h2 { font-size: 1.85rem; margin: 18px 0 12px; }
  .svc .card.plain p { margin-bottom: 26px; }
  .cta-img .body { padding: 190px 0; }
  .cta-img h2 { font-size: clamp(2.2rem, 3.9vw, 3.5rem); }
  .cta-img p { font-size: 1.3rem; }
}

/* ---- language menu (native <details>: works without JavaScript, by keyboard and by touch) ---- */
.lang-menu { position: relative; display: inline-block; }
.lang-menu summary { list-style: none; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--line); border-radius: 6px; padding: 7px 10px; min-height: 36px; font-size: .78rem; font-weight: 600; background: #fff; color: var(--ink); }
.lang-menu summary::-webkit-details-marker { display: none; }
.lang-menu summary .i { width: .9em; height: .9em; }
.lang-menu[open] summary, .lang-menu details[open] summary { border-color: var(--teal); }
.lang-menu ul { list-style: none; margin: 6px 0 0; padding: 6px; position: absolute; right: 0; top: 100%; z-index: 70; min-width: 150px; background: #fff; border: 1px solid var(--line); border-radius: 8px; box-shadow: 0 10px 28px rgba(8, 28, 51, .16); }
.lang-menu li a { display: flex; align-items: center; min-height: 44px; padding: 0 12px; border-radius: 6px; color: var(--ink); font-size: .9rem; font-weight: 500; }
.lang-menu li a:hover, .lang-menu li a:focus-visible { background: var(--cyan-soft); }
.footer-main .lang-menu ul { top: auto; bottom: 100%; margin: 0 0 6px; }
@media (max-width: 900px) {
  .primary-nav .lang-menu { margin: 14px 0; align-self: flex-start; }
  .primary-nav .lang-menu ul { position: static; box-shadow: none; margin-top: 8px; }
}

/* ---- enquiry forms ---- */
.hp { position: absolute; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; }
.srv-err[hidden] { display: none; }
.form-status.ok { background: #e6f6ec; color: #0a5128; border: 1px solid #b6e1c4; }
.form-status.bad { background: #fdecea; color: #8a1c12; border: 1px solid #f3b8b1; }
.form-status.ok:focus, .form-status.bad:focus { outline: 2px solid var(--navy-deep); outline-offset: 2px; }

/* ---- Georgian: Noto families, more generous line height, no wide tracking on script without capitals ---- */
html[lang="ka"] { --sans: "Noto Sans Georgian", "Inter", "Segoe UI", system-ui, sans-serif; --serif: "Noto Serif Georgian", "Source Serif 4", Georgia, serif; }
html[lang="ka"] body { line-height: 1.7; }
html[lang="ka"] h1, html[lang="ka"] h2, html[lang="ka"] h3, html[lang="ka"] h4 { line-height: 1.28; letter-spacing: 0; }
html[lang="ka"] .eyebrow, html[lang="ka"] .kick, html[lang="ka"] .draft-tag { letter-spacing: .04em; text-transform: none; }
/* Turkish and Russian words run longer than English: let long words break rather than overflow a card. */
html[lang="ru"] h1, html[lang="ru"] h2, html[lang="ru"] h3, html[lang="tr"] h1, html[lang="tr"] h2, html[lang="tr"] h3 { overflow-wrap: anywhere; hyphens: auto; }
html[lang="ru"] .eyebrow, html[lang="tr"] .eyebrow { letter-spacing: .1em; }

/* ---- longer words in Georgian, Russian and Turkish: nav stays on one line, headings scale down a little,
   and the navigation collapses into the menu button earlier than in English ---- */
.primary-nav a.link { white-space: nowrap; }
html:not([lang="en"]) .primary-nav { gap: 22px; }
html[lang="ka"] .hero h1, html[lang="ka"] .page-hero h1 { font-size: clamp(2rem, 4.2vw, 3.5rem); }
html[lang="ru"] .hero h1, html[lang="ru"] .page-hero h1 { font-size: clamp(2.1rem, 4.6vw, 3.9rem); }
html[lang="tr"] .hero h1, html[lang="tr"] .page-hero h1 { font-size: clamp(2.2rem, 4.9vw, 4.2rem); }
html[lang="ka"] .section-head h2, html[lang="ka"] .quote-band h2, html[lang="ka"] .network h2, html[lang="ka"] .split h2, html[lang="ka"] .dark-band h2, html[lang="ka"] .cta-band h2, html[lang="ka"] .cta-img h2,
html[lang="ru"] .section-head h2, html[lang="ru"] .quote-band h2, html[lang="ru"] .network h2, html[lang="ru"] .split h2, html[lang="ru"] .dark-band h2, html[lang="ru"] .cta-band h2, html[lang="ru"] .cta-img h2 { font-size: clamp(1.7rem, 3.1vw, 2.5rem); }
html[lang="ka"] .quote-head h1, html[lang="ru"] .quote-head h1 { font-size: clamp(1.8rem, 3vw, 2.4rem); }
@media (min-width: 901px) and (max-width: 1260px) {
  html:not([lang="en"]) .menu-button { display: inline-flex; }
  html:not([lang="en"]) .primary-nav { position: absolute; left: 0; right: 0; top: 92px; background: #fff; border-bottom: 1px solid var(--line); flex-direction: column; align-items: stretch; gap: 0; padding: 8px 24px 20px; display: none; box-shadow: var(--shadow); margin: 0; }
  html:not([lang="en"]) .primary-nav.open { display: flex; }
  html:not([lang="en"]) .primary-nav a.link { padding: 14px 0; border-bottom: 1px solid var(--line); }
  html:not([lang="en"]) .primary-nav a.link[aria-current="page"]::after { display: none; }
  html:not([lang="en"]) .primary-nav .lang-menu { margin: 14px 0; align-self: flex-start; }
  html:not([lang="en"]) .primary-nav .lang-menu ul { position: static; box-shadow: none; margin-top: 8px; }
  html:not([lang="en"]) .nav-quote { justify-content: center; }
}

/* ---- touch: unavailable controls explain themselves on tap, and the tab strip shows that it scrolls ---- */
.stub-note { position: fixed; left: 50%; transform: translateX(-50%); bottom: 18px; z-index: 80; max-width: min(92vw, 420px); background: #0b2c4d; color: #fff; padding: 11px 16px; border-radius: 8px; font: 500 .88rem/1.35 var(--sans); box-shadow: 0 8px 24px rgba(8, 28, 51, .35); text-align: center; }
.stub-note[hidden] { display: none; }
@media (max-width: 620px) {
  .tabs .wrap { scrollbar-width: none; padding-right: 36px; -webkit-mask-image: linear-gradient(90deg, #000 86%, transparent); mask-image: linear-gradient(90deg, #000 86%, transparent); }
  .tabs .wrap::-webkit-scrollbar { display: none; }
}

/* ---- transport-mode tiles: long words in Georgian, Russian and Turkish wrap instead of pushing the page wide ---- */
.modes-col { grid-column: 1 / -1; min-width: 0; }
.mode-row > .modes-col { grid-column: 1 / 4; }
.mode-tiles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.mode-tile { min-width: 0; }
.mode-tile span, .qmode span { overflow-wrap: anywhere; hyphens: auto; }
.mode-tile span { text-align: center; }
.poti h2, .poti h3 { overflow-wrap: anywhere; }
html[lang="ka"] .poti h2, html[lang="ka"] .poti h3 { font-size: 1.2rem; }
@media (max-width: 900px) { .mode-row > .modes-col { grid-column: 1 / -1; } }
@media (max-width: 620px) { html:not([lang="en"]) .mode-tiles { grid-template-columns: 1fr; } }

/* Buttons may wrap in Georgian, Russian and Turkish (their labels are longer); they never exceed their container. */
.btn { max-width: 100%; }
html:not([lang="en"]) .btn { white-space: normal; text-align: center; line-height: 1.25; }
.step-controls { flex-wrap: wrap; }

/* Narrow phones (360 px): long Georgian headings use a smaller minimum size and may break inside a very long word; the step label wraps. */
html[lang="ka"] h1, html[lang="ka"] h2, html[lang="ka"] h3 { overflow-wrap: anywhere; hyphens: auto; }
html[lang="ka"] .hero h1, html[lang="ka"] .page-hero h1 { font-size: clamp(1.65rem, 4.2vw, 3.5rem); }
@media (max-width: 620px) {
  .stepper li { min-width: 0; }
  .stepper .on span.t { white-space: normal; overflow-wrap: anywhere; min-width: 0; }
}

.map img, .footer-map { height: auto; }

/* ---- legal pages: readable line length and rhythm; text is the owner's ---- */
.legal { max-width: 780px; }
.legal h2 { font-size: 1.35rem; margin: 30px 0 10px; color: var(--navy-deep); }
.legal p, .legal li { font-size: 1rem; line-height: 1.7; color: #2b3f55; }
.legal ul { padding-left: 1.3em; margin: 0 0 14px; }
.legal-updated { color: #4a5d73; font-size: .9rem; }

/* ---- sharing-safe review build: labelled placeholders where permission to show an image is not confirmed ---- */
.img-ph { position: relative; display: flex; align-items: center; justify-content: center; width: 100%; min-height: 120px; aspect-ratio: 3 / 2; overflow: hidden; border: 1.5px dashed #8ea5bd; color: #2f4660;
  background-color: #e4edf6; background-image: linear-gradient(135deg, rgba(11,44,77,.07) 25%, transparent 25%, transparent 50%, rgba(11,44,77,.07) 50%, rgba(11,44,77,.07) 75%, transparent 75%); background-size: 26px 26px; }
.img-ph .ph-lbl { display: inline-flex; align-items: center; gap: 8px; max-width: 90%; padding: 8px 12px; border-radius: 6px; background: rgba(255,255,255,.94); color: #2f4660; font: 600 .78rem/1.3 var(--sans); text-align: center; box-shadow: 0 1px 4px rgba(8,28,51,.12); }
.img-ph .ph-lbl .i { width: 18px; height: 18px; flex: none; }
.img-ph.dark { border: 0; background-color: #0f3558; background-image: linear-gradient(135deg, rgba(255,255,255,.05) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.05) 50%, rgba(255,255,255,.05) 75%, transparent 75%), linear-gradient(120deg, #0b2c4d, #1d5f95 85%); }
.ph-flag { position: absolute; z-index: 1; top: 16px; right: 18px; display: inline-flex; align-items: center; gap: 8px; max-width: calc(100% - 36px); padding: 6px 10px; border-radius: 6px; background: rgba(255,255,255,.94); color: #2f4660; font: 600 .75rem/1.3 var(--sans); box-shadow: 0 1px 4px rgba(8,28,51,.2); }
.ph-flag .i { width: 16px; height: 16px; flex: none; }
.hero > .img-ph.bg, .page-hero > .img-ph.bg, .quote-band > .img-ph.bg, .cta-img > .img-ph.bg { position: absolute; inset: 0; width: 100%; height: 100%; aspect-ratio: auto; z-index: -2; }
.card .ph .img-ph { height: 100%; aspect-ratio: auto; border-radius: 0; }
.poti .img-ph { aspect-ratio: 16 / 9; border-radius: 0; }
.media .img-ph { border-radius: 10px; }
.routes .img-ph { aspect-ratio: 3 / 2; border-radius: 0; }
.map .img-ph.map-ph { aspect-ratio: 900 / 404; background-color: #dfe9f3; border-radius: 10px; }
.dark-band .map .img-ph.map-ph { background-color: #0f3558; border-color: #5f7fa3; color: #fff; }
@media (max-width: 900px) { .network .poti .img-ph { height: auto; aspect-ratio: 16 / 9; } }
.brand-ph { display: inline-flex; flex-direction: column; justify-content: center; line-height: 1; height: 56px; padding: 0 10px; border: 1.5px dashed #8ea5bd; border-radius: 8px; color: #0b2c4d; background: #fff; }
.brand-ph b { font: 800 1.35rem/1 var(--sans); letter-spacing: .02em; } .brand-ph span { font: 700 .62rem/1.2 var(--sans); letter-spacing: .22em; }
.brand-ph small { font: 600 .56rem/1.2 var(--sans); color: #4a5d73; margin-top: 3px; }
@media (max-width: 900px) { .brand-ph { height: 42px; } .brand-ph b { font-size: 1.05rem; } }
.footer-main .brand-ph { margin-bottom: 14px; height: 52px; }

/* ======================================================================================================
   22 October 2026 owner changes: white seal on a navy header, resources, legal pages, cookie notice, WhatsApp.
   ====================================================================================================== */

/* ---- header: a short navy bar with the white seal alone hanging slightly below it ----
   The seal keeps its size (100 / 72 / 64 px) and design; the bar behind it is much shorter (80 / 60 / 56 px), so the seal overhangs
   the bar by --seal-over. The seal sits on its own navy disc so the overhang reads on any background. The bar height never changes,
   so nothing moves when the bar turns from translucent to solid. */
:root { --header-h: 80px; --seal: 100px; --seal-top: 4px; --seal-over: calc(var(--seal) + var(--seal-top) - var(--header-h)); }
.site-header { background: transparent; border-bottom: 0; isolation: isolate; }
.site-header::before, .site-header::after { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; transition: opacity .28s ease; }
/* solid layer: the readable navy bar with a thin light edge and a soft shadow */
.site-header::before { background: var(--navy); box-shadow: inset 0 -1px 0 rgba(255, 255, 255, .16), 0 3px 12px rgba(8, 28, 51, .22); opacity: 1; }
/* translucent layer: navy at the top fading out at the lower edge, so the bar blends into an image hero */
.site-header::after { background: linear-gradient(to bottom, rgba(11, 44, 77, .94) 0%, rgba(11, 44, 77, .88) 52%, rgba(11, 44, 77, 0) 100%); opacity: 0; }
.site-header .wrap { height: var(--header-h); position: relative; }
.brand-seal { flex: none; align-self: flex-start; margin-top: var(--seal-top); position: relative; z-index: 3; width: var(--seal); height: var(--seal); border-radius: 50%; background: var(--navy); box-shadow: 0 4px 14px rgba(5, 24, 44, .38); }
.brand-seal .seal { display: block; width: var(--seal); height: var(--seal); max-width: none; }
.seal-ph { display: inline-flex; align-items: center; justify-content: center; width: var(--seal); height: var(--seal); border: 2px dashed rgba(255, 255, 255, .6); border-radius: 50%; color: #fff; }
.seal-ph b { font: 800 1.5rem/1 var(--sans); letter-spacing: .04em; }
.primary-nav a.link { color: #dbe7f3; padding: 0; height: var(--header-h); display: inline-flex; align-items: center; }
.primary-nav a.link:hover { color: #fff; }
.primary-nav a.link[aria-current="page"] { color: #fff; }
.primary-nav a.link[aria-current="page"]::after { bottom: calc(50% - 19px); background: var(--cyan); }
.site-header .lang-menu summary { background: transparent; color: #fff; border-color: rgba(255, 255, 255, .5); }
.site-header .lang-menu details[open] summary { border-color: var(--cyan); }
.menu-button { background: transparent; color: #fff; border-color: rgba(255, 255, 255, .55); align-self: center; }
.site-header :focus-visible { outline-color: #fff; box-shadow: 0 0 0 5px rgba(47, 216, 242, .75); }
.site-header .lang-menu ul :focus-visible { outline-color: #0b3d91; box-shadow: none; }
/* the menu panel and the language list sit above the seal's overhang */
.primary-nav { z-index: 2; }
/* pages that open with an image hero: the bar overlays the top of the hero (translucent) and turns solid once the page scrolls,
   when the menu is open, or without JavaScript. The hero keeps the space under the bar, so nothing shifts. */
body.hero-top .site-header { margin-bottom: calc(var(--header-h) * -1); }
body.hero-top .site-header::before { opacity: 0; }
body.hero-top .site-header::after { opacity: 1; }
body.hero-top .site-header.is-solid::before { opacity: 1; }
body.hero-top .site-header.is-solid::after { opacity: 0; }
body.hero-top main > .hero, body.hero-top main > .page-hero { padding-top: var(--header-h); }
/* every other page (light backgrounds, breadcrumbs, forms): solid navy bar with its edge, and room for the seal's overhang */
body:not(.hero-top) main > .crumbs:first-child { padding-top: var(--seal-over); }
body:not(.hero-top) main > :first-child:not(.crumbs) { margin-top: var(--seal-over); }
@media (max-width: 900px) {
  :root { --header-h: 60px; --seal: 72px; }
  .primary-nav { top: var(--header-h); padding-top: calc(var(--seal-over) + 10px); }
  .primary-nav a.link { color: #223850; height: auto; padding: 14px 0; display: block; }
  .primary-nav a.link:hover, .primary-nav a.link[aria-current="page"] { color: var(--ink); }
  .site-header .primary-nav .lang-menu summary { background: #fff; color: var(--ink); border-color: var(--line); }
  .site-header .primary-nav :focus-visible { outline-color: #0b3d91; box-shadow: 0 0 0 4px rgba(11, 61, 145, .25); }
}
@media (max-width: 380px) { :root { --header-h: 56px; --seal: 64px; --seal-top: 3px; } }
@media (min-width: 901px) and (max-width: 1260px) {
  html:not([lang="en"]) .primary-nav { top: var(--header-h); padding-top: calc(var(--seal-over) + 10px); }
  html:not([lang="en"]) .primary-nav a.link { color: #223850; height: auto; padding: 14px 0; display: block; }
  html:not([lang="en"]) .primary-nav a.link:hover, html:not([lang="en"]) .primary-nav a.link[aria-current="page"] { color: var(--ink); }
  html:not([lang="en"]) .site-header .primary-nav .lang-menu summary { background: #fff; color: var(--ink); border-color: var(--line); }
  html:not([lang="en"]) .site-header .primary-nav :focus-visible { outline-color: #0b3d91; box-shadow: 0 0 0 4px rgba(11, 61, 145, .25); }
}

/* ---- quote band without the feature row: keep the band's bottom padding ---- */
.quote-band .wrap { padding-bottom: 44px; }

/* ---- footer: registration number, cookie-notice button, language panel that always stays on screen ---- */
.reg-no { margin-left: 14px; opacity: .9; }
.reg-no::before { content: "·"; margin-right: 14px; }
@media (max-width: 620px) {
  .reg-no { display: block; margin: 6px 0 0; white-space: nowrap; font-size: clamp(.64rem, 3.15vw, .78rem); }
  .reg-no::before { content: none; }
}
.linklike { appearance: none; background: none; border: 0; padding: 4px 0; margin: 0; font: inherit; color: inherit; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; min-height: 24px; }
.footer-bar nav { flex-wrap: wrap; align-items: center; }
.lang-menu ul { max-width: calc(100vw - 16px); max-height: calc(100vh - 16px); overflow-y: auto; overscroll-behavior: contain; transform: translateX(var(--lm-shift, 0px)); }
.lang-menu.flip ul { top: auto; bottom: 100%; margin: 0 0 6px; }
.footer-main .lang-menu.flip ul { top: 100%; bottom: auto; margin: 6px 0 0; }
@media (max-width: 620px) {
  /* The footer menu sits at the left on a phone: anchor the panel to its left edge so it cannot run off the screen. */
  .footer-main .lang-menu ul { right: auto; left: 0; }
}

/* ---- resources ---- */
.res-grid.one { grid-template-columns: minmax(0, 880px); }
.res-links { gap: 22px; }
.res-links li { align-items: flex-start; }
.res-links li .i { margin-top: 4px; }
.res-links li > div { display: grid; gap: 4px; min-width: 0; }
.res-links li a { font-weight: 600; color: var(--navy); font-size: 1.02rem; text-decoration: underline; text-underline-offset: 3px; }
.res-desc { color: #33475d; font-size: .92rem; line-height: 1.5; max-width: 62ch; }
.ext-tag { display: inline-flex; align-items: center; gap: 6px; width: fit-content; font-size: .74rem; font-weight: 600; color: #35546f; background: var(--soft); border: 1px solid var(--line); border-radius: 999px; padding: 3px 10px; }
.ext-tag .i { width: .95em; height: .95em; }
.checklist-wrap { background: var(--soft); border-top: 1px solid var(--line); }
.checklist { max-width: 880px; }
.checklist h2 { font-size: 1.8rem; color: var(--navy-deep); margin-bottom: 12px; }
.checklist > p { color: #33475d; margin-bottom: 18px; max-width: 62ch; }
.checklist .check li { font-size: 1rem; align-items: flex-start; }
.checklist .check .i { margin-top: 3px; }
.checklist .closing { margin-top: 18px; font-weight: 600; color: var(--navy); }

/* ---- legal pages and form privacy line ---- */
.legal-draft { margin-bottom: 26px; }
.legal-draft ul { margin: 6px 0 0; padding-left: 1.2em; }
.legal-open-title { margin-top: 10px; font-weight: 700; }
.legal-sources { word-break: break-word; }
.legal-sources a, .legal a { text-decoration: underline; text-underline-offset: 3px; color: var(--teal); }
.form-privacy { margin: 16px 0 0; font-size: .84rem; color: #4a5d73; }
.form-privacy a { text-decoration: underline; text-underline-offset: 3px; color: var(--teal); font-weight: 600; }
.attachment-field { margin-top: 16px; }
.attachment-field input[type=file] { display: block; width: 100%; margin-top: 8px; padding: 11px 12px; border: 1px solid #cfd9e5; border-radius: 6px; background: #fff; color: var(--ink); font: 400 .88rem var(--sans); }
.attachment-field input[type=file]::file-selector-button { margin-right: 12px; padding: 7px 12px; border: 1px solid #b7c9d8; border-radius: 4px; background: #f0f6f8; color: var(--navy); font: 600 .82rem var(--sans); cursor: pointer; }
.attachment-field small { display: block; margin-top: 5px; color: #4a5d73; }

/* ---- cookie notice (essential storage only: it informs, there is no choice to make) ---- */
.cookie-notice { position: fixed; left: 0; right: 0; bottom: 0; z-index: 90; background: #fff; border-top: 3px solid var(--navy); box-shadow: 0 -8px 26px rgba(8, 28, 51, .18); padding: 14px 0 calc(14px + env(safe-area-inset-bottom)); }
.cookie-notice .wrap { display: flex; align-items: center; gap: 22px; justify-content: space-between; }
.cookie-notice .cn-text { font-size: .9rem; line-height: 1.5; color: #1d3249; max-width: 980px; }
.cookie-notice .cn-text a { text-decoration: underline; text-underline-offset: 3px; color: var(--teal); font-weight: 600; }
.cookie-notice .btn { flex: none; padding: 12px 20px; }
body.has-cookie-notice { padding-bottom: var(--cookie-h, 0px); }
@media (max-width: 620px) {
  .cookie-notice { padding-top: 10px; padding-bottom: calc(10px + env(safe-area-inset-bottom)); }
  .cookie-notice .wrap { flex-direction: column; align-items: stretch; gap: 8px; }
  .cookie-notice .cn-text { font-size: .84rem; line-height: 1.4; }
  .cookie-notice .btn { width: 100%; min-height: 44px; padding: 10px 16px; }
}
@media print { .cookie-notice, .wa-float { display: none !important; } }

/* ---- WhatsApp click-to-chat: bottom-right on every screen, clear of safe areas and of the cookie notice ---- */
.wa-float { position: fixed; z-index: 85; right: calc(16px + env(safe-area-inset-right)); bottom: calc(16px + env(safe-area-inset-bottom) + var(--cookie-h, 0px)); width: 56px; height: 56px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: #0f7a42; color: #fff; border: 2px solid #fff; box-shadow: 0 6px 18px rgba(8, 28, 51, .35); }
.wa-float .i { width: 30px; height: 30px; stroke-width: 1.5; }
.wa-float:hover { background: #0c6637; }
.wa-float:focus-visible { outline: 3px solid #0b3d91; outline-offset: 3px; }
body.has-wa .footer-bar .wrap { padding-bottom: 84px; }
@media (max-width: 620px) {
  /* While someone is typing in a form on a phone the button steps aside, so it never covers a field or a button. */
  body.has-wa:has(form :focus) .wa-float { opacity: 0; pointer-events: none; }
}

/* ---- Turkish home heading on phones: the desktop line break is dropped and the type scales with the screen, so the words wrap
   as "Birbirine Bağlı Bir / Dünya İçin Küresel / Lojistik" instead of leaving "Dünya" alone on a line ---- */
@media (max-width: 620px) {
  html[lang="tr"] .hero h1 br { display: none; }
  html[lang="tr"] .hero h1 { font-size: clamp(1.5rem, 8.2vw, 2.2rem); }
}
