/* UNHCR resettlement section – shared styles (mobile-first) */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
:root{
  --blue:#0072bc;--blue-dark:#005a9c;--navy:#1a2a3a;--gray:#f4f5f7;--line:#d8dde3;
  --text:#1e2a35;--muted:#5a6b7b;--pale:#e8f1f8;--yellow:#faeb00;--white:#fff;
  --font:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  --r:8px;--shadow:0 2px 14px rgba(0,0,0,.08);
  --pad:clamp(16px,4vw,28px);
}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:var(--font);color:var(--text);background:var(--white);line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:var(--blue);text-decoration:none}
a:hover{color:var(--blue-dark);text-decoration:underline}
:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
ul{list-style:none}
.container{width:100%;max-width:1200px;margin:0 auto;padding:0 var(--pad)}
.skip{position:absolute;left:-999px;top:0;background:var(--yellow);color:#000;padding:10px 16px;z-index:2000;font-weight:700}
.skip:focus{left:8px;top:8px}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 22px;border-radius:var(--r);font:600 .95rem/1.3 var(--font);border:2px solid transparent;cursor:pointer;text-align:center;transition:.2s}
.btn:hover{text-decoration:none;transform:translateY(-1px)}
.btn-primary{background:var(--blue);color:#fff;border-color:var(--blue)}
.btn-primary:hover{background:var(--blue-dark);border-color:var(--blue-dark);color:#fff}
.btn-outline{background:transparent;color:var(--text);border-color:var(--text)}
.btn-outline:hover{background:var(--text);color:#fff}
.btn-light{background:transparent;color:#fff;border-color:#fff}
.btn-light:hover{background:#fff;color:var(--navy)}
.btn-yellow{background:var(--yellow);color:#000;border-color:var(--yellow);font-weight:700}
.btn-yellow:hover{background:#e6d800;color:#000}
.btn-sm{min-height:36px;padding:6px 14px;font-size:.8rem}

/* Hero */
.hero{position:relative;color:#fff;background:var(--navy) center/cover no-repeat;isolation:isolate}
.hero::before{content:'';position:absolute;inset:0;background:linear-gradient(100deg,rgba(26,42,58,.94) 25%,rgba(26,42,58,.6));z-index:-1}
.hero .container{padding-top:clamp(36px,8vw,84px);padding-bottom:clamp(36px,8vw,84px)}
.hero-tag{display:inline-block;background:var(--yellow);color:#000;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;padding:4px 10px;border-radius:3px;margin-bottom:14px}
.hero h1{font-size:clamp(1.7rem,5.5vw,3rem);line-height:1.15;max-width:18ch;margin-bottom:14px}
.hero p{font-size:clamp(1rem,2.6vw,1.2rem);max-width:60ch;opacity:.95}
.hero .actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}
.hero.sm .container{padding-top:clamp(28px,6vw,56px);padding-bottom:clamp(28px,6vw,56px)}

/* Breadcrumb */
.breadcrumb{background:var(--gray);border-bottom:1px solid var(--line);font-size:.82rem}
.breadcrumb ol{display:flex;flex-wrap:wrap;gap:4px 8px;padding:10px 0;list-style:none}
.breadcrumb li+li::before{content:'/';margin-right:8px;color:var(--muted)}
.breadcrumb [aria-current]{color:var(--muted)}

/* Layout */
.section{padding:clamp(32px,7vw,64px) 0}
.section.alt{background:var(--gray)}
h2{font-size:clamp(1.35rem,3.6vw,1.9rem);line-height:1.25;margin-bottom:14px;color:var(--navy)}
h3{font-size:1.1rem;line-height:1.35;margin-bottom:8px;color:var(--navy)}
.lead{font-size:clamp(1.05rem,2.6vw,1.25rem);color:var(--muted);margin-bottom:20px}
.layout{display:grid;gap:32px}
.layout>*{min-width:0}
.article>*+*{margin-top:14px}
.article h2{margin-top:34px}
.article h2:first-child{margin-top:0}
.article ul.list{list-style:disc;padding-left:1.3em}
.article ul.list li+li{margin-top:6px}
.article ol.steps{counter-reset:s;display:grid;gap:14px;margin-top:16px}
.article ol.steps li{counter-increment:s;position:relative;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:16px 16px 16px 62px;list-style:none}
.article ol.steps li::before{content:counter(s);position:absolute;left:14px;top:14px;width:34px;height:34px;border-radius:50%;background:var(--blue);color:#fff;font-weight:700;display:grid;place-items:center}
.article ol.steps strong{display:block;color:var(--navy)}
.callout{background:var(--pale);border-left:4px solid var(--blue);border-radius:0 var(--r) var(--r) 0;padding:16px 18px}
.callout.warn{background:#fffbd1;border-color:#d9c800}
.aside{display:grid;gap:18px;align-content:start}
.panel{border:1px solid var(--line);border-radius:var(--r);padding:18px;background:#fff}
.panel h3{font-size:1rem;margin-bottom:10px}
.panel li a{display:block;padding:9px 0;border-bottom:1px solid var(--line);font-weight:500}
.panel li:last-child a{border:0}
.panel li a[aria-current]{color:var(--text);font-weight:700}

/* Cards */
.grid{display:grid;gap:18px;grid-template-columns:1fr}
.card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;color:var(--text);transition:.2s}
.card:hover{box-shadow:var(--shadow);text-decoration:none;transform:translateY(-2px)}
.card img{width:100%;aspect-ratio:16/10;object-fit:cover;background:var(--pale)}
.card-body{padding:16px 18px 20px;display:flex;flex-direction:column;gap:6px;flex:1}
.card-body h3{margin:0}
.card-body p{font-size:.95rem;color:var(--muted)}
.card .more{margin-top:auto;padding-top:8px;font-weight:600;color:var(--blue)}
.section-head{margin-bottom:22px;max-width:70ch}

/* Table, FAQ */
.table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--line);border-radius:var(--r)}
table{width:100%;border-collapse:collapse;font-size:.95rem}
th,td{padding:12px 14px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line)}
th{background:var(--gray);width:36%;color:var(--navy)}
tr:last-child th,tr:last-child td{border-bottom:0}
details{border:1px solid var(--line);border-radius:var(--r);background:#fff}
details+details{margin-top:10px}
summary{cursor:pointer;list-style:none;padding:16px 48px 16px 18px;font-weight:600;color:var(--navy);position:relative;min-height:48px}
summary::-webkit-details-marker{display:none}
summary::after{content:'+';position:absolute;right:18px;top:50%;transform:translateY(-50%);font-size:1.4rem;color:var(--blue)}
details[open] summary::after{content:'–'}
details[open] summary{border-bottom:1px solid var(--line)}
.answer{padding:14px 18px 18px}
.answer>*+*{margin-top:10px}

/* Contact */
.contact-cards{display:grid;gap:16px}
.contact-card{border:1px solid var(--line);border-radius:var(--r);padding:20px;background:#fff}
.contact-card .big{display:block;font-size:clamp(1.15rem,4.5vw,1.5rem);font-weight:700;margin:6px 0;word-break:break-word}
.contact-card .label{font-size:.78rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:600}

/* CTA band + footer */
.cta{background:var(--blue);color:#fff;text-align:center}
.cta h2{color:#fff}
.cta p{max-width:60ch;margin:0 auto 20px}

.hero-split{display:grid;gap:26px;align-items:center}
.hero-split .hero-photo{display:none;border-radius:var(--r);overflow:hidden;box-shadow:0 12px 34px rgba(0,0,0,.35);max-width:340px;justify-self:end}
.hero-split .hero-photo img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/5}
.eyebrow{display:block;font-size:.76rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--blue);margin-bottom:6px}
.split{display:grid;gap:24px;align-items:center}
.split img{width:100%;border-radius:var(--r);box-shadow:var(--shadow)}
.links-inline{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
.steps6{display:grid;gap:14px;grid-template-columns:1fr;counter-reset:st;margin-top:26px;list-style:none;padding:0}
.step6{position:relative;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:18px;counter-increment:st;transition:.2s}
.step6:hover{box-shadow:var(--shadow);transform:translateY(-2px)}
.step6 .ico{width:46px;height:46px;border-radius:50%;background:var(--pale);color:var(--blue);display:grid;place-items:center;margin-bottom:12px}
.step6 .ico svg{width:24px;height:24px}
.step6::before{content:counter(st);position:absolute;top:14px;right:16px;width:28px;height:28px;border-radius:50%;background:var(--blue);color:#fff;font-weight:700;font-size:.85rem;display:grid;place-items:center}
.step6 h3{margin-bottom:4px}.step6 p{font-size:.93rem;color:var(--muted)}
.tagline{font-family:Georgia,'Times New Roman',serif;font-style:italic;font-size:clamp(1.2rem,3.4vw,1.6rem);color:var(--blue);text-align:center;margin-top:28px}
.band{background:linear-gradient(135deg,#0072bc,#18375f);color:#fff}
.band h2,.band h3{color:#fff}.band p{opacity:.95}
.dest-grid{display:grid;gap:26px;align-items:center}
.chips{display:flex;flex-wrap:wrap;gap:12px;margin-top:18px}
.chip{display:inline-flex;align-items:center;gap:8px;background:#fff;color:var(--navy);font-weight:600;padding:9px 16px;border-radius:999px;box-shadow:0 2px 10px rgba(0,0,0,.18);transition:.2s}
.chip:hover{transform:translateY(-2px);text-decoration:none;color:var(--blue-dark)}
.chip .flag{font-size:1.25rem;line-height:1}
.routes{width:100%;height:auto;max-width:520px;justify-self:center}
.routes .pin{cursor:pointer}
.trio{display:grid;gap:18px;margin-top:6px}
.tile{position:relative;border-radius:var(--r);overflow:hidden;min-height:320px;display:flex;align-items:flex-end;color:#fff;isolation:isolate;background:var(--navy)}
.tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.tile::after{content:'';position:absolute;inset:0;background:linear-gradient(to top,rgba(10,30,55,.92) 8%,rgba(10,30,55,.1) 70%);z-index:-1}
.tile div{padding:20px}.tile h3{color:#fff;font-size:1.25rem;margin-bottom:6px}.tile p{font-size:.95rem;opacity:.95}
.support-grid{display:grid;gap:14px;grid-template-columns:repeat(2,1fr);margin-top:22px}
.support-item{display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:20px 12px;font-weight:600;color:var(--navy)}
.support-item .ico{width:54px;height:54px;flex:none;border-radius:50%;background:var(--blue);color:#fff;display:grid;place-items:center}
.support-item .ico svg{width:28px;height:28px}
.support-item small{font-weight:400;color:var(--muted);font-size:.85rem}
.note-band{margin-top:22px;text-align:center;font-size:1.1rem;font-weight:600;color:var(--navy)}
.quote-band{position:relative;color:#fff;background:var(--navy);isolation:isolate;overflow:hidden}
.quote-band img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 25%;z-index:-2}
.quote-band::after{content:'';position:absolute;inset:0;background:linear-gradient(95deg,rgba(15,39,66,.92) 30%,rgba(15,39,66,.4));z-index:-1}
.quote-band blockquote{margin:0;font-family:Georgia,'Times New Roman',serif;font-style:italic;font-size:clamp(1.7rem,6vw,3rem);line-height:1.2;max-width:16ch}
.quote-band p{margin-top:12px;max-width:50ch}
.country-grid{display:grid;gap:12px;grid-template-columns:repeat(2,1fr)}
.country-link{display:flex;align-items:center;gap:10px;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r);background:#fff;color:var(--text);font-weight:600}
.country-link:hover{border-color:var(--blue);box-shadow:var(--shadow);text-decoration:none;color:var(--blue-dark)}
.country-link .flag{font-size:1.5rem;line-height:1}
.flag-xl{font-size:3rem;line-height:1;margin-bottom:8px;display:block}
.form{display:grid;gap:14px;max-width:640px}
.form label{font-weight:600;color:var(--navy);display:grid;gap:6px;font-size:.95rem}
.form input,.form select,.form textarea{font:inherit;padding:11px 12px;border:1px solid #9aa7b4;border-radius:var(--r);background:#fff;color:var(--text);min-height:44px}
.form textarea{min-height:130px;resize:vertical}
.form .check{display:flex;gap:10px;align-items:flex-start;font-weight:400}
.form .check input{min-height:0;width:20px;height:20px;margin-top:3px}
.form-success {
  margin: 16px 0;
  padding: 12px 16px;
  border-radius: 6px;
  background: #e7f6ec;
  color: #1a6b3c;
  border: 1px solid #b6e2c4;
  font-size: 0.95rem;
}

.form-error {
  margin: 16px 0;
  padding: 12px 16px;
  border-radius: 6px;
  background: #fdecea;
  color: #8a1c1c;
  border: 1px solid #f3c0bc;
  font-size: 0.95rem;
}
.cta{background:var(--blue);color:#fff;text-align:center}
.cta h2{color:#fff}.cta p{max-width:60ch;margin:0 auto 20px}
@media (min-width:640px){
  .grid.cols-2,.grid.cols-3,.grid.cols-4{grid-template-columns:repeat(2,1fr)}
  .steps6{grid-template-columns:repeat(2,1fr)}.trio{grid-template-columns:repeat(3,1fr)}
  .support-grid{grid-template-columns:repeat(3,1fr)}.country-grid{grid-template-columns:repeat(3,1fr)}
  .contact-cards{grid-template-columns:repeat(2,1fr)}
}
@media (min-width:992px){
  .layout{grid-template-columns:minmax(0,1fr) 320px;gap:48px}
  .aside{position:sticky;top:190px}
  .grid.cols-3{grid-template-columns:repeat(3,1fr)}.grid.cols-4{grid-template-columns:repeat(4,1fr)}
  .hero-split{grid-template-columns:minmax(0,1fr) 340px}.hero-split .hero-photo{display:block}
  .split{grid-template-columns:5fr 6fr;gap:44px}
  .steps6{grid-template-columns:repeat(3,1fr)}
  .dest-grid{grid-template-columns:1fr 1fr;gap:48px}
  .support-grid{grid-template-columns:repeat(5,1fr)}.country-grid{grid-template-columns:repeat(4,1fr)}
}
@media (max-width:420px){.hero .actions .btn{width:100%}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
