:root{--blue:#075eac;--navy:#003f7f;--green:#00a651;--ink:#11263a;--muted:#617285;--surface:#f4f8fb;--white:#fff;--danger:#b42318;--border:#d8e4ed;--shadow:0 18px 48px rgba(0,63,127,.1)}
*{box-sizing:border-box}html{overflow-x:hidden}body{margin:0;font-family:Inter,Segoe UI,Arial,sans-serif;color:var(--ink);background:var(--surface);line-height:1.55;overflow-x:hidden}.shell{width:min(1120px,calc(100% - 40px));margin-inline:auto}.site-header{min-height:74px;padding:5px max(20px,calc((100vw - 1120px)/2));display:flex;align-items:center;justify-content:space-between;gap:24px;background:var(--white);border-bottom:1px solid var(--border)}.brand{display:block;width:124px;height:62px}.brand img{display:block;width:124px;height:124px;margin-top:-31px;object-fit:contain}.site-header nav{display:flex;align-items:center;gap:20px}.site-header a,.link-button{color:var(--navy);font-weight:700;text-decoration:none}.inline-form{display:inline}.link-button{border:0;background:none;padding:0;font:inherit;cursor:pointer}.nav-cta{padding:9px 15px;border:1px solid var(--blue);border-radius:999px}.hero{min-height:430px;display:grid;grid-template-columns:1.35fr .65fr;align-items:center;gap:48px;padding-block:52px}.eyebrow{color:var(--green);font-weight:800;letter-spacing:.15em;font-size:.78rem}.hero h1,.page-heading h1,.card h1{font-size:clamp(2.35rem,5vw,4rem);line-height:1.04;color:var(--navy);margin:.2em 0}.card h1,.page-heading h1{font-size:clamp(2rem,4vw,3.25rem)}.lead{font-size:1.15rem;color:var(--muted);max-width:700px}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}.button{display:inline-block;border:0;border-radius:10px;padding:11px 18px;background:var(--blue);color:white!important;font-weight:800;text-decoration:none;cursor:pointer}.button:hover{background:var(--navy)}.button.secondary{background:transparent;color:var(--navy)!important;border:1px solid var(--border)}.button.danger{background:var(--danger)}.trust-panel{background:var(--navy);color:white;border-radius:20px;padding:28px;box-shadow:var(--shadow);display:grid;gap:13px}.trust-panel span{border-bottom:1px solid rgba(255,255,255,.2);padding-bottom:13px}.trust-panel span:last-child{border:0;padding-bottom:0}.values,.product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:48px}.values article,.card{background:var(--white);border:1px solid var(--border);border-radius:16px;padding:24px;box-shadow:var(--shadow)}.values h2,.product-card h2,.card h2{color:var(--navy)}.page-heading{padding:48px 0 24px}.narrow{max-width:620px;margin:48px auto}.card form{display:grid;gap:18px}.card label{display:grid;gap:7px;font-weight:700;color:var(--navy)}input,textarea{width:100%;padding:12px 14px;border:1px solid #afc2d2;border-radius:9px;font:inherit;background:white}textarea{min-height:130px;resize:vertical}.form-error,.flash.error{color:#8a1712;background:#fee4e2}.flash{padding:12px max(20px,calc((100vw - 1120px)/2));background:#e8f3ff}.flash.success{background:#dcfae6;color:#05603a}.status{display:grid;gap:4px;border-radius:10px;padding:16px;margin:24px 0}.status.pending{background:#fff3d6}.status.rejected{background:#fee4e2}.status span{color:var(--muted)}.product-grid{grid-template-columns:repeat(2,1fr)}.product-card{display:flex;flex-direction:column;align-items:flex-start}.product-card .button{margin-top:auto}.product-detail{margin:48px auto;max-width:900px}.secure-image{display:block;width:100%;max-height:520px;object-fit:contain;border:1px solid var(--border);border-radius:12px;margin:28px 0}.prose{margin:24px 0}.review-card{display:grid;grid-template-columns:1fr 1fr;gap:32px;margin-bottom:20px}blockquote{border-left:4px solid var(--green);margin:16px 0;padding-left:16px}.clean-list{list-style:none;padding:0}.clean-list li{display:flex;justify-content:space-between;padding:12px 0;border-bottom:1px solid var(--border)}footer{text-align:center;color:var(--muted);padding:26px}a{color:var(--blue)}
@media(max-width:760px){.shell{width:min(100% - 28px,1120px)}.site-header{align-items:center;gap:10px;padding-inline:14px}.site-header nav{flex-wrap:wrap;justify-content:flex-end;gap:8px 12px;font-size:.92rem}.brand{width:78px;height:58px}.brand img{width:106px;height:106px;margin:-24px 0 0 -14px}.nav-cta{padding:7px 11px}.hero{grid-template-columns:1fr;min-height:auto;gap:30px;padding-block:38px}.values,.product-grid,.review-card{grid-template-columns:1fr}.hero h1{font-size:clamp(2.25rem,11vw,3rem)}.lead{font-size:1.05rem}.trust-panel{padding:22px}.clean-list li{display:grid}}
@media(min-width:500px) and (max-width:760px){.hero{gap:22px;padding-block:30px}.trust-panel{grid-template-columns:repeat(3,1fr);gap:14px;padding:20px}.trust-panel span{border-bottom:0;border-right:1px solid rgba(255,255,255,.2);padding:0 14px 0 0}.trust-panel span:last-child{border-right:0;padding-right:0}}

/* ===== UNIDA STAGE 1 PREMIUM HOMEPAGE ===== */
:root {
  --unida-navy:#063f78;
  --unida-blue:#0877c9;
  --unida-green:#00a86b;
  --unida-gold:#f2b84b;
  --unida-ink:#102a43;
  --unida-muted:#5c7085;
  --unida-bg:#f3f7fb;
  --unida-line:#d8e4ee;
}

html { scroll-behavior:smooth; }
body { color:var(--unida-ink); background:#fff; }
.shell { width:min(1120px, calc(100% - 40px)); margin-inline:auto; }

.hero {
  min-height:650px;
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(330px,.65fr);
  gap:72px;
  align-items:center;
  padding-block:86px 72px;
}

.hero-copy { max-width:720px; }

.eyebrow {
  margin:0 0 20px;
  color:var(--unida-green);
  font-size:.76rem;
  font-weight:800;
  letter-spacing:.18em;
}

.hero h1 {
  max-width:720px;
  margin:0;
  color:var(--unida-navy);
  font-size:clamp(3.4rem,7vw,6.4rem);
  line-height:.92;
  letter-spacing:-.065em;
}

.hero .lead {
  max-width:680px;
  margin:30px 0 0;
  color:var(--unida-muted);
  font-size:1.13rem;
  line-height:1.75;
}

.actions {
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:32px;
}

.button {
  display:inline-flex;
  min-height:50px;
  align-items:center;
  justify-content:center;
  padding:0 22px;
  border:1px solid var(--unida-blue);
  border-radius:12px;
  background:var(--unida-blue);
  color:#fff;
  font-weight:800;
  text-decoration:none;
  transition:.2s ease;
}

.button:hover {
  transform:translateY(-2px);
  box-shadow:0 12px 26px rgba(8,119,201,.18);
}

.button.secondary {
  background:transparent;
  color:var(--unida-navy);
  border-color:var(--unida-line);
}

.hero-proof {
  display:flex;
  flex-wrap:wrap;
  gap:22px;
  margin-top:34px;
  color:var(--unida-muted);
  font-size:.83rem;
  font-weight:700;
}

.hero-proof span::before {
  content:"";
  display:inline-block;
  width:7px;
  height:7px;
  margin-right:8px;
  border-radius:50%;
  background:var(--unida-green);
}

.trust-panel {
  padding:34px;
  border-radius:26px;
  color:#fff;
  background:
    radial-gradient(circle at 90% 10%,rgba(0,168,107,.3),transparent 35%),
    linear-gradient(145deg,#07589e,#063b70);
  box-shadow:0 30px 60px rgba(6,63,120,.22);
}

.trust-panel .panel-label {
  margin:0 0 13px;
  color:#9be7c7;
  font-size:.67rem;
  font-weight:800;
  letter-spacing:.14em;
}

.trust-panel h2 {
  margin:0 0 28px;
  color:#fff;
  font-size:2rem;
  line-height:1.1;
}

.trust-list { display:grid; }

.trust-list span {
  display:flex;
  align-items:center;
  gap:16px;
  padding:17px 0;
  border-top:1px solid rgba(255,255,255,.15);
}

.trust-list b {
  color:#80ddba;
  font-size:.72rem;
}

.trust-strip {
  background:var(--unida-navy);
  color:#fff;
}

.trust-grid {
  display:grid;
  grid-template-columns:repeat(4,1fr);
}

.trust-grid span {
  padding:22px 18px;
  border-left:1px solid rgba(255,255,255,.13);
  text-align:center;
  font-size:.82rem;
  font-weight:800;
}

.section { padding-block:105px; }

.section-heading { max-width:720px; margin-bottom:46px; }

.section-heading h2,
.collaboration h2,
.final-cta h2 {
  margin:0;
  color:var(--unida-navy);
  font-size:clamp(2.3rem,5vw,4rem);
  line-height:1.03;
  letter-spacing:-.045em;
}

.section-heading > p:last-child {
  color:var(--unida-muted);
  font-size:1.05rem;
  line-height:1.75;
}

.solution-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}

.solution-card {
  min-height:310px;
  padding:30px;
  border:1px solid var(--unida-line);
  border-radius:20px;
  background:#fff;
  transition:.22s ease;
}

.solution-card:hover {
  transform:translateY(-5px);
  border-color:#9fc9e7;
  box-shadow:0 22px 50px rgba(16,42,67,.1);
}

.solution-card.featured {
  color:#fff;
  border-color:var(--unida-navy);
  background:var(--unida-navy);
}

.card-code {
  display:grid;
  width:48px;
  height:48px;
  place-items:center;
  border-radius:13px;
  background:#e9f4fc;
  color:var(--unida-blue);
  font-weight:900;
}

.featured .card-code {
  background:rgba(255,255,255,.13);
  color:#8ee1bd;
}

.card-label {
  margin:38px 0 8px;
  color:var(--unida-green);
  font-size:.68rem;
  font-weight:900;
  letter-spacing:.14em;
}

.solution-card h3 {
  margin:0 0 12px;
  color:var(--unida-navy);
  font-size:1.55rem;
}

.solution-card > p:last-child {
  color:var(--unida-muted);
  line-height:1.65;
}

.featured h3,
.featured > p:last-child { color:#fff; }

.capabilities {
  color:#fff;
  background:linear-gradient(135deg,#052f58,#075592);
}

.section-heading.light h2 { color:#fff; }

.capability-grid {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:1px;
  background:rgba(255,255,255,.16);
}

.capability-grid article {
  min-height:240px;
  padding:28px;
  background:#074676;
}

.capability-grid span {
  color:#75dab1;
  font-size:.72rem;
  font-weight:900;
}

.capability-grid h3 { margin-top:44px; font-size:1.3rem; }
.capability-grid p { color:#c7d9e7; line-height:1.6; }

.collaboration {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:80px;
  align-items:end;
}

.collaboration > p {
  margin:0;
  color:var(--unida-muted);
  font-size:1.1rem;
  line-height:1.8;
}

.final-cta {
  padding:100px 20px;
  text-align:center;
  background:var(--unida-bg);
}

.final-cta .shell { max-width:800px; }
.final-cta p:not(.eyebrow) { color:var(--unida-muted); font-size:1.05rem; }
.actions.centered { justify-content:center; }

.button.accent {
  border-color:var(--unida-green);
  background:var(--unida-green);
}

.button.ghost {
  border-color:var(--unida-line);
  background:#fff;
  color:var(--unida-navy);
}

@media (max-width:900px) {
  .hero {
    min-height:auto;
    grid-template-columns:1fr;
    gap:40px;
    padding-block:65px;
  }

  .hero h1 { font-size:clamp(3.2rem,12vw,5.5rem); }
  .solution-grid { grid-template-columns:repeat(2,1fr); }
  .capability-grid { grid-template-columns:repeat(2,1fr); }
  .collaboration { grid-template-columns:1fr; gap:28px; }
}

@media (max-width:640px) {
  .shell { width:min(100% - 28px,1120px); }
  .hero { padding-block:48px; }
  .hero h1 { font-size:3.25rem; }
  .hero .lead { font-size:1rem; }
  .hero-proof { display:grid; gap:10px; }
  .trust-panel { padding:26px; border-radius:20px; }
  .trust-grid { grid-template-columns:repeat(2,1fr); }
  .trust-grid span { border-bottom:1px solid rgba(255,255,255,.13); }
  .section { padding-block:76px; }
  .solution-grid,
  .capability-grid { grid-template-columns:1fr; }
  .solution-card { min-height:auto; }
  .capability-grid article { min-height:200px; }
  .actions .button { width:100%; }
}

/* UNIDA essential homepage additions */
#what-we-do {
    padding-top: 82px;
    padding-bottom: 35px;
}

#what-we-do .section-heading {
    max-width: 680px;
    margin-bottom: 30px;
}

#what-we-do .section-heading h2 {
    color: #064783;
    font-size: clamp(2rem, 4vw, 3rem);
    line-height: 1.1;
}

#what-we-do .values {
    padding: 0;
}

.quote-section {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 50px;
    margin-top: 65px;
    margin-bottom: 70px;
    padding: 45px;
    border-radius: 22px;
    color: #fff;
    background: #064783;
}

.quote-section > div {
    max-width: 680px;
}

.quote-section h2 {
    margin: 0 0 12px;
    color: #fff;
    font-size: clamp(2rem, 4vw, 3rem);
}

.quote-section p:not(.eyebrow) {
    margin: 0;
    color: #dceaf5;
    line-height: 1.7;
}

.quote-section .button {
    flex: 0 0 auto;
    border-color: #00a86b;
    background: #00a86b;
}

@media (max-width: 700px) {
    .quote-section {
        align-items: flex-start;
        flex-direction: column;
        margin-inline: 14px;
        padding: 30px 24px;
    }

    .quote-section .button {
        width: 100%;
    }
}

/* UNIDA hero video */
.hero-media {
    position: relative;
    overflow: hidden;
    min-height: 360px;
    border: 1px solid rgba(8, 119, 201, 0.18);
    border-radius: 24px;
    background: #063f78;
    box-shadow: 0 28px 60px rgba(6, 63, 120, 0.18);
    animation: heroEnter 700ms ease-out both;
}

.hero-media video {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 360px;
    object-fit: cover;
}

.hero-media::after {
    position: absolute;
    inset: 0;
    content: "";
    pointer-events: none;
    background:
        linear-gradient(
            180deg,
            transparent 55%,
            rgba(3, 31, 59, 0.65) 100%
        );
}

.hero-media-badge {
    position: absolute;
    z-index: 2;
    right: 20px;
    bottom: 18px;
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 10px 14px;
    border: 1px solid rgba(255,255,255,.22);
    border-radius: 999px;
    color: #fff;
    background: rgba(3, 41, 76, .78);
    backdrop-filter: blur(10px);
    font-size: .78rem;
    font-weight: 800;
}

.hero-media-badge span {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #22d38b;
    box-shadow: 0 0 0 5px rgba(34, 211, 139, .16);
    animation: statusPulse 2s ease-in-out infinite;
}

.button {
    transition:
        transform .2s ease,
        box-shadow .2s ease,
        background-color .2s ease;
}

.button:hover {
    transform: translateY(-2px);
}

.button:active {
    transform: translateY(0) scale(.98);
}

.values article {
    transition:
        transform .22s ease,
        box-shadow .22s ease,
        border-color .22s ease;
}

.values article:hover {
    transform: translateY(-5px);
    border-color: rgba(8,119,201,.35);
    box-shadow: 0 18px 40px rgba(16,42,67,.09);
}

@keyframes heroEnter {
    from {
        opacity: 0;
        transform: translateY(14px) scale(.985);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes statusPulse {
    0%, 100% { opacity: 1; }
    50% { opacity: .45; }
}

@media (max-width: 760px) {
    .hero-media,
    .hero-media video {
        min-height: 250px;
    }

    .hero-media {
        border-radius: 18px;
    }

    .hero-media-badge {
        right: 12px;
        bottom: 12px;
    }
}

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

    .hero-media,
    .hero-media-badge span,
    .button,
    .values article {
        animation: none;
        transition: none;
    }
}

/* UNIDA modern hero carousel */
.hero-carousel {
    position: relative;
    overflow: hidden;
    width: 100%;
    min-height: 410px;
    border: 1px solid rgba(84, 106, 255, .18);
    border-radius: 28px;
    background: #071a3b;
    box-shadow:
        0 30px 70px rgba(20, 49, 92, .18),
        inset 0 1px rgba(255,255,255,.15);
}

.carousel-track {
    position: relative;
    min-height: 410px;
}

.carousel-slide {
    position: absolute;
    inset: 0;
    visibility: hidden;
    opacity: 0;
    transform: scale(1.025);
    transition:
        opacity .65s ease,
        transform .8s ease,
        visibility .65s;
}

.carousel-slide.is-active {
    visibility: visible;
    opacity: 1;
    transform: scale(1);
}

.carousel-slide img {
    width: 100%;
    height: 410px;
    object-fit: cover;
}

.carousel-slide::after {
    position: absolute;
    inset: 0;
    content: "";
    background: linear-gradient(
        180deg,
        rgba(5,18,48,.02) 30%,
        rgba(5,18,48,.88) 100%
    );
}

.slide-gradient {
    background:
        radial-gradient(circle at 75% 20%, rgba(126,87,255,.9), transparent 32%),
        radial-gradient(circle at 20% 20%, rgba(0,184,255,.65), transparent 38%),
        linear-gradient(145deg, #07153c, #26358f 55%, #5a2eb2);
}

.slide-cloud {
    background:
        radial-gradient(circle at 70% 25%, rgba(0,224,162,.55), transparent 34%),
        radial-gradient(circle at 20% 70%, rgba(68,106,255,.8), transparent 42%),
        linear-gradient(140deg,#061738,#073c72);
}

.slide-overlay {
    position: absolute;
    z-index: 3;
    right: 30px;
    bottom: 34px;
    left: 30px;
    display: grid;
    gap: 8px;
    color: #fff;
}

.slide-overlay span {
    color: #7de0bd;
    font-size: .68rem;
    font-weight: 900;
    letter-spacing: .15em;
}

.slide-overlay strong {
    max-width: 470px;
    font-size: clamp(1.35rem, 3vw, 2rem);
    line-height: 1.15;
}

.slide-graphic {
    position: absolute;
    inset: 30px;
    display: grid;
    place-items: center;
}

.core {
    z-index: 2;
    display: grid;
    width: 92px;
    height: 92px;
    place-items: center;
    border: 1px solid rgba(255,255,255,.35);
    border-radius: 24px;
    color: #fff;
    background: rgba(255,255,255,.14);
    box-shadow: 0 20px 50px rgba(0,0,0,.2);
    backdrop-filter: blur(12px);
    font-size: 1.55rem;
    font-weight: 900;
}

.orbit {
    position: absolute;
    border: 1px solid rgba(255,255,255,.28);
    border-radius: 50%;
}

.orbit-one {
    width: 210px;
    height: 210px;
    animation: orbitRotate 12s linear infinite;
}

.orbit-two {
    width: 320px;
    height: 170px;
    transform: rotate(-25deg);
    animation: orbitRotate 16s linear infinite reverse;
}

.cloud-grid {
    position: absolute;
    top: 55px;
    right: 50px;
    left: 50px;
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 14px;
}

.cloud-grid span {
    height: 68px;
    border: 1px solid rgba(255,255,255,.22);
    border-radius: 16px;
    background: rgba(255,255,255,.11);
    backdrop-filter: blur(9px);
}

.carousel-controls {
    position: absolute;
    z-index: 5;
    top: 22px;
    right: 22px;
    display: flex;
    align-items: center;
    gap: 11px;
}

.carousel-arrow {
    display: grid;
    width: 36px;
    height: 36px;
    place-items: center;
    border: 1px solid rgba(255,255,255,.25);
    border-radius: 50%;
    color: #fff;
    background: rgba(6,31,66,.62);
    cursor: pointer;
    font-size: 1.35rem;
    backdrop-filter: blur(10px);
}

.carousel-dots {
    display: flex;
    gap: 6px;
}

.carousel-dots button {
    width: 7px;
    height: 7px;
    padding: 0;
    border: 0;
    border-radius: 99px;
    background: rgba(255,255,255,.45);
    cursor: pointer;
    transition: width .25s ease, background .25s ease;
}

.carousel-dots button.is-active {
    width: 24px;
    background: #37d99a;
}

@keyframes orbitRotate {
    to { transform: rotate(360deg); }
}

@media (max-width: 760px) {
    .hero-carousel,
    .carousel-track {
        min-height: 300px;
    }

    .carousel-slide img {
        height: 300px;
    }

    .hero-carousel {
        border-radius: 20px;
    }

    .slide-overlay {
        right: 20px;
        bottom: 24px;
        left: 20px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .carousel-slide,
    .orbit {
        animation: none;
        transition: none;
    }
}

/* Full-background hero carousel */
.hero.hero-background {
    position: relative;
    display: grid;
    overflow: hidden;
    width: 100%;
    max-width: none;
    min-height: 680px;
    padding: 0;
    isolation: isolate;
}

.hero-background-carousel,
.hero-background-carousel .hero-carousel,
.hero-background-carousel .carousel-track {
    position: absolute;
    inset: 0;
    width: 100%;
    min-height: 680px;
    border: 0;
    border-radius: 0;
}

.hero-background-carousel {
    z-index: -2;
}

.hero-background-carousel .carousel-slide {
    min-height: 680px;
}

.hero-background-carousel .slide-overlay,
.hero-background-carousel .carousel-controls {
    display: none;
}

.hero-background-carousel::after {
    position: absolute;
    z-index: 2;
    inset: 0;
    content: "";
    pointer-events: none;
    background:
        linear-gradient(
            90deg,
            rgba(3,18,48,.96) 0%,
            rgba(3,18,48,.87) 44%,
            rgba(3,18,48,.36) 75%,
            rgba(3,18,48,.55) 100%
        );
}

.hero-content {
    position: relative;
    z-index: 3;
    display: flex;
    align-items: center;
    min-height: 680px;
}

.hero-copy {
    max-width: 750px;
}

.hero-background .hero-copy h1 {
    margin: 0;
    color: #fff;
    font-size: clamp(3.6rem, 7vw, 6.8rem);
    line-height: .92;
    letter-spacing: -.065em;
}

.hero-background .lead {
    max-width: 650px;
    color: #d7e5f2;
}

.hero-background .eyebrow {
    color: #51dfa8;
}

.hero-background .button.secondary {
    border-color: rgba(255,255,255,.45);
    color: #fff;
    background: rgba(255,255,255,.1);
    backdrop-filter: blur(10px);
}

.slide-digital {
    background:
        radial-gradient(circle at 75% 35%, rgba(115,65,255,.9), transparent 28%),
        radial-gradient(circle at 50% 60%, rgba(0,174,255,.7), transparent 36%),
        linear-gradient(140deg,#040e2c,#123f89 52%,#5525a9);
}

.digital-mesh {
    position: absolute;
    inset: 10%;
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 24px;
    transform: perspective(900px) rotateY(-16deg) rotateX(6deg);
}

.digital-mesh span {
    border: 1px solid rgba(255,255,255,.22);
    border-radius: 24px;
    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.18),
            rgba(255,255,255,.04)
        );
    box-shadow: 0 20px 50px rgba(2,12,42,.28);
    backdrop-filter: blur(14px);
}

/* What-we-do image section */
.what-layout {
    display: grid;
    grid-template-columns: minmax(0, .9fr) minmax(420px, 1.1fr);
    gap: 70px;
    align-items: center;
    margin-bottom: 48px;
}

.what-layout .section-heading {
    margin-bottom: 0;
}

.what-visual {
    overflow: hidden;
    margin: 0;
    border: 1px solid rgba(8,119,201,.18);
    border-radius: 26px;
    background: #071a3b;
    box-shadow: 0 26px 60px rgba(16,42,67,.15);
}

.what-visual img {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 10;
    object-fit: cover;
}

@media (max-width: 900px) {
    .hero.hero-background,
    .hero-background-carousel,
    .hero-background-carousel .hero-carousel,
    .hero-background-carousel .carousel-track,
    .hero-background-carousel .carousel-slide,
    .hero-content {
        min-height: 620px;
    }

    .what-layout {
        grid-template-columns: 1fr;
        gap: 34px;
    }
}

@media (max-width: 640px) {
    .hero-background .hero-copy h1 {
        font-size: 3.3rem;
    }

    .hero-background-carousel::after {
        background: rgba(3,18,48,.8);
    }

    .what-visual {
        border-radius: 18px;
    }
}

/* Subscription and public contact section */
.connect-section {
    display: grid;
    grid-template-columns: minmax(0,1fr) minmax(360px,.8fr);
    gap: 70px;
    align-items: center;
    margin-top: 70px;
    margin-bottom: 90px;
    padding: 55px;
    border-radius: 28px;
    color: #fff;
    background:
        radial-gradient(circle at 90% 10%,rgba(76,62,255,.48),transparent 32%),
        linear-gradient(135deg,#052f5c,#075a99 58%,#193d8c);
    box-shadow: 0 28px 65px rgba(6,63,120,.17);
}

.connect-copy h2 {
    margin: 0 0 16px;
    color: #fff;
    font-size: clamp(2.3rem,5vw,4.2rem);
    line-height: 1;
    letter-spacing: -.045em;
}

.connect-copy > p:not(.eyebrow) {
    max-width: 610px;
    color: #d6e7f4;
    line-height: 1.75;
}

.connect-link {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    margin-top: 15px;
    color: #7ce2ba;
    font-weight: 800;
    text-decoration: none;
}

.connect-link span {
    transition: transform .2s ease;
}

.connect-link:hover span {
    transform: translateX(5px);
}

.subscribe-form {
    padding: 28px;
    border: 1px solid rgba(255,255,255,.2);
    border-radius: 20px;
    background: rgba(255,255,255,.1);
    backdrop-filter: blur(14px);
}

.subscribe-form label {
    color: #fff;
    font-weight: 800;
}

.subscribe-row {
    display: flex;
    gap: 10px;
    margin-top: 9px;
}

.subscribe-row input {
    min-width: 0;
    flex: 1;
    min-height: 50px;
    padding: 0 15px;
    border: 1px solid rgba(255,255,255,.28);
    border-radius: 11px;
    color: #102a43;
    background: #fff;
}

.subscribe-row .button {
    border-color: #12b978;
    background: #12b978;
}

.subscribe-form small {
    display: block;
    margin-top: 12px;
    color: #c9ddeb;
}

/* Public contact and FAQ */
.public-contact,
.faq-page {
    padding-top: 85px;
    padding-bottom: 100px;
}

.contact-intro {
    max-width: 760px;
    margin-bottom: 42px;
}

.contact-intro h1 {
    margin: 0 0 18px;
    color: #064783;
    font-size: clamp(3rem,6vw,5.5rem);
    line-height: .95;
    letter-spacing: -.055em;
}

.contact-intro > p:last-child {
    color: #5c7085;
    font-size: 1.05rem;
    line-height: 1.7;
}

.contact-layout {
    display: grid;
    grid-template-columns: minmax(0,1.1fr) minmax(330px,.7fr);
    gap: 24px;
    align-items: start;
}

.contact-card,
.subscribe-panel {
    padding: 34px;
    border: 1px solid #d8e4ee;
    border-radius: 22px;
    background: #fff;
}

.subscribe-panel {
    position: sticky;
    top: 30px;
    color: #fff;
    border: 0;
    background: linear-gradient(145deg,#064783,#0877c9);
}

.subscribe-panel h2 {
    color: #fff;
    font-size: 2rem;
}

.subscribe-panel > p:not(.eyebrow) {
    color: #dcebf6;
}

.contact-card form,
.subscribe-panel form {
    display: grid;
    gap: 18px;
}

.contact-card label,
.subscribe-panel label {
    display: grid;
    gap: 7px;
    font-weight: 700;
}

.contact-card input,
.contact-card select,
.contact-card textarea,
.subscribe-panel input {
    width: 100%;
    box-sizing: border-box;
    padding: 13px 14px;
    border: 1px solid #cddbe7;
    border-radius: 10px;
    background: #fff;
    font: inherit;
}

.contact-card textarea {
    min-height: 150px;
    resize: vertical;
}

.hidden-field {
    position: absolute;
    left: -10000px;
}

.faq-list {
    display: grid;
    gap: 12px;
    max-width: 900px;
}

.faq-list details {
    padding: 22px 24px;
    border: 1px solid #d8e4ee;
    border-radius: 15px;
    background: #fff;
}

.faq-list summary {
    color: #064783;
    cursor: pointer;
    font-weight: 800;
}

.faq-list p {
    color: #5c7085;
    line-height: 1.7;
}

/* Full footer */
.site-footer {
    padding: 70px 0 25px;
    color: #c8d9e8;
    background: #041e38;
}

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

.footer-brand strong {
    color: #fff;
    font-size: 1.05rem;
    letter-spacing: .08em;
}

.footer-brand p {
    color: #75d8b3;
}

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

.footer-grid a {
    display: block;
    width: fit-content;
    margin: 11px 0;
    color: #c8d9e8;
    text-decoration: none;
}

.footer-grid a:hover {
    color: #65dfb1;
}

.footer-bottom {
    margin-top: 50px;
    padding-top: 22px;
    border-top: 1px solid rgba(255,255,255,.12);
    font-size: .85rem;
}

@media (max-width: 850px) {
    .connect-section,
    .contact-layout {
        grid-template-columns: 1fr;
    }

    .footer-grid {
        grid-template-columns: repeat(2,1fr);
    }

    .subscribe-panel {
        position: static;
    }
}

@media (max-width: 560px) {
    .connect-section {
        margin-inline: 14px;
        padding: 32px 24px;
    }

    .subscribe-row {
        flex-direction: column;
    }

    .subscribe-row .button {
        width: 100%;
    }

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

/* UNIDA-BRAND-RESPONSIVE-START */
.brand {
    display: inline-flex;
    align-items: center;
    min-width: 0;
    text-decoration: none;
}

.brand-text {
    display: inline-flex;
    align-items: center;
    color: #064785;
    font-size: clamp(0.78rem, 1.4vw, 1rem);
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: clamp(0.03em, 0.35vw, 0.08em);
    white-space: nowrap;
}

/* Tablet and iPad */
@media (max-width: 1024px) {
    .brand-text {
        font-size: 0.86rem;
        letter-spacing: 0.05em;
    }
}

/* Mobile */
@media (max-width: 640px) {
    .site-header {
        gap: 0.75rem;
    }

    .brand {
        flex: 0 1 42%;
        max-width: 42%;
    }

    .brand-text {
        font-size: 0.7rem;
        letter-spacing: 0.025em;
        white-space: normal;
    }
}

/* Very small phones */
@media (max-width: 380px) {
    .brand-text {
        font-size: 0.64rem;
    }
}
/* UNIDA-BRAND-RESPONSIVE-END */

/* UNIDA-LOGO-FOOTER-START */

/* Official responsive UNIDA logo */
.brand {
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
    max-width: none;
    text-decoration: none;
}

.brand-logo {
    display: block;
    width: 56px;
    height: 56px;
    object-fit: contain;
    object-position: center;
}

/* Balanced footer */
.site-footer {
    padding: 48px 0 max(22px, env(safe-area-inset-bottom));
}

.footer-grid {
    grid-template-columns: 1.35fr repeat(3, minmax(0, 1fr));
    gap: 36px;
    align-items: start;
}

.footer-grid h2 {
    margin: 0 0 14px;
    text-align: left;
}

.footer-grid a {
    margin: 8px 0;
    line-height: 1.45;
}

.footer-brand p {
    margin: 10px 0 0;
}

.footer-bottom {
    margin-top: 34px;
    padding-top: 18px;
    text-align: center;
}

/* Tablet and iPad */
@media (max-width: 850px) {
    .brand-logo {
        width: 50px;
        height: 50px;
    }

    .footer-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 30px 28px;
    }

    .footer-brand {
        grid-column: 1 / -1;
    }
}

/* Mobile */
@media (max-width: 560px) {
    .brand-logo {
        width: 44px;
        height: 44px;
    }

    .site-footer {
        padding: 34px 0 max(20px, env(safe-area-inset-bottom));
    }

    .footer-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 26px 18px;
    }

    .footer-brand {
        grid-column: 1 / -1;
        text-align: center;
    }

    .footer-grid h2 {
        margin-bottom: 10px;
        font-size: 0.82rem;
        text-align: left;
    }

    .footer-grid a {
        margin: 7px 0;
        font-size: 0.9rem;
        line-height: 1.4;
    }

    .footer-bottom {
        margin-top: 26px;
        padding-top: 16px;
        font-size: 0.78rem;
        line-height: 1.5;
    }
}

/* Very small phones */
@media (max-width: 380px) {
    .footer-grid {
        gap: 24px 14px;
    }

    .footer-grid a {
        font-size: 0.84rem;
    }

    .footer-bottom {
        font-size: 0.74rem;
    }
}

/* UNIDA-LOGO-FOOTER-END */