/* =====================================================================
   PREMIER ABROAD — MASTER THEME  ("Charcoal & Bronze" editorial premium)
   Ground-up rebuild. All components namespaced .pa-* so this coexists
   with the legacy stylesheets until every page is migrated. Loaded LAST.
   Stack: HTML5 + modern CSS (grid/flex/clamp) + light vanilla JS.
===================================================================== */

:root{
    /* Palette — deep navy blue + gold */
    --pa-ink:#0b2545;            /* dark blue (primary dark surfaces + headings) */
    --pa-ink-deep:#071a33;
    --pa-bronze:#c8963e;         /* decorative gold (icons, borders, fills, gold-on-dark) */
    --pa-bronze-deep:#a87b2c;
    --pa-gold-text:#8a641f;      /* darker gold for small text/labels on light (readable) */
    --pa-bg:#f5f8fc;             /* cool light base */
    --pa-bg-2:#e3ecf6;           /* light blue section tint, clearly distinct from white */
    --pa-surface:#ffffff;
    --pa-text:#233044;           /* strong blue-slate body text */
    --pa-muted:#54617a;          /* readable secondary text */
    --pa-line:#dbe4f0;
    --pa-wa:#25d366;
    --pa-wa-deep:#1eb457;

    /* Type — professional sans, no display serif */
    --pa-serif:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
    --pa-sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;

    /* Radius */
    --pa-r-sm:8px;
    --pa-r:14px;
    --pa-r-lg:22px;
    --pa-pill:999px;

    /* Shadow */
    --pa-sh-sm:0 4px 18px rgba(32,33,39,.06);
    --pa-sh:0 14px 40px rgba(32,33,39,.09);
    --pa-sh-lg:0 30px 70px rgba(32,33,39,.14);

    /* Rhythm */
    --pa-max:1200px;
    --pa-gap:clamp(24px,4vw,40px);
    --pa-section:clamp(64px,9vw,120px);

    --pa-ease:.35s cubic-bezier(.22,.61,.36,1);
}

/* ---------- Base (applies globally, theme loads last) ---------- */
body{
    font-family:var(--pa-sans);
    color:var(--pa-text);
    background:var(--pa-bg);
    -webkit-font-smoothing:antialiased;
    text-rendering:optimizeLegibility;
}

.pa h1,.pa h2,.pa h3,.pa h4,
h1.pa,h2.pa{ font-family:var(--pa-serif); }

.pa-container{
    width:100%;
    max-width:var(--pa-max);
    margin-inline:auto;
    padding-inline:clamp(18px,5vw,32px);
}

.pa-section{
    position:relative; overflow:hidden;
    padding-block:var(--pa-section);
    background:linear-gradient(175deg,#ffffff 0%,#fbfdff 100%);
}
.pa-section--tint{
    background:linear-gradient(175deg,var(--pa-bg-2) 0%,#d9e6f4 100%);
}
.pa-section--ink{ background:var(--pa-ink); color:#d9d6cf; }
.pa-section .pa-container,
.pa-section--tint .pa-container{ position:relative; z-index:1; }

/* Contained ambient blob per section -- absolute + overflow:hidden on the
   parent, so it never breaks out of its own section or dims text
   (backgrounds above stay fully opaque; this just adds quiet depth). */
.pa-section::before,
.pa-section--tint::before{
    content:""; position:absolute; z-index:0; pointer-events:none;
    width:420px; height:420px; border-radius:50%;
    top:-140px; right:-100px;
    animation:paDrift 24s ease-in-out infinite;
}
.pa-section::before{ background:radial-gradient(circle,rgba(11,37,69,.05),transparent 70%); }
.pa-section--tint::before{ background:radial-gradient(circle,rgba(200,150,62,.10),transparent 70%); }

/* ---------- Section heading ---------- */
.pa-head{ max-width:660px; margin:0 auto clamp(36px,5vw,60px); text-align:center; }
.pa-head--left{ margin-inline:0; text-align:left; }
.pa-eyebrow{
    display:inline-flex; align-items:center; gap:9px;
    font-family:var(--pa-sans); font-weight:700;
    font-size:12.5px; letter-spacing:.18em; text-transform:uppercase;
    color:var(--pa-gold-text);
}
.pa-eyebrow::before{ content:""; width:26px; height:1.5px; background:var(--pa-bronze); }
.pa-head--center .pa-eyebrow::before{ display:none; }
.pa-title{
    font-family:var(--pa-serif);
    font-weight:600; color:var(--pa-ink);
    font-size:clamp(28px,4.2vw,46px); line-height:1.14;
    letter-spacing:-.01em; margin-top:16px;
}
.pa-section--ink .pa-title{ color:#fff; }
.pa-sub{ margin-top:16px; font-size:clamp(15px,1.4vw,17px); line-height:1.7; color:var(--pa-muted); }
.pa-section--ink .pa-sub{ color:rgba(255,255,255,.68); }

/* ---------- Buttons ---------- */
.pa-btn{
    display:inline-flex; align-items:center; justify-content:center; gap:10px;
    font-family:var(--pa-sans); font-weight:600; font-size:15px;
    padding:15px 26px; border-radius:var(--pa-pill);
    border:1.5px solid transparent; cursor:pointer;
    transition:transform var(--pa-ease),box-shadow var(--pa-ease),background var(--pa-ease),color var(--pa-ease),border-color var(--pa-ease);
}
.pa-btn i{ font-size:17px; }
.pa-btn--wa{ background:var(--pa-wa); color:#fff; box-shadow:0 10px 26px rgba(37,211,102,.28); }
.pa-btn--wa:hover{ background:var(--pa-wa-deep); transform:translateY(-3px); box-shadow:0 16px 34px rgba(37,211,102,.36); }
.pa-btn--ink{ background:var(--pa-ink); color:#fff; }
.pa-btn--ink:hover{ background:var(--pa-ink-deep); transform:translateY(-3px); box-shadow:var(--pa-sh); }
.pa-btn--ghost{ background:transparent; color:var(--pa-ink); border-color:var(--pa-line); }
.pa-btn--ghost:hover{ border-color:var(--pa-bronze); color:var(--pa-bronze); transform:translateY(-3px); }
.pa-btn--gold{ background:var(--pa-bronze); color:#fff; }
.pa-btn--gold:hover{ background:var(--pa-bronze-deep); transform:translateY(-3px); box-shadow:0 14px 30px rgba(192,138,62,.3); }
.pa-section--ink .pa-btn--ghost,
.pa-phero .pa-btn--ghost,
.pa-cta .pa-btn--ghost{ color:#fff; border-color:rgba(255,255,255,.35); }
.pa-section--ink .pa-btn--ghost:hover,
.pa-phero .pa-btn--ghost:hover,
.pa-cta .pa-btn--ghost:hover{ border-color:var(--pa-bronze); color:var(--pa-bronze); background:rgba(255,255,255,.06); }

/* =====================================================================
   HEADER
===================================================================== */
.pa-header{ position:sticky; top:0; z-index:1000; }
.pa-topbar{
    background:var(--pa-ink-deep); color:rgba(255,255,255,.72);
    font-size:13px; letter-spacing:.01em;
}
.pa-topbar .pa-container{ display:flex; justify-content:space-between; align-items:center; height:42px; gap:20px; }
.pa-topbar a{ color:inherit; display:inline-flex; align-items:center; gap:7px; transition:color var(--pa-ease); }
.pa-topbar a:hover{ color:var(--pa-bronze); }
.pa-topbar i{ color:var(--pa-bronze); font-size:12px; }
.pa-topbar__left{ display:flex; align-items:center; }
.pa-topbar__right{ display:flex; gap:22px; }

.pa-nav{
    background:rgba(248,245,239,.86); -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px);
    border-bottom:1px solid var(--pa-line); transition:height var(--pa-ease),box-shadow var(--pa-ease);
}
.pa-nav .pa-container{ display:flex; align-items:center; gap:28px; height:82px; transition:height var(--pa-ease); }
.pa-scrolled .pa-nav{ box-shadow:var(--pa-sh-sm); }
.pa-scrolled .pa-nav .pa-container{ height:66px; }
.pa-logo{ display:flex; align-items:center; flex-shrink:0; }
.pa-logo img{ height:56px; width:auto; transition:height var(--pa-ease); }
.pa-scrolled .pa-logo img{ height:46px; }

.pa-menu{ display:flex; align-items:center; gap:6px; margin-inline:auto; }
.pa-menu>li{ position:relative; }
.pa-menu>li>a{
    display:inline-flex; align-items:center; gap:6px;
    font-weight:500; font-size:15px; color:var(--pa-ink);
    padding:12px 14px; border-radius:var(--pa-r-sm); transition:color var(--pa-ease),background var(--pa-ease);
}
.pa-menu>li>a i{ font-size:10px; opacity:.6; }
.pa-menu>li>a:hover,.pa-menu>li>a.active{ color:var(--pa-bronze); }
.pa-drop{
    position:absolute; top:calc(100% + 8px); left:0; min-width:250px;
    background:var(--pa-surface); border:1px solid var(--pa-line);
    border-radius:var(--pa-r); box-shadow:var(--pa-sh); padding:10px;
    opacity:0; visibility:hidden; transform:translateY(10px);
    transition:all var(--pa-ease);
}
.pa-menu>li:hover .pa-drop{ opacity:1; visibility:visible; transform:translateY(0); }
.pa-drop a{ display:block; padding:11px 14px; border-radius:var(--pa-r-sm); font-size:14.5px; color:var(--pa-text); transition:background var(--pa-ease),color var(--pa-ease); }
.pa-drop a:hover{ background:var(--pa-bg-2); color:var(--pa-bronze); }
.pa-drop a.pa-drop__all{ color:var(--pa-bronze); font-weight:600; }

.pa-nav__cta{ display:flex; align-items:center; gap:12px; flex-shrink:0; }
.pa-burger{ display:none; width:46px; height:46px; border:1px solid var(--pa-line); border-radius:var(--pa-r-sm); background:var(--pa-surface); color:var(--pa-ink); font-size:19px; cursor:pointer; }

/* mobile drawer */
.pa-drawer{ position:fixed; inset:0 0 0 auto; width:min(88%,360px); background:var(--pa-surface); z-index:10001; padding:26px 24px; transform:translateX(100%); transition:transform var(--pa-ease); overflow-y:auto; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; display:flex; flex-direction:column; gap:6px; }
.pa-drawer.open{ transform:translateX(0); }
.pa-drawer__head{ display:flex; justify-content:space-between; align-items:center; margin-bottom:14px; }
.pa-drawer__head img{ height:44px; }
.pa-drawer a{ padding:13px 6px; border-bottom:1px solid var(--pa-line); color:var(--pa-ink); font-weight:500; }
.pa-drawer__cta{ margin-top:18px; display:flex; flex-direction:column; gap:12px; }
.pa-drawer__cta .pa-btn{ width:100%; }
.pa-close{ width:42px; height:42px; border:none; background:var(--pa-bg-2); border-radius:var(--pa-r-sm); font-size:18px; cursor:pointer; }
.pa-overlay{ position:fixed; inset:0; background:rgba(18,19,23,.5); z-index:10000; opacity:0; visibility:hidden; transition:opacity var(--pa-ease); }
.pa-overlay.open{ opacity:1; visibility:visible; }

/* =====================================================================
   HERO
===================================================================== */
.pa-hero{ position:relative; overflow:hidden; background:linear-gradient(160deg,#f7fafd 0%,#e9f0f8 55%,#dde8f4 100%); }
.pa-hero::after{ content:""; position:absolute; top:-10%; right:-6%; width:520px; height:520px; border-radius:50%; background:radial-gradient(circle,rgba(192,138,62,.16),transparent 70%); }
.pa-hero .pa-container{ position:relative; z-index:1; display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(30px,5vw,64px); align-items:center; padding-block:clamp(48px,7vw,90px); }
.pa-hero__copy{ display:flex; flex-direction:column; }
.pa-hero__eyebrow{ display:inline-flex; align-items:center; gap:9px; font-size:12.5px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--pa-gold-text); padding:8px 16px; background:rgba(192,138,62,.14); border:1px solid rgba(192,138,62,.34); border-radius:var(--pa-pill); }
.pa-hero h1{ font-family:var(--pa-serif); font-weight:600; color:var(--pa-ink); font-size:clamp(34px,5.4vw,60px); line-height:1.08; letter-spacing:-.02em; margin:22px 0 18px; }
.pa-hero h1 em{ font-style:italic; color:var(--pa-bronze); }
.pa-hero p{ font-size:clamp(15px,1.5vw,18px); line-height:1.7; color:var(--pa-muted); max-width:520px; }
.pa-hero__btns{ display:flex; flex-wrap:wrap; gap:14px; margin-top:30px; }
.pa-hero__trust{ display:flex; flex-wrap:wrap; gap:22px; margin-top:34px; padding-top:26px; border-top:1px solid var(--pa-line); }
.pa-hero__trust div{ display:flex; align-items:center; gap:9px; font-size:14px; font-weight:500; color:var(--pa-ink); }
.pa-hero__trust i{ color:var(--pa-bronze); }
.pa-hero__media{ position:relative; }
.pa-hero__media img{ width:100%; height:auto; border-radius:var(--pa-r-lg); }
.pa-hero__chip{ position:absolute; background:var(--pa-surface); border:1px solid var(--pa-line); border-radius:var(--pa-r); box-shadow:var(--pa-sh); padding:16px 20px; }
.pa-hero__chip strong{ display:block; font-family:var(--pa-serif); font-size:26px; color:var(--pa-ink); }
.pa-hero__chip span{ font-size:12.5px; color:var(--pa-muted); }
.pa-hero__chip--a{ top:18px; left:-14px; }
.pa-hero__chip--b{ bottom:22px; right:-10px; }
/* Client preference: keep the hero photo clean — no floating stat cards over
   the image. The same figures are shown in the stats strip below the hero. */
.pa-hero__chip{ display:none; }

/* =====================================================================
   TRUST BAR
===================================================================== */
.pa-trust{ background:var(--pa-ink); }
.pa-trust .pa-container{ padding-block:34px; display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:14px 40px; }
.pa-trust__label{ font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:rgba(255,255,255,.5); }
.pa-trust__item{ display:flex; align-items:center; gap:10px; color:#fff; font-family:var(--pa-serif); font-size:19px; }
.pa-trust__item i{ color:var(--pa-bronze); font-size:17px; }
.pa-trust__dot{ width:5px; height:5px; border-radius:50%; background:rgba(255,255,255,.24); }

/* =====================================================================
   STAT STRIP
===================================================================== */
.pa-stats .pa-container{ display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.pa-stat{ text-align:center; padding:14px; }
.pa-stat strong{ display:block; font-family:var(--pa-serif); font-weight:700; font-size:clamp(34px,4.5vw,52px); color:var(--pa-ink); line-height:1; }
.pa-stat span{ display:block; margin-top:10px; font-size:14px; color:var(--pa-muted); }

/* =====================================================================
   CARD GRID (services / why / countries / docs)
===================================================================== */
.pa-grid{ display:grid; gap:clamp(18px,2.4vw,26px); }
.pa-grid--3{ grid-template-columns:repeat(3,1fr); }
.pa-grid--4{ grid-template-columns:repeat(4,1fr); }
.pa-grid--auto{ grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); }

.pa-card{
    position:relative; background:var(--pa-surface);
    border:1px solid var(--pa-line); border-radius:var(--pa-r);
    padding:clamp(26px,3vw,34px); transition:transform var(--pa-ease),box-shadow var(--pa-ease),border-color var(--pa-ease);
    display:flex; flex-direction:column;
}
.pa-card:hover{ transform:translateY(-6px); box-shadow:var(--pa-sh-lg); border-color:rgba(192,138,62,.5); }
.pa-card__icon{
    width:56px; height:56px; display:flex; align-items:center; justify-content:center;
    border-radius:var(--pa-r-sm); background:rgba(192,138,62,.1); color:var(--pa-bronze);
    font-size:23px; margin-bottom:20px;
}
.pa-card h3{ font-family:var(--pa-serif); font-weight:600; font-size:21px; color:var(--pa-ink); line-height:1.25; }
.pa-card p{ margin-top:12px; font-size:14.5px; line-height:1.65; color:var(--pa-muted); flex:1; }
.pa-card__link{ margin-top:20px; display:inline-flex; align-items:center; gap:8px; font-weight:600; font-size:14px; color:var(--pa-ink); transition:gap var(--pa-ease),color var(--pa-ease); }
.pa-card__link i{ font-size:12px; color:var(--pa-bronze); }
.pa-card:hover .pa-card__link{ color:var(--pa-bronze); gap:12px; }

/* country card */
.pa-country{ display:flex; align-items:center; gap:16px; background:var(--pa-surface); border:1px solid var(--pa-line); border-radius:var(--pa-r); padding:20px 22px; transition:transform var(--pa-ease),box-shadow var(--pa-ease),border-color var(--pa-ease); }
.pa-country:hover{ transform:translateY(-4px); box-shadow:var(--pa-sh); border-color:rgba(192,138,62,.5); }
.pa-country__flag{ font-size:34px; line-height:1; }
.pa-country h3{ font-family:var(--pa-serif); font-size:18px; color:var(--pa-ink); }
.pa-country p{ font-size:13px; color:var(--pa-muted); margin-top:3px; }
.pa-country i{ margin-left:auto; color:var(--pa-bronze); font-size:13px; opacity:0; transform:translateX(-6px); transition:all var(--pa-ease); }
.pa-country:hover i{ opacity:1; transform:translateX(0); }

/* =====================================================================
   PROCESS
===================================================================== */
.pa-steps{ display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(18px,2.4vw,26px); counter-reset:step; }
.pa-step{ position:relative; padding-top:20px; }
.pa-step::before{ content:""; position:absolute; top:0; left:0; width:100%; height:2px; background:var(--pa-line); }
.pa-step::after{ content:""; position:absolute; top:-3px; left:0; width:32%; height:8px; border-radius:4px; background:var(--pa-bronze); }
.pa-step__n{ font-family:var(--pa-serif); font-size:15px; font-weight:600; color:var(--pa-bronze); letter-spacing:.1em; }
.pa-step h3{ font-family:var(--pa-serif); font-size:19px; color:var(--pa-ink); margin:12px 0 10px; }
.pa-step p{ font-size:14px; line-height:1.65; color:var(--pa-muted); }

/* =====================================================================
   WHY — split feature layout
===================================================================== */
.pa-why .pa-container{ display:grid; grid-template-columns:.92fr 1.08fr; gap:clamp(34px,5vw,70px); align-items:start; }
.pa-why__main{ display:flex; flex-direction:column; }
.pa-why__media{ position:relative; }
.pa-why__media img{ width:100%; height:auto; border-radius:var(--pa-r-lg); box-shadow:var(--pa-sh); }
.pa-why__badge{ position:absolute; right:-14px; bottom:-16px; background:var(--pa-surface); border:1px solid var(--pa-line); border-radius:var(--pa-r); box-shadow:var(--pa-sh); padding:15px 20px; }
.pa-why__badge strong{ display:block; font-family:var(--pa-serif); font-size:25px; color:var(--pa-ink); line-height:1; }
.pa-why__badge span{ font-size:12px; color:var(--pa-muted); }
/* Client preference: clean images site-wide — no floating stat card over the
   About / why-us photos either (same figures live in the stats strip). */
.pa-why__badge{ display:none; }
.pa-why__list{ display:grid; grid-template-columns:1fr 1fr; gap:22px; }
.pa-feat{ display:flex; gap:14px; }
.pa-feat__ic{ flex-shrink:0; width:44px; height:44px; border-radius:var(--pa-r-sm); background:var(--pa-ink); color:var(--pa-bronze); display:flex; align-items:center; justify-content:center; font-size:17px; }
.pa-feat h4{ font-family:var(--pa-serif); font-size:16.5px; color:var(--pa-ink); }
.pa-feat p{ margin-top:5px; font-size:13.5px; line-height:1.6; color:var(--pa-muted); }

/* =====================================================================
   TESTIMONIALS
===================================================================== */
.pa-quote{ background:var(--pa-surface); border:1px solid var(--pa-line); border-radius:var(--pa-r); padding:32px; position:relative; }
.pa-quote__mark{ font-family:var(--pa-serif); font-size:60px; line-height:.6; color:rgba(192,138,62,.35); }
.pa-quote p{ font-size:15.5px; line-height:1.72; color:var(--pa-text); margin:10px 0 22px; }
.pa-quote__by{ display:flex; align-items:center; gap:13px; }
.pa-quote__av{ width:46px; height:46px; border-radius:50%; background:var(--pa-ink); color:var(--pa-bronze); display:flex; align-items:center; justify-content:center; font-family:var(--pa-serif); font-weight:600; }
.pa-quote__by strong{ display:block; font-size:14.5px; color:var(--pa-ink); }
.pa-quote__by span{ font-size:12.5px; color:var(--pa-muted); }
.pa-quote__stars{ color:var(--pa-bronze); font-size:13px; margin-bottom:6px; }

/* ---------------------------------------------------
   Floating review marquee (right-to-left, continuous)
   CSS-only, transform-driven (GPU compositor, no layout/paint cost).
   Track is rendered twice in the markup (2nd copy aria-hidden) so the
   -50% translateX loops seamlessly with no visible jump or gap.
--------------------------------------------------- */
.pa-marquee{
    width:100%; overflow:hidden; position:relative;
    -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
    mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
}
.pa-marquee__track{
    display:flex; width:max-content; gap:24px;
    padding:6px 12px 26px;
    animation:paMarqueeScroll 30s linear infinite !important;
    animation-duration:30s !important;
    animation-iteration-count:infinite !important;
    will-change:transform;
}
.pa-marquee:hover .pa-marquee__track{ animation-play-state:paused; }
.pa-marquee__item{ flex:0 0 360px; width:360px; }
.pa-marquee__item p{ min-height:96px; }

@keyframes paMarqueeScroll{
    from{ transform:translateX(0); }
    to{ transform:translateX(-50%); }
}

@media (max-width:700px){
    .pa-marquee__item{ flex-basis:300px; width:300px; }
    .pa-marquee__track{ animation-duration:22s !important; }
}

/* Intentionally NOT paused under prefers-reduced-motion: this is a slow,
   low-intensity, hover-pausable review strip (not flashing/parallax), and
   the site's global reduced-motion kill-switch (design-system.css) would
   otherwise silently freeze it via animation-duration:0.001ms !important
   on every element -- common on systems that report reduced motion by
   default (e.g. Windows Server). The !important overrides above on
   .pa-marquee__track specifically keep this one animation running. */

/* =====================================================================
   FAQ
===================================================================== */
.pa-faq__wrap{ max-width:820px; margin-inline:auto; display:flex; flex-direction:column; gap:14px; }
.pa-faq__item{ background:var(--pa-surface); border:1px solid var(--pa-line); border-radius:var(--pa-r); overflow:hidden; transition:border-color var(--pa-ease); }
.pa-faq__item.open{ border-color:rgba(192,138,62,.55); }
.pa-faq__q{ width:100%; text-align:left; background:none; border:none; cursor:pointer; padding:22px 24px; display:flex; justify-content:space-between; align-items:center; gap:18px; font-family:var(--pa-serif); font-size:17px; color:var(--pa-ink); }
.pa-faq__q i{ flex-shrink:0; color:var(--pa-bronze); transition:transform var(--pa-ease); }
.pa-faq__item.open .pa-faq__q i{ transform:rotate(45deg); }
.pa-faq__a{ max-height:0; overflow:hidden; transition:max-height var(--pa-ease); }
.pa-faq__a p{ padding:0 24px 24px; font-size:14.5px; line-height:1.7; color:var(--pa-muted); }

/* =====================================================================
   CTA
===================================================================== */
.pa-cta{ position:relative; overflow:hidden; background:var(--pa-ink); }
.pa-cta::before{ content:""; position:absolute; top:-40%; right:-10%; width:600px; height:600px; border-radius:50%; background:radial-gradient(circle,rgba(192,138,62,.2),transparent 68%); }
.pa-cta .pa-container{ position:relative; text-align:center; padding-block:clamp(60px,8vw,100px); }
.pa-cta h2{ font-family:var(--pa-serif); font-weight:600; color:#fff; font-size:clamp(28px,4.2vw,46px); line-height:1.15; max-width:760px; margin:16px auto 18px; }
.pa-cta p{ color:rgba(255,255,255,.7); max-width:560px; margin:0 auto 32px; font-size:16px; line-height:1.7; }
.pa-cta__btns{ display:flex; flex-wrap:wrap; gap:14px; justify-content:center; }

/* =====================================================================
   FOOTER
===================================================================== */
.pa-footer{ background:var(--pa-ink-deep); color:rgba(255,255,255,.82); }
.pa-footer__top{ display:grid; grid-template-columns:1.6fr 1fr 1fr 1.1fr; gap:clamp(30px,4vw,56px); padding-block:clamp(56px,7vw,84px); }
.pa-footer__brand img{ height:52px; margin-bottom:20px; }
.pa-footer__brand p{ font-size:14.5px; line-height:1.75; max-width:320px; color:rgba(255,255,255,.88); }
.pa-footer__brand .pa-btn{ margin-top:22px; }
.pa-footer h4{ font-family:var(--pa-serif); color:#fff; font-size:17px; margin-bottom:20px; }
.pa-footer ul{ display:flex; flex-direction:column; gap:12px; }
.pa-footer a{ color:rgba(255,255,255,.82); font-size:14px; transition:color var(--pa-ease),padding var(--pa-ease); }
.pa-footer a:hover{ color:var(--pa-bronze); padding-left:4px; }
.pa-footer__contact li{ display:flex; gap:12px; font-size:14px; line-height:1.5; margin-bottom:14px; }
.pa-footer__contact i{ color:var(--pa-bronze); margin-top:3px; }
.pa-footer__bottom{ border-top:1px solid rgba(255,255,255,.1); padding-block:22px; display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap; font-size:13px; }
.pa-footer__social{ display:flex; gap:10px; }
.pa-footer__social a{ width:38px; height:38px; border:1px solid rgba(255,255,255,.16); border-radius:50%; display:flex; align-items:center; justify-content:center; }
.pa-footer__social a:hover{ background:var(--pa-bronze); border-color:var(--pa-bronze); color:#fff; padding:0; }

/* ---------- Floating actions (align legacy buttons to theme) ---------- */
#scrollTop{ background:var(--pa-ink); box-shadow:var(--pa-sh); }
#scrollTop:hover{ background:var(--pa-ink-deep); }

/* =====================================================================
   REVEAL ANIMATION
===================================================================== */
/* Hidden state only applies once JS is active (html.pa-js), so content is
   always visible if JS is disabled or fails to run — nothing gets stuck.
   transition-duration is forced with !important at higher specificity
   than the global reduced-motion kill-switch (design-system.css sets
   transition-duration:0.001ms !important on "*") -- same issue and same
   fix as the review marquee: this is a gentle fade-up on page load, not
   a vestibular hazard, and should play consistently on every page open
   regardless of system-reported motion preference. */
.pa-js .pa-reveal{
    opacity:0; transform:translateY(24px);
    transition:opacity .6s ease,transform .6s ease;
    transition-duration:.6s !important;
}
.pa-js .pa-reveal.in{ opacity:1; transform:none; }

/* Professional heading treatment (Inter) */
.pa-title,.pa-hero h1,.pa-phero h1,.pa-cta h2,.pa-overview__body h2{ font-weight:800; letter-spacing:-.02em; text-wrap:balance; }
.pa-sub,.pa-hero p,.pa-phero p,.pa-cta p{ text-wrap:pretty; }

/* Alignment discipline: centered blocks stay centered, content blocks left */
.pa-head--center,.pa-head--center .pa-title,.pa-head--center .pa-sub{ text-align:center; }
.pa-card,.pa-country,.pa-doc,.pa-step,.pa-feat,.pa-note,.pa-panel,.pa-mcard{ text-align:left; }
.pa-card h3,.pa-country h3,.pa-doc h3,.pa-step h3,.pa-feat h4,.pa-panel h3,.pa-note h3,.pa-related h3,.pa-quote__by strong,.pa-faq__q,.pa-footer h4{ font-weight:700; letter-spacing:-.005em; }
.pa-hero h1 em{ font-style:normal; font-weight:800; }

/* =====================================================================
   DETAIL PAGES (service / country / document / authority)
===================================================================== */

/* Inner hero */
.pa-phero{ position:relative; overflow:hidden; background:var(--pa-ink); color:#fff; }
.pa-phero::after{ content:""; position:absolute; top:-30%; right:-8%; width:520px; height:520px; border-radius:50%; background:radial-gradient(circle,rgba(192,138,62,.22),transparent 68%); }
.pa-phero .pa-container{ position:relative; z-index:1; max-width:840px; padding-block:clamp(46px,7vw,84px); }
.pa-crumb{ display:flex; flex-wrap:wrap; align-items:center; gap:9px; font-size:13px; color:rgba(255,255,255,.5); margin-bottom:20px; }
.pa-crumb a{ color:rgba(255,255,255,.72); transition:color var(--pa-ease); }
.pa-crumb a:hover{ color:var(--pa-bronze); }
.pa-crumb i{ font-size:9px; opacity:.5; }
.pa-phero__tag{ display:inline-block; font-family:var(--pa-sans); font-weight:600; font-size:12px; letter-spacing:.2em; text-transform:uppercase; color:var(--pa-bronze); margin-bottom:16px; }
.pa-phero h1{ font-family:var(--pa-serif); font-weight:600; color:#fff; font-size:clamp(30px,4.6vw,50px); line-height:1.12; letter-spacing:-.015em; }
.pa-phero p{ margin-top:18px; color:rgba(255,255,255,.72); font-size:clamp(15px,1.5vw,18px); line-height:1.7; max-width:660px; }
.pa-phero__btns{ display:flex; flex-wrap:wrap; gap:14px; margin-top:30px; }

/* Overview (text + highlights panel, no image dependency) */
.pa-overview__grid{ display:grid; grid-template-columns:1.15fr .85fr; gap:clamp(30px,5vw,60px); align-items:start; }
.pa-overview__body h2{ font-family:var(--pa-serif); font-weight:600; color:var(--pa-ink); font-size:clamp(25px,3.4vw,38px); line-height:1.18; margin:14px 0 18px; }
.pa-overview__body p{ color:var(--pa-muted); line-height:1.75; margin-bottom:16px; }
.pa-overview__body .pa-hero__btns{ margin-top:26px; }
.pa-panel{ background:var(--pa-surface); border:1px solid var(--pa-line); border-radius:var(--pa-r); box-shadow:var(--pa-sh-sm); padding:clamp(24px,3vw,32px); }
.pa-panel h3{ font-family:var(--pa-serif); font-size:18px; color:var(--pa-ink); margin-bottom:18px; padding-bottom:14px; border-bottom:1px solid var(--pa-line); }
.pa-panel__photo{ border-radius:var(--pa-r-sm); overflow:hidden; margin-bottom:20px; }
.pa-panel__photo img{ width:100%; height:170px; object-fit:cover; display:block; }
.pa-check{ display:flex; flex-direction:column; gap:14px; }
.pa-check li{ display:flex; gap:12px; align-items:flex-start; font-size:14.5px; color:var(--pa-text); line-height:1.5; }
.pa-check i{ color:var(--pa-bronze); margin-top:3px; font-size:14px; }

/* Document checklist */
.pa-doclist{ display:grid; grid-template-columns:1fr 1fr; gap:4px 34px; }
.pa-doc{ display:flex; gap:13px; padding:18px 0; border-bottom:1px solid var(--pa-line); }
.pa-doc i{ color:var(--pa-bronze); margin-top:4px; }
.pa-doc h3{ font-family:var(--pa-serif); font-size:16.5px; color:var(--pa-ink); }
.pa-doc p{ margin-top:4px; font-size:13.5px; color:var(--pa-muted); line-height:1.55; }

/* Note / info aside */
.pa-note{ background:var(--pa-bg-2); border:1px solid var(--pa-line); border-left:3px solid var(--pa-bronze); border-radius:var(--pa-r); padding:clamp(22px,2.6vw,30px); margin-top:34px; }
.pa-note h3{ display:flex; align-items:center; gap:10px; font-family:var(--pa-serif); font-size:18px; color:var(--pa-ink); margin-bottom:12px; }
.pa-note h3 i{ color:var(--pa-bronze); }
.pa-note p{ color:var(--pa-muted); line-height:1.7; font-size:14.5px; }
.pa-note ul{ margin-top:14px; display:grid; gap:10px; }
.pa-note li{ display:flex; gap:10px; align-items:flex-start; font-size:14px; color:var(--pa-text); }
.pa-note li i{ color:var(--pa-bronze); margin-top:4px; font-size:12px; }

/* Mistakes / warning cards (document) */
.pa-mcard{ background:var(--pa-surface); border:1px solid var(--pa-line); border-top:3px solid #d98a2b; border-radius:var(--pa-r); padding:clamp(24px,3vw,32px); transition:transform var(--pa-ease),box-shadow var(--pa-ease); }
.pa-mcard:hover{ transform:translateY(-6px); box-shadow:var(--pa-sh); }
.pa-mcard__ic{ width:48px; height:48px; border-radius:50%; background:#fbeed6; color:#b8791c; display:flex; align-items:center; justify-content:center; font-size:19px; margin-bottom:16px; }
.pa-mcard h3{ font-family:var(--pa-serif); font-size:18px; color:var(--pa-ink); }
.pa-mcard p{ margin-top:10px; font-size:14px; color:var(--pa-muted); line-height:1.6; }
.pa-chips{ display:flex; flex-wrap:wrap; gap:9px; margin-top:22px; }
.pa-chips span{ font-size:12.5px; font-weight:600; color:var(--pa-ink); background:var(--pa-bg-2); border:1px solid var(--pa-line); border-radius:var(--pa-pill); padding:7px 15px; }

/* Facts card (authority) */
.pa-facts{ list-style:none; }
.pa-facts li{ display:flex; justify-content:space-between; gap:16px; padding:13px 0; border-bottom:1px solid var(--pa-line); font-size:14px; }
.pa-facts li:last-child{ border-bottom:none; }
.pa-facts strong{ color:var(--pa-muted); font-weight:500; }
.pa-facts span{ color:var(--pa-ink); font-weight:600; text-align:right; }

/* Related columns (authority) */
.pa-related{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(20px,3vw,34px); }
.pa-related h3{ font-family:var(--pa-serif); font-size:18px; color:var(--pa-ink); margin-bottom:16px; }
.pa-related ul{ display:flex; flex-direction:column; gap:11px; }
.pa-related a{ color:var(--pa-text); font-size:14.5px; display:inline-flex; align-items:center; gap:9px; transition:color var(--pa-ease),gap var(--pa-ease); }
.pa-related a::before{ content:"\2192"; color:var(--pa-bronze); }
.pa-related a:hover{ color:var(--pa-bronze); gap:13px; }

@media(max-width:860px){
    .pa-overview__grid{ grid-template-columns:1fr; }
    .pa-doclist{ grid-template-columns:1fr; }
    .pa-related{ grid-template-columns:1fr; }
}

/* =====================================================================
   CONTACT / FORMS
===================================================================== */
.pa-contact__grid{ display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(30px,5vw,60px); align-items:start; }
.pa-ccard{ display:flex; gap:15px; background:var(--pa-surface); border:1px solid var(--pa-line); border-radius:var(--pa-r); padding:20px 22px; margin-bottom:14px; }
.pa-ccard i{ flex-shrink:0; width:46px; height:46px; border-radius:var(--pa-r-sm); background:var(--pa-ink); color:var(--pa-bronze); display:flex; align-items:center; justify-content:center; font-size:18px; }
.pa-ccard h3{ font-size:15.5px; font-weight:700; color:var(--pa-ink); }
.pa-ccard a,.pa-ccard p{ font-size:14px; color:var(--pa-muted); margin-top:3px; display:block; }
.pa-ccard a:hover{ color:var(--pa-gold-text); }

.pa-form{ background:var(--pa-surface); border:1px solid var(--pa-line); border-radius:var(--pa-r-lg); box-shadow:var(--pa-sh-sm); padding:clamp(26px,3.4vw,40px); }
.pa-form__grid{ display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:16px; }
.pa-form input,.pa-form select,.pa-form textarea{
    width:100%; font-family:var(--pa-sans); font-size:14.5px; color:var(--pa-text);
    background:var(--pa-bg); border:1px solid var(--pa-line); border-radius:var(--pa-r-sm);
    padding:14px 16px; outline:none; transition:border-color var(--pa-ease),box-shadow var(--pa-ease);
}
.pa-form input:focus,.pa-form select:focus,.pa-form textarea:focus{ border-color:var(--pa-bronze); box-shadow:0 0 0 3px rgba(200,150,62,.15); background:var(--pa-surface); }
.pa-form textarea{ resize:vertical; margin-bottom:16px; }
.pa-form .pa-btn{ width:100%; }
.pa-form__errors{ background:#fdecec; border:1px solid #f2b8b8; color:#8f1d1d; border-radius:var(--pa-r-sm); padding:14px 18px; margin-bottom:18px; font-size:14px; }
.pa-form__errors ul{ padding-left:18px; display:grid; gap:6px; list-style:disc; }
@media(max-width:860px){ .pa-contact__grid{ grid-template-columns:1fr; } .pa-form__grid{ grid-template-columns:1fr; } }

/* =====================================================================
   AMBIENT BACKGROUND ANIMATION
   CSS-only, compositor-friendly (transform/opacity). No JS, no images,
   no network, no layout cost -- the page paints immediately; the drift
   runs on the GPU thread. Applied to the gold glows already present on
   the homepage hero, every inner-page hero (.pa-phero) and the CTA, so
   the motion is consistent across the whole site.
===================================================================== */
@keyframes paDrift{ 0%,100%{ transform:translate(0,0) scale(1); } 50%{ transform:translate(-26px,22px) scale(1.1); } }
@keyframes paDrift2{ 0%,100%{ transform:translate(0,0) scale(1); } 50%{ transform:translate(30px,-18px) scale(1.12); } }

.pa-hero::after,
.pa-phero::after,
.pa-cta::before{ animation:paDrift 22s ease-in-out infinite; will-change:transform; }

.pa-hero::before,
.pa-phero::before{ content:""; position:absolute; border-radius:50%; pointer-events:none; z-index:0; animation:paDrift2 27s ease-in-out infinite; will-change:transform; }
.pa-hero::before{ bottom:-20%; left:-8%; width:440px; height:440px; background:radial-gradient(circle,rgba(32,33,39,.06),transparent 70%); }
.pa-phero::before{ bottom:-32%; left:-6%; width:480px; height:480px; background:radial-gradient(circle,rgba(192,138,62,.12),transparent 70%); }

@media (prefers-reduced-motion:reduce){
    .pa-hero::after,.pa-hero::before,
    .pa-phero::after,.pa-phero::before,
    .pa-cta::before,
    .pa-section::before,.pa-section--tint::before{ animation:none; }
}

/* =====================================================================
   RESPONSIVE
===================================================================== */
@media(max-width:1000px){
    .pa-grid--4{ grid-template-columns:repeat(2,1fr); }
    .pa-grid--3{ grid-template-columns:repeat(2,1fr); }
    .pa-steps{ grid-template-columns:repeat(2,1fr); }
    .pa-stats .pa-container{ grid-template-columns:repeat(2,1fr); }
    .pa-why .pa-container{ grid-template-columns:1fr; }
    .pa-footer__top{ grid-template-columns:1fr 1fr; }
}
/* The full desktop nav (logo + 6-item menu + WhatsApp + Free Consultation)
   needs ~1200px to fit; below that the Free Consultation button was pushed
   off-screen and silently clipped by overflow-x:hidden across the whole
   tablet/small-laptop range. Collapse to the burger drawer (which carries
   every link + both CTAs) until the real nav fits — the switch is set a hair
   above the ~1192px content width so a classic 15-17px scrollbar can't clip
   the last button. Standard desktops (>=1280px) keep the approved full nav. */
@media(max-width:1220px){
    .pa-menu,.pa-nav__cta .pa-btn--ink{ display:none; }
    .pa-burger{ display:inline-flex; align-items:center; justify-content:center; }
    /* With the centered menu hidden, nothing was pushing the action cluster
       to the right, so the logo + burger bunched up on the left with dead
       space beside them. Anchor the actions to the far edge like the laptop. */
    .pa-nav__cta{ margin-left:auto; }
}
@media(max-width:860px){
    /* Mobile hero mirrors the laptop: headline first, left-aligned, photo below
       (the photo previously sat on top via order:-1 and buried the message). */
    .pa-hero .pa-container{ grid-template-columns:1fr; text-align:left; }
    .pa-hero p{ margin-inline:0; }
    .pa-hero__eyebrow,.pa-hero__btns,.pa-hero__trust{ justify-content:flex-start; }
    .pa-hero__media{ order:0; max-width:520px; margin:34px auto 0; }
}
@media(max-width:600px){
    .pa-grid--3,.pa-grid--4,.pa-steps,.pa-stats .pa-container,.pa-why__list,.pa-footer__top{ grid-template-columns:1fr; }
    /* Keep the WhatsApp CTA in the header on phones (like the laptop) but as a
       compact icon button so it fits beside the burger instead of shoving it
       off-screen. Tighten the nav gap so logo + WhatsApp + burger sit down to
       320px. font-size:0 drops the "WhatsApp" label; the icon keeps its size. */
    .pa-nav .pa-container{ gap:14px; }
    .pa-nav__cta{ gap:10px; }
    .pa-nav__cta .pa-btn--wa{
        width:46px; height:46px; padding:0; gap:0; font-size:0;
        border-radius:var(--pa-r-sm); box-shadow:0 6px 16px rgba(37,211,102,.30);
    }
    .pa-nav__cta .pa-btn--wa i{ font-size:19px; }
    /* Smaller eyebrow badge sits on one line on common phones (375px+) and
       wraps gracefully (never overflows) on very narrow screens. */
    .pa-hero__eyebrow{ font-size:10px; letter-spacing:.04em; padding:7px 12px; gap:7px; }
    /* Inputs must be >=16px or iOS Safari zooms the page on focus. */
    .pa-form input,.pa-form select,.pa-form textarea{ font-size:16px; }
    .pa-footer__bottom{ flex-direction:column; text-align:center; }
    /* Bigger thumb targets for the footer link columns on phones (desktop
       keeps its compact rhythm). */
    .pa-footer ul{ gap:4px; }
    .pa-footer ul a{ display:inline-block; padding-block:8px; }
    .pa-trust__label{ width:100%; text-align:center; }
    .pa-section::before,.pa-section--tint::before{ width:260px; height:260px; }
    /* Show the full contact row on phones too (phone, email, hours) like the
       laptop — stacked and centered so nothing is cramped or cut off. */
    .pa-topbar .pa-container{ flex-direction:column; align-items:center; height:auto; padding-block:8px; gap:4px; }
    .pa-topbar__left,.pa-topbar__right{ justify-content:center; }
    .pa-topbar__right{ flex-wrap:wrap; gap:3px 16px; }
}
