@font-face{font-family:'Inter';font-style:normal;font-weight:100 900;font-display:swap;src:url('/frontend/fonts/inter.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}

@font-face{font-family:'Manrope';font-style:normal;font-weight:200 800;font-display:swap;src:url('/frontend/fonts/manrope.woff2') format('woff2');}

:root {
    --bg: #f5f6f7;
    --bg-grid: rgba(20, 30, 40, 0.035);
    --panel: #ffffff;
    --ink: #16232e;
    --ink-soft: #4c5b68;
    --steel: #1e4976;
    --slate: #5b6670;
    --accent: #156896;
    --accent-soft: #e1f1fa;
    --line: #c9cfd4;
    --line-strong: #aeb6bc;
    --ok: #2f8f5b;
    color-scheme: light;
  }

@media (prefers-color-scheme: dark) {
    :root {
      --bg: #0e161e;
      --bg-grid: rgba(255, 255, 255, 0.035);
      --panel: #16212b;
      --ink: #e7ecf0;
      --ink-soft: #a9b4bd;
      --steel: #7fb2ea;
      --slate: #8a97a3;
      --accent: #42b3f0;
      --accent-soft: #192a34;
      --line: #29343e;
      --line-strong: #3a4750;
      --ok: #52c98a;
      color-scheme: dark;
    }
  }

:root[data-theme="dark"] {
    --bg: #0e161e; --bg-grid: rgba(255, 255, 255, 0.035); --panel: #16212b; --ink: #e7ecf0;
    --ink-soft: #a9b4bd; --steel: #7fb2ea; --slate: #8a97a3; --accent: #42b3f0;
    --accent-soft: #192a34; --line: #29343e; --line-strong: #3a4750; --ok: #52c98a;
    color-scheme: dark;
  }

:root[data-theme="light"] {
    --bg: #f5f6f7; --bg-grid: rgba(20, 30, 40, 0.035); --panel: #ffffff; --ink: #16232e;
    --ink-soft: #4c5b68; --steel: #1e4976; --slate: #5b6670; --accent: #156896;
    --accent-soft: #e1f1fa; --line: #c9cfd4; --line-strong: #aeb6bc; --ok: #2f8f5b;
    color-scheme: light;
  }

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

html, body {
    margin: 0; padding: 0;
    background: var(--bg);
    color: var(--ink);
    font-family: "Inter", ui-sans-serif, system-ui, "Segoe UI", sans-serif;
  }

body {
    background-image:
      linear-gradient(var(--bg-grid) 1px, transparent 1px),
      linear-gradient(90deg, var(--bg-grid) 1px, transparent 1px);
    background-size: 34px 34px;
    min-height: 100vh;
  }

a { color: inherit; }

.wrap { max-width: 1280px; margin: 0 auto; padding: 0 clamp(16px, 5vw, 28px); }

/* ---------- Nav & Hero band ----------
     Fixed light cover band (badge/wordmark nav + split hero), independent of
     the site's dark/light token system below — a deliberate, constant "cover
     page" treatment, per reference. */

:root {
    --cover-bg: #efece5;
    --cover-line: #cdc4b2;
    --cover-ink: #0d1015;
    --cover-grey: #62748e;
    --cover-badge: #0d1015;
    --cover-blue: #156896;
    --cover-blue-dark: #0f5276;
  }

.site-nav {
    position: sticky; top: 0; z-index: 20;
    background: var(--cover-bg);
    border-bottom: 1px solid var(--cover-line);
  }

.nav-row {
    display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 22px;
    padding: 14px clamp(16px, 5vw, 28px);
    max-width: 1320px; margin: 0 auto;
  }

.logo { display: flex; align-items: center; text-decoration: none; }

.logo-img { display: block; height: 40px; width: auto; }

.nav-links {
    display: flex; align-items: center; justify-content: center; gap: 30px;
    list-style: none; padding: 0 32px; margin: 0;
    border-left: 1px solid var(--cover-line);
    border-right: 1px solid var(--cover-line);
  }

.nav-links a {
    text-decoration: none; font-size: 12.5px; font-weight: 700;
    letter-spacing: 0.08em; text-transform: uppercase; color: var(--cover-grey);
    padding: 4px 2px; border-bottom: 2px solid transparent;
  }

.nav-links a:hover, .nav-links a:focus-visible { color: var(--cover-ink); border-bottom-color: var(--cover-blue); outline: none; }

.nav-right { display: flex; align-items: center; gap: 22px; }

.nav-phone {
    text-decoration: none; font-size: 12.5px; font-weight: 700;
    letter-spacing: 0.08em; text-transform: uppercase; color: var(--cover-grey);
    white-space: nowrap;
  }

.nav-phone:hover, .nav-phone:focus-visible { color: var(--cover-ink); outline: none; }

.nav-cta {
    display: inline-flex; align-items: center; gap: 8px;
    background: var(--cover-blue); color: #fff; text-decoration: none;
    font-size: 12.5px; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase;
    padding: 11px 18px; border-radius: 3px; white-space: nowrap;
  }

.nav-cta:hover, .nav-cta:focus-visible { background: var(--cover-blue-dark); outline: none; }

.nav-burger {
    display: none; flex-direction: column; justify-content: center; gap: 5px;
    width: 34px; height: 34px; flex: none; padding: 0; background: none; border: none; cursor: pointer;
  }

.nav-burger span { display: block; width: 100%; height: 2px; background: var(--cover-ink); border-radius: 2px; transition: transform 0.2s ease, opacity 0.2s ease; }

.nav-burger.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }

.nav-burger.open span:nth-child(2) { opacity: 0; }

.nav-burger.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.mobile-menu {
    display: none; flex-direction: column; gap: 2px;
    background: var(--cover-bg); border-top: 1px solid var(--cover-line);
    padding: 8px clamp(16px, 5vw, 28px) 18px;
  }

.mobile-menu.open { display: flex; }

.mobile-menu a {
    padding: 13px 4px; text-decoration: none; font-size: 14px; font-weight: 700;
    letter-spacing: 0.04em; text-transform: uppercase; color: var(--cover-grey);
    border-bottom: 1px solid var(--cover-line);
  }

.mobile-menu a:hover, .mobile-menu a:focus-visible { color: var(--cover-ink); outline: none; }

.mobile-menu-cta {
    margin-top: 8px; text-align: center; background: var(--cover-blue); color: #fff !important;
    border-radius: 3px; border-bottom: none !important;
  }

@media (max-width: 900px) {
    .nav-phone { display: none; }
  }

@media (max-width: 640px) {
    .nav-links { display: none; }
    .nav-cta { display: none; }
    .nav-burger { display: flex; }
  }

@media (min-width: 641px) {
    .mobile-menu { display: none !important; }
  }

/* ---------- Hero ---------- */

.hero-video {
    position: absolute; inset: 0; width: 100%; height: 100%;
    object-fit: cover; z-index: 0;
  }

.hero-scrim {
    position: absolute; inset: 0; z-index: 1;
    background: linear-gradient(100deg, rgba(6, 8, 11, 0.97) 0%, rgba(6, 8, 11, 0.9) 32%, rgba(6, 8, 11, 0.55) 68%, rgba(6, 8, 11, 0.4) 100%);
  }

.hero {
    position: relative; z-index: 2;
    padding: clamp(64px, 11vw, 120px) 0 clamp(64px, 11vw, 120px);
    min-height: clamp(420px, 62vh, 640px);
    display: flex; align-items: center;
  }

.hero-copy { max-width: 50ch; }

.eyebrow {
    margin: 0 0 18px; font-family: ui-monospace, "Cascadia Mono", "Consolas", "Roboto Mono", monospace;
    font-size: 13px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--cover-grey);
  }

h1 {
    margin: 0 0 24px; font-size: clamp(48px, 7vw, 92px); line-height: 0.97;
    font-weight: 800; letter-spacing: -0.02em;
    text-wrap: balance; color: var(--cover-ink);
  }

h1 em { font-style: normal; color: var(--cover-blue); white-space: nowrap; }

.lede {
    max-width: 46ch; margin: 0 0 30px; font-size: clamp(18px, 2vw, 21px);
    line-height: 1.6; color: var(--cover-grey);
  }

.hero-actions { display: flex; flex-wrap: wrap; gap: 14px; }

.btn {
    display: inline-flex; align-items: center; gap: 8px;
    text-decoration: none; font-size: 14px; font-weight: 800;
    letter-spacing: 0.06em; text-transform: uppercase; padding: 16px 26px; border-radius: 3px;
  }

.btn-primary { background: var(--cover-badge); color: #fff; }

.btn-primary:hover, .btn-primary:focus-visible { background: var(--cover-blue); outline: none; }

.btn-ghost { color: var(--cover-ink); padding-left: 4px; padding-right: 4px; border-bottom: 2px solid var(--cover-ink); border-radius: 0; }

.btn-ghost:hover, .btn-ghost:focus-visible { color: var(--cover-blue); border-color: var(--cover-blue); outline: none; }

@media (prefers-reduced-motion: reduce) {
    .hero-video { display: none; }
  }

/* ---------- Sections ---------- */

section.block { padding: clamp(40px, 7vw, 64px) 0; border-top: 1px solid var(--line); }

.promo-banner { border-top: 1px solid var(--line); }

.promo-banner img { display: block; width: 100%; height: clamp(160px, 28vw, 340px); object-fit: cover; }

.block-head { margin-bottom: 28px; max-width: 62ch; }

.kicker {
    margin: 0 0 8px; font-family: ui-monospace, "Cascadia Mono", "Consolas", "Roboto Mono", monospace;
    font-size: 12px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--slate);
  }

h2.block-title {
    margin: 0 0 10px; font-size: clamp(26px, 4.2vw, 38px); font-weight: 800;
    letter-spacing: -0.01em; color: var(--ink); text-wrap: balance;
  }

.block-sub { margin: 0; font-size: 17px; line-height: 1.6; color: var(--ink-soft); }

/* ---------- Panels (shared with coming-soon page) ---------- */

.panel {
    background: var(--panel); border: 1px solid var(--line);
    clip-path: polygon(14px 0, 100% 0, 100% calc(100% - 14px), calc(100% - 14px) 100%, 0 100%, 0 14px);
    padding: clamp(20px, 4vw, 28px);
  }

/* ---------- About ---------- */

.about-grid {
    display: grid; grid-template-columns: 1fr 1fr; gap: clamp(24px, 5vw, 56px); align-items: start;
  }

.about-left .kicker { margin-bottom: 8px; }

.about-left h2.block-title { margin-bottom: 22px; }

.about-image {
    aspect-ratio: 4 / 3; border-radius: 6px; overflow: hidden;
    border: 1px solid var(--line-strong);
  }

.about-photo { display: block; width: 100%; height: 100%; object-fit: cover; }

.about-right { padding-top: clamp(0px, 2vw, 8px); }

.about-right p { margin: 0 0 16px; font-size: 17px; line-height: 1.7; color: var(--ink-soft); }

.about-right p:last-of-type { margin-bottom: 26px; }

.about-facts { display: flex; flex-direction: column; gap: 14px; }

.fact { display: flex; flex-direction: column; gap: 4px; }

.fact .label {
    font-family: ui-monospace, "Cascadia Mono", "Consolas", "Roboto Mono", monospace;
    font-size: 10.5px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--slate);
  }

.fact .value { font-size: 16px; font-weight: 600; color: var(--ink); }

@media (max-width: 760px) { .about-grid { grid-template-columns: 1fr; } }

/* ---------- Projects ---------- */

.projects-content { padding: clamp(40px, 7vw, 64px) 0; }

.projects-bar { background: #0d1015; }

.projects-bar-row {
    display: flex; align-items: center; gap: 20px; flex-wrap: wrap;
    padding: 22px clamp(16px, 5vw, 28px);
    max-width: 1280px; margin: 0 auto;
  }

.projects-bar-icon {
    width: 34px; height: 34px; flex: none; border-radius: 50%;
    background: rgba(255, 255, 255, 0.1);
    display: flex; align-items: center; justify-content: center;
  }

.projects-bar-text .eyebrow { margin: 0 0 3px; color: rgba(226, 230, 234, 0.7); }

.projects-bar-text strong {
    font-family: "Manrope", ui-sans-serif, system-ui, sans-serif;
    font-size: clamp(17px, 2.4vw, 21px); font-weight: 800; color: #f5f6f7; letter-spacing: -0.01em;
  }

.projects-bar-cta {
    margin-left: auto; display: inline-flex; align-items: center; gap: 8px;
    background: #156896; color: #fff; text-decoration: none;
    font-size: 13px; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase;
    padding: 14px 22px; border-radius: 3px; white-space: nowrap;
  }

.projects-bar-cta:hover, .projects-bar-cta:focus-visible { background: #0f5276; outline: none; }

.projects-split {
    display: grid; grid-template-columns: 30% 1fr; gap: clamp(24px, 5vw, 56px); align-items: start;
  }

.projects-intro .block-title { margin-bottom: 14px; }

.projects-intro .block-sub { margin-bottom: 22px; }

.projects-link {
    display: inline-flex; align-items: center; gap: 8px; text-decoration: none;
    font-size: 13px; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase;
    color: var(--ink); border-bottom: 2px solid var(--ink); padding-bottom: 3px;
  }

.projects-link:hover, .projects-link:focus-visible { color: var(--accent); border-color: var(--accent); outline: none; }

/* ---------- Why Choose Us ---------- */

.why-split { display: grid; grid-template-columns: 1fr 1fr; }

.why-left, .why-right {
    padding: clamp(40px, 6vw, 72px); display: flex; flex-direction: column; justify-content: center;
  }

.why-left {
    background-image: linear-gradient(rgba(21, 104, 150, 0.7), rgba(21, 104, 150, 0.7)), url('/frontend/images/about.jpeg');
    background-size: cover; background-position: center; gap: 22px;
  }

.why-left .eyebrow { margin: 0; color: rgba(255, 255, 255, 0.75); }

.why-left h2 {
    margin: 0; font-size: clamp(30px, 4.5vw, 46px); line-height: 1.06;
    color: #fff; text-wrap: balance;
  }

.why-sub { margin: 0; max-width: 40ch; font-size: 16px; line-height: 1.6; color: rgba(255, 255, 255, 0.85); }

.why-cta {
    align-self: flex-start; display: inline-flex; align-items: center; gap: 8px;
    background: #fff; color: #0d1015; text-decoration: none;
    font-size: 13px; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase;
    padding: 15px 26px; border-radius: 3px;
  }

.why-cta:hover, .why-cta:focus-visible { background: #dbe3ea; outline: none; }

.why-right { background: #0d1015; gap: 0; }

.why-right .eyebrow { margin: 0 0 18px; color: rgba(226, 230, 234, 0.55); }

.why-list { border-top: 1px solid rgba(255, 255, 255, 0.14); }

.why-row {
    display: flex; align-items: flex-start; justify-content: space-between; gap: 16px;
    padding: 18px 0; border-bottom: 1px solid rgba(255, 255, 255, 0.14);
  }

.why-row h3 { margin: 0 0 4px; font-size: 16.5px; color: #f5f6f7; }

.why-row p { margin: 0; font-size: 13.5px; line-height: 1.5; color: rgba(226, 230, 234, 0.65); }

.why-check {
    flex: none; width: 22px; height: 22px; border-radius: 50%; margin-top: 2px;
    background: rgba(82, 201, 138, 0.16); color: #52c98a;
    display: flex; align-items: center; justify-content: center; font-size: 12px;
  }

.why-note {
    display: flex; align-items: center; gap: 10px; margin-top: 20px;
    font-size: 13px; color: rgba(226, 230, 234, 0.7);
  }

.why-note .why-check { background: transparent; width: auto; height: auto; }

@media (max-width: 860px) { .why-split { grid-template-columns: 1fr; } }

/* ---------- Testimonials ---------- */

.testimonial-carousel { display: flex; flex-direction: column; gap: 20px; }

.testimonial-track {
    display: grid; grid-auto-flow: column; grid-auto-columns: minmax(280px, 1fr);
    gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory;
    scrollbar-width: none; padding-bottom: 2px;
  }

.testimonial-track::-webkit-scrollbar { display: none; }

.testimonial-card {
    scroll-snap-align: start;
    background: var(--panel); border: 1px solid var(--line);
    clip-path: polygon(14px 0, 100% 0, 100% calc(100% - 14px), calc(100% - 14px) 100%, 0 100%, 0 14px);
    padding: 28px clamp(20px, 3vw, 28px); display: flex; flex-direction: column; gap: 14px;
  }

.quote-mark {
    font-family: "Manrope", ui-sans-serif, system-ui, sans-serif;
    font-size: 40px; font-weight: 800; line-height: 1; color: var(--accent-soft);
  }

.testimonial-text { margin: 0; font-size: 15.5px; line-height: 1.6; color: var(--ink-soft); flex: 1; }

.testimonial-stars { font-size: 13px; letter-spacing: 0.1em; color: var(--line-strong); }

.testimonial-who { display: flex; flex-direction: column; gap: 2px; border-top: 1px solid var(--line); padding-top: 12px; }

.who-name { font-size: 13.5px; font-weight: 700; color: var(--ink); }

.who-role {
    font-family: ui-monospace, "Cascadia Mono", "Consolas", "Roboto Mono", monospace;
    font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--slate);
  }

.car-btn {
    width: 38px; height: 38px; flex: none; border-radius: 50%;
    border: 1px solid var(--line-strong); background: var(--panel); color: var(--ink);
    font-size: 15px; cursor: pointer;
  }

.car-btn:hover, .car-btn:focus-visible { border-color: var(--accent); color: var(--accent); outline: none; }

.carousel-dots { display: flex; align-items: center; gap: 8px; }

.carousel-dots span {
    width: 7px; height: 7px; border-radius: 50%; background: var(--line-strong);
    transition: background 0.15s ease, transform 0.15s ease;
  }

.carousel-dots span.active { background: var(--accent); transform: scale(1.3); }

@media (max-width: 700px) { .testimonial-track { grid-auto-columns: minmax(240px, 88%); } }

/* ---------- Client Logos ---------- */

.client-logos { display: grid; grid-template-columns: repeat(6, 1fr); gap: 16px; }

.client-logo-tile {
    aspect-ratio: 2 / 1; border: 1px solid var(--line); border-radius: 4px;
    display: flex; align-items: center; justify-content: center; text-align: center; padding: 8px;
    font-family: "Manrope", ui-sans-serif, system-ui, sans-serif;
    font-size: 13px; font-weight: 800; letter-spacing: 0.04em; text-transform: uppercase;
    color: var(--slate);
  }

@media (max-width: 760px) { .client-logos { grid-template-columns: repeat(3, 1fr); } }

@media (max-width: 480px) { .client-logos { grid-template-columns: repeat(2, 1fr); } }

/* ---------- Contact ---------- */

.contact-split { display: grid; grid-template-columns: 1fr 1fr; }

.contact-left, .contact-right {
    padding: clamp(40px, 6vw, 72px); display: flex; flex-direction: column; justify-content: center;
  }

.contact-left {
    background-image: linear-gradient(rgba(21, 104, 150, 0.7), rgba(21, 104, 150, 0.7)), url('/frontend/images/home.jpeg');
    background-size: cover; background-position: center; gap: 18px;
  }

.contact-wordmark {
    margin: 0 0 8px; font-size: 13px; font-weight: 800; letter-spacing: 0.06em; color: #fff;
  }

.contact-wordmark span { color: rgba(255, 255, 255, 0.7); font-weight: 700; }

.contact-left .eyebrow { margin: 0; color: rgba(255, 255, 255, 0.85); }

.contact-left h2 {
    margin: 0; font-size: clamp(32px, 4.5vw, 48px); line-height: 1.05; color: #fff; text-wrap: balance;
  }

.contact-checklist {
    list-style: none; margin: 8px 0 0; padding: 0; border-top: 1px solid rgba(255, 255, 255, 0.3);
    padding-top: 18px; display: flex; flex-direction: column; gap: 12px;
  }

.contact-checklist li {
    display: flex; align-items: center; gap: 12px; font-size: 15px; color: rgba(255, 255, 255, 0.9);
  }

.contact-direct { display: flex; flex-direction: column; gap: 4px; margin-top: 10px; }

.contact-direct a {
    text-decoration: none; font-size: 14.5px; font-weight: 600; color: #fff;
  }

.contact-direct a:hover, .contact-direct a:focus-visible { text-decoration: underline; outline: none; }

.contact-right { background: var(--panel); gap: 0; }

.contact-eyebrow-light { color: var(--accent); margin-bottom: 8px; }

.contact-form-title {
    margin: 0 0 8px; font-size: clamp(24px, 3.2vw, 32px); font-weight: 800; color: var(--ink);
  }

.contact-form-sub { margin: 0 0 26px; font-size: 15px; color: var(--ink-soft); }

.contact-form { display: flex; flex-direction: column; gap: 16px; }

.contact-form label { display: flex; flex-direction: column; gap: 6px; }

.contact-form label span {
    font-size: 12px; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; color: var(--slate);
  }

.contact-form label span em { font-style: normal; text-transform: none; font-weight: 400; letter-spacing: 0; }

.contact-form input, .contact-form textarea {
    font: inherit; font-size: 15px; color: var(--ink); background: var(--bg);
    border: 1px solid var(--line-strong); border-radius: 3px; padding: 12px 14px; resize: vertical;
  }

.contact-form input:focus, .contact-form textarea:focus { outline: 2px solid var(--accent); outline-offset: 1px; }

.btn-submit {
    align-self: flex-start; display: inline-flex; align-items: center; gap: 8px;
    background: var(--accent); color: #fff; border: none; cursor: pointer;
    font-size: 13px; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase;
    padding: 15px 26px; border-radius: 3px; margin-top: 6px;
  }

.btn-submit:hover, .btn-submit:focus-visible { background: var(--steel); outline: none; }

@media (max-width: 860px) { .contact-split { grid-template-columns: 1fr; } }

/* ---------- Footer ---------- */

.site-footer { background: #0d1015; color: #fff; }

.footer-top {
    max-width: 1280px; margin: 0 auto; padding: clamp(48px, 7vw, 80px) clamp(16px, 5vw, 28px) clamp(32px, 5vw, 48px);
    display: grid; grid-template-columns: 1.3fr 1fr; gap: clamp(30px, 5vw, 60px);
  }

.footer-brand .contact-wordmark { color: #fff; font-size: 16px; margin-bottom: 20px; }

.footer-tagline {
    margin: 0 0 22px; font-size: clamp(40px, 6vw, 66px); font-weight: 800; line-height: 1; color: #fff;
  }

.footer-tagline em { font-style: normal; color: #74bee6; }

.footer-sub { margin: 0; max-width: 42ch; font-size: 17px; line-height: 1.65; color: rgba(226, 230, 234, 0.6); }

.footer-links { display: flex; gap: clamp(30px, 5vw, 64px); }

.footer-col { display: flex; flex-direction: column; gap: 20px; }

.footer-col-head {
    margin: 0 0 4px; font-size: 12.5px; font-weight: 700;
    letter-spacing: 0.14em; text-transform: uppercase; color: rgba(226, 230, 234, 0.45);
  }

.footer-col a { text-decoration: none; font-size: 17px; font-weight: 600; color: rgba(226, 230, 234, 0.9); }

.footer-col a:hover, .footer-col a:focus-visible { color: #74bee6; outline: none; }

.footer-talk {
    color: #74bee6 !important; font-weight: 700; font-size: 17px; display: inline-flex; width: fit-content;
    border-bottom: 2px solid #74bee6; padding-bottom: 2px; margin-top: 24px;
  }

.footer-bottom {
    max-width: 1280px; margin: 0 auto; padding: 24px clamp(16px, 5vw, 28px) 44px;
    border-top: 1px solid rgba(255, 255, 255, 0.14);
    display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px;
    font-size: 12.5px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase;
    color: rgba(226, 230, 234, 0.45);
  }

@media (max-width: 760px) {
    .footer-top { grid-template-columns: 1fr; }
  }

.form-alert { padding: 12px 16px; border-radius: 4px; font-size: 14px; font-weight: 600; margin-bottom: 16px; }
.form-alert-success { background: rgba(82, 201, 138, 0.14); color: #2f8f5b; border: 1px solid rgba(82, 201, 138, 0.35); }
.form-alert-error { background: rgba(220, 53, 69, 0.1); color: #b02a37; border: 1px solid rgba(220, 53, 69, 0.3); }
.form-alert-error ul { margin: 0; padding-left: 18px; }