/* ============================================================
   Future Career Hub — Shared Stylesheet
   ============================================================ */

/* --- Fonts --- */
@font-face { font-family:'Syne'; src:url('../fonts/Syne-Medium.ttf') format('truetype'); font-weight:500; font-display:swap; }
@font-face { font-family:'Syne'; src:url('../fonts/Syne-SemiBold.ttf') format('truetype'); font-weight:600; font-display:swap; }
@font-face { font-family:'Syne'; src:url('../fonts/Syne-Bold.ttf') format('truetype'); font-weight:700; font-display:swap; }
@font-face { font-family:'Google Sans Flex'; src:url('../fonts/GoogleSansFlex-Regular.ttf') format('truetype'); font-weight:400; font-display:swap; }
@font-face { font-family:'Google Sans Flex'; src:url('../fonts/GoogleSansFlex-Medium.ttf') format('truetype'); font-weight:500; font-display:swap; }

/* --- Reset --- */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; overflow-x:hidden; }
body { font-family:'Google Sans Flex',system-ui,sans-serif; background:#fff; color:#1A1A1A; -webkit-font-smoothing:antialiased; overflow-x:hidden; position:relative; }
img { max-width:100%; height:auto; display:block; }
a { text-decoration:none; color:inherit; }
button { cursor:pointer; font-family:inherit; }
ul { list-style:none; }
::selection { background:#FDEAEC; color:#D81E2C; }

/* --- CSS Variables --- */
:root {
  --red:#D81E2C;
  --red-dark:#9c1119;
  --red-light:#FDEAEC;
  --dark:#1A1A1A;
  --mid:#5A5A5A;
  --muted:#8A8A95;
  --border:rgba(26,26,26,.08);
  --border-red:rgba(216,30,44,.12);
  --bg:#F5F6FA;
  --bg-pink:#FCF4F5;
  --white:#fff;
  --shadow-sm:0 1px 2px rgba(26,26,26,.04);
  --shadow-md:0 12px 30px rgba(26,26,26,.08);
  --shadow-red:0 12px 28px rgba(216,30,44,.28);
  --radius:18px;
  --radius-sm:12px;
  --radius-pill:999px;
  --transition:.25s ease;
  --container:1200px;
  --header-h:88px;
}

/* --- Keyframes --- */
@keyframes pulse { 0%{transform:scale(.7);opacity:.9;} 70%{transform:scale(2.4);opacity:0;} 100%{opacity:0;} }
@keyframes float  { 0%,100%{transform:translateY(0);} 50%{transform:translateY(-10px);} }
@keyframes marquee  { 0%{transform:translateX(0);}  100%{transform:translateX(-50%);} }
@keyframes marquee2 { 0%{transform:translateX(-50%);} 100%{transform:translateX(0);} }
@keyframes spin  { to{transform:rotate(360deg);} }
@keyframes ring  { 0%{transform:scale(.8);opacity:.6;} 100%{transform:scale(2);opacity:0;} }
@keyframes fadeUp { from{opacity:0;transform:translateY(28px);} to{opacity:1;transform:translateY(0);} }
@keyframes fadeIn { from{opacity:0;} to{opacity:1;} }

/* --- Reveal on scroll --- */
.reveal { opacity:0; transform:translateY(30px); transition:opacity .65s ease, transform .65s ease; }
.reveal.visible { opacity:1; transform:translateY(0); }

/* --- Page loader --- */
#fch-loader { position:fixed; inset:0; z-index:99999; background:#fff; display:flex; align-items:center; justify-content:center; transition:opacity .45s ease, visibility .45s ease; }
#fch-loader.fch-loader-hide { opacity:0; visibility:hidden; pointer-events:none; }
.fch-loader-row {
  color:#1A1A1A;
  font-family:'Google Sans Flex',sans-serif;
  font-weight:500;
  font-size:22px;
  display:flex;
  align-items:center;
}
.fch-loader-word {
  display:inline-block;
  padding-left:8px;
  color:#D81E2C;
  font-family:'Syne',sans-serif;
  font-weight:700;
  transition:opacity .25s ease;
}
.fch-loader-dots { display:inline-flex; margin-left:2px; }
.fch-loader-dots span { color:#D81E2C; font-weight:700; opacity:0; animation:fchLoaderDot 1.4s infinite; }
.fch-loader-dots span:nth-child(1) { animation-delay:0s; }
.fch-loader-dots span:nth-child(2) { animation-delay:.2s; }
.fch-loader-dots span:nth-child(3) { animation-delay:.4s; }

/* --- Toast notification --- */
#fch-toast-wrap { position:fixed; top:calc(var(--header-h, 88px) + 18px); left:50%; transform:translateX(-50%); z-index:100000; display:flex; flex-direction:column; align-items:center; gap:10px; pointer-events:none; width:100%; padding:0 16px; }
.fch-toast { pointer-events:auto; display:flex; align-items:center; gap:12px; background:#fff; color:#1A1A1A; border:1px solid rgba(216,30,44,.14); padding:14px 24px 14px 16px; border-radius:999px; box-shadow:0 16px 40px rgba(216,30,44,.16), 0 2px 8px rgba(26,26,26,.08); max-width:min(92vw,440px); opacity:0; transform:translateY(-24px) scale(.96); transition:opacity .35s cubic-bezier(.22,.9,.34,1), transform .35s cubic-bezier(.22,.9,.34,1); }
.fch-toast.fch-toast-show { opacity:1; transform:translateY(0) scale(1); }
.fch-toast-icon { flex-shrink:0; width:26px; height:26px; border-radius:50%; background:#D81E2C; display:flex; align-items:center; justify-content:center; box-shadow:0 4px 10px rgba(216,30,44,.35); }
.fch-toast.fch-toast-error { border-color:rgba(216,30,44,.3); }
.fch-toast-msg { font-size:14px; font-weight:500; line-height:1.4; color:#1A1A1A; }
@media(max-width:480px) { .fch-toast { padding:12px 18px 12px 14px; } .fch-toast-msg { font-size:13px; } }
@keyframes fchLoaderDot { 0%,80%,100% { opacity:0; } 40% { opacity:1; } }
@media (prefers-reduced-motion:reduce) { .fch-loader-dots span { animation-duration:2.8s; } }
@media (max-width:480px) { .fch-loader-row { font-size:18px; } }

/* --- Layout --- */
.container { max-width:var(--container); margin:0 auto; padding:0 32px; }

/* Prevent CSS Grid/Flex items from forcing horizontal overflow via their
   default min-width:auto (causes text/cards to spill past the viewport
   on narrow screens once content can no longer shrink to fit its track). */
.page-hero-grid > div,
.featured-post > *,
.blog-layout > *,
.contact-grid > *,
.about-hero-grid > *,
.about-mission-grid > *,
.dest-grid > *,
.services-grid > *,
.grid-2 > *, .grid-3 > *, .grid-4 > *, .grid-2-3 > *, .grid-3-2 > * {
  min-width:0;
}
.section { padding:88px 0; }
.section-sm { padding:56px 0; }
.section-header { text-align:center; max-width:640px; margin:0 auto 52px; }

/* --- Typography --- */
h1,h2,h3,h4 { font-family:'Syne',sans-serif; letter-spacing:-.015em; line-height:1.1; }
h1 { font-size:clamp(38px,5vw,66px); font-weight:700; }
h2 { font-size:clamp(28px,3.6vw,44px); font-weight:700; }
h3 { font-size:clamp(18px,2vw,22px); font-weight:600; }
h4 { font-size:17px; font-weight:600; }
p { line-height:1.7; color:var(--mid); }
.eyebrow { font-size:13px; font-weight:500; letter-spacing:.07em; text-transform:uppercase; color:var(--red); }
.lead { font-size:17px; line-height:1.75; color:var(--mid); }

/* --- Buttons --- */
.btn { display:inline-flex; align-items:center; gap:8px; padding:14px 26px; border-radius:var(--radius-pill); font-size:15px; font-weight:500; transition:var(--transition); border:none; white-space:nowrap; }
.btn svg { flex-shrink:0; transition:transform .2s; }
.btn:hover svg { transform:translateX(3px); }
.btn-primary { background:var(--red); color:#fff; box-shadow:var(--shadow-red); }
.btn-primary:hover { background:var(--red-dark); transform:translateY(-2px); }
.btn-outline { background:#fff; color:var(--dark); border:1.5px solid var(--border); }
.btn-outline:hover { border-color:var(--dark); }
.btn-dark { background:var(--dark); color:#fff; }
.btn-dark:hover { background:#000; }
.btn-lg { padding:16px 30px; font-size:16px; }

/* --- Badge / Tag --- */
.badge { display:inline-flex; align-items:center; gap:7px; padding:6px 14px; border-radius:var(--radius-pill); font-size:12.5px; font-weight:500; }
.badge-red { background:var(--red-light); color:var(--red); }
.badge-dark { background:var(--dark); color:#fff; }

/* --- Cards --- */
.card { background:#fff; border:1px solid var(--border); border-radius:var(--radius); padding:28px; box-shadow:var(--shadow-sm); transition:transform var(--transition), box-shadow var(--transition); }
.card:hover { transform:translateY(-6px); box-shadow:0 20px 44px rgba(216,30,44,.13); }
.card-icon { width:50px; height:50px; border-radius:13px; display:flex; align-items:center; justify-content:center; margin-bottom:18px; }
.card-icon-red { background:var(--red); color:#fff; box-shadow:0 8px 20px rgba(216,30,44,.35); }
.card-icon-pink { background:var(--red-light); color:var(--red); }

/* --- Section BG variants --- */
.bg-pink { background:linear-gradient(180deg,#FCF4F5 0%,#FFF8F9 100%); border-top:1px solid var(--border-red); border-bottom:1px solid var(--border-red); }
.bg-dark { background:var(--dark); color:#fff; }
.bg-red { background:linear-gradient(150deg,var(--red) 0%,var(--red-dark) 100%); color:#fff; }

/* ===========================
   HEADER / NAV
   =========================== */
#site-header { position:fixed; top:18px; left:0; width:100%; right:auto; z-index:100; display:flex; justify-content:center; padding:0 16px; }
.nav-wrap { width:100%; max-width:1180px; display:flex; align-items:center; justify-content:space-between; gap:16px; background:rgba(255,255,255,.88); backdrop-filter:blur(22px); -webkit-backdrop-filter:blur(22px); border:1px solid var(--border-red); border-radius:var(--radius-pill); padding:9px 9px 9px 20px; box-shadow:0 10px 34px rgba(26,26,26,.08); transition:box-shadow .3s; }
.nav-logo { display:flex; align-items:center; gap:11px; flex-shrink:0; }
.nav-logo img { width:54px; height:54px; border-radius:50%; object-fit:contain; background:#fff; box-shadow:0 4px 12px rgba(216,30,44,.16); }
.nav-logo-text { font-family:'Syne',sans-serif; font-weight:700; font-size:16.5px; letter-spacing:-.01em; color:var(--dark); line-height:1.2; }
.nav-logo-text span { color:var(--red); }
.nav-links { display:flex; align-items:center; gap:2px; }
.nav-link { font-size:14px; font-weight:500; color:var(--dark); padding:8px 12px; border-radius:var(--radius-pill); transition:background var(--transition), color var(--transition); }
.nav-link:hover, .nav-link.active { background:var(--red-light); color:var(--red); }
/* Dropdown */
.nav-dropdown { position:relative; }
.nav-dropdown-btn { display:flex; align-items:center; gap:5px; font-size:14px; font-weight:500; color:var(--dark); background:none; border:none; padding:8px 12px; border-radius:var(--radius-pill); transition:background var(--transition); }
.nav-dropdown-btn:hover, .nav-dropdown-btn.open { background:var(--red-light); color:var(--red); }
.nav-dropdown-btn svg { transition:transform .2s; }
.nav-dropdown-btn.open svg { transform:rotate(180deg); }
.dropdown-menu { display:none; position:absolute; top:calc(100% + 12px); left:50%; transform:translateX(-50%); background:#fff; border:1px solid var(--border); border-radius:20px; box-shadow:0 24px 60px rgba(26,26,26,.14); padding:14px; z-index:200; min-width:260px; }
.dropdown-menu.show { display:block; animation:fadeIn .18s ease; }
.dropdown-grid { display:grid; grid-template-columns:1fr 1fr; gap:3px; }
.dropdown-grid.cols-3 { grid-template-columns:1fr 1fr 1fr; width:520px; }
.dropdown-item { display:flex; align-items:center; gap:9px; padding:9px 10px; border-radius:11px; font-size:13.5px; font-weight:500; color:var(--dark); transition:background var(--transition); }
.dropdown-item:hover { background:var(--red-light); color:var(--red); }
.dropdown-flag { width:28px; height:20px; border-radius:4px; display:flex; align-items:center; justify-content:center; font-family:'Syne',sans-serif; font-weight:700; font-size:9px; color:#fff; letter-spacing:.04em; flex-shrink:0; }
.dropdown-flag-emoji { font-size:22px; line-height:1; flex-shrink:0; width:28px; text-align:center; }
.nav-cta { flex-shrink:0; }
/* Mobile hamburger */
.nav-hamburger { display:none; width:40px; height:40px; border:none; background:transparent; align-items:center; justify-content:center; flex-direction:column; gap:6px; border-radius:10px; cursor:pointer; padding:0; }
.nav-hamburger span { display:block; height:2.5px; background:var(--dark); border-radius:99px; transition:width .25s; }
.nav-hamburger span:nth-child(1) { width:18px; }
.nav-hamburger span:nth-child(2) { width:24px; }
.nav-hamburger span:nth-child(3) { width:14px; }
.nav-hamburger:hover span:nth-child(1) { width:24px; }
.nav-hamburger:hover span:nth-child(2) { width:24px; }
.nav-hamburger:hover span:nth-child(3) { width:24px; }
.nav-mobile { display:flex; position:fixed; top:0; left:0; right:0; bottom:0; background:#fff; z-index:99; overflow-y:auto; padding:100px 24px 40px; flex-direction:column; gap:6px; opacity:0; visibility:hidden; pointer-events:none; transform:translateY(-14px); transition:opacity .3s ease, transform .3s ease, visibility 0s linear .3s; }
.nav-mobile.open { opacity:1; visibility:visible; pointer-events:auto; transform:translateY(0); transition:opacity .3s ease, transform .3s ease, visibility 0s linear 0s; }
.nav-mobile-link { font-size:18px; font-weight:500; color:var(--dark); padding:14px 16px; border-radius:12px; transition:background .2s; border-bottom:1px solid var(--border); }
.nav-mobile-link:hover { background:var(--red-light); color:var(--red); }

/* ===========================
   PAGE HERO (inner pages)
   =========================== */
.page-hero { padding:calc(var(--header-h) + 60px) 0 70px; position:relative; overflow:hidden; }
.page-hero-bg { position:absolute; inset:0; background:linear-gradient(155deg,#fff 0%,#FCF4F5 60%,#FDEAEC 100%); z-index:0; }
.page-hero-blob { position:absolute; top:-120px; right:-80px; width:480px; height:480px; border-radius:50%; background:radial-gradient(circle,rgba(216,30,44,.10),transparent 70%); pointer-events:none; }
.page-hero .container { position:relative; z-index:1; }
.page-hero h1 { margin:16px 0 18px; }
.page-hero p { font-size:17px; max-width:600px; }

/* hero right-side visual grid */
.page-hero-grid { display:grid; grid-template-columns:1.05fr .95fr; gap:40px; align-items:center; }
.hero-visual { position:relative; min-height:380px; display:flex; align-items:center; justify-content:center; }
.hero-visual-main { width:100%; max-width:380px; border-radius:24px; box-shadow:0 30px 70px rgba(216,30,44,.18); position:relative; overflow:hidden; }
.fch-photo-frame img { transition:transform .5s ease; }
.fch-photo-frame:hover img { transform:scale(1.06); }
.hero-float-card { position:absolute; background:#fff; border:1px solid rgba(26,26,26,.07); border-radius:14px; padding:11px 15px; box-shadow:0 14px 34px rgba(26,26,26,.12); display:flex; align-items:center; gap:10px; animation:heroFloat 5s ease-in-out infinite; z-index:2; }
.hero-float-card.alt { animation:heroFloat2 6s ease-in-out infinite; }
.hero-float-icon { width:34px; height:34px; border-radius:9px; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.hero-float-title { font-size:13px; font-weight:600; color:#1A1A1A; line-height:1.2; }
.hero-float-sub { font-size:11px; color:#8A8A95; }
@keyframes heroFloat { 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-12px); } }
@keyframes heroFloat2 { 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(10px); } }
@media(max-width:1100px){ .page-hero-grid{ grid-template-columns:1fr; } .hero-visual{ display:none; } }

/* ===========================
   FOOTER
   =========================== */
#site-footer { background:linear-gradient(160deg,#D81E2C 0%,#9c1119 100%); color:#fff; padding:64px 0 0; }
.footer-grid { display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:40px; padding-bottom:48px; border-bottom:1px solid rgba(255,255,255,.08); }
.footer-brand-logo { display:flex; align-items:center; gap:10px; margin-bottom:14px; }
.footer-brand-logo img { width:44px; height:44px; border-radius:50%; background:#fff; object-fit:contain; }
.footer-brand-name { font-family:'Syne',sans-serif; font-weight:700; font-size:17px; }
.footer-desc { font-size:13.5px; line-height:1.7; color:rgba(255,255,255,.5); max-width:280px; margin-bottom:20px; }
.footer-socials { display:flex; gap:10px; }
.footer-social { width:38px; height:38px; border-radius:10px; background:rgba(255,255,255,.08); color:#fff; display:flex; align-items:center; justify-content:center; transition:background var(--transition); }
.footer-social:hover { background:rgba(255,255,255,.22); }
.footer-col-title { font-family:'Syne',sans-serif; font-weight:600; font-size:14px; margin-bottom:18px; }
.footer-links { display:flex; flex-direction:column; gap:10px; }
.footer-links a { font-size:13.5px; color:rgba(255,255,255,.55); transition:color var(--transition); }
.footer-links a:hover { color:#fff; }
.footer-bottom { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; padding:22px 0; }
.footer-copy { font-size:12.5px; color:rgba(255,255,255,.38); }

/* ===========================
   FLOATING ELEMENTS
   =========================== */
.whatsapp-btn { position:fixed; right:20px; bottom:22px; z-index:90; width:56px; height:56px; border-radius:50%; background:#25D366; display:flex; align-items:center; justify-content:center; box-shadow:0 12px 30px rgba(37,211,102,.45); }
.whatsapp-btn::before { content:''; position:absolute; inset:0; border-radius:50%; background:#25D366; animation:ring 2s ease-out infinite; }
.whatsapp-btn svg { position:relative; }

/* ===========================
   COMMON SECTION COMPONENTS
   =========================== */
/* Stats bar */
.stats-bar { display:flex; gap:0; flex-wrap:wrap; }
.stat-item { flex:1; min-width:120px; text-align:center; padding:28px 20px; border-right:1px solid var(--border); }
.stat-item:last-child { border-right:none; }
.stat-number { font-family:'Syne',sans-serif; font-weight:700; font-size:42px; color:var(--red); line-height:1; }
.stat-label { font-size:13.5px; color:var(--muted); margin-top:6px; }

/* Icon box */
.icon-box { display:flex; align-items:flex-start; gap:16px; }
.icon-box-icon { flex-shrink:0; width:46px; height:46px; border-radius:12px; display:flex; align-items:center; justify-content:center; }

/* Check list */
.check-list { display:flex; flex-direction:column; gap:10px; }
.check-item { display:flex; align-items:flex-start; gap:10px; font-size:14.5px; color:var(--mid); line-height:1.5; }
.check-item-icon { flex-shrink:0; width:22px; height:22px; border-radius:50%; background:var(--red-light); color:var(--red); display:flex; align-items:center; justify-content:center; margin-top:1px; }

/* Marquee */
.marquee-wrap { overflow:hidden; -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent); mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent); }
.marquee-track { display:flex; gap:14px; width:max-content; }
.marquee-fwd { animation:marquee 34s linear infinite; }
.marquee-rev { animation:marquee2 38s linear infinite; }
.marquee-wrap:hover .marquee-track { animation-play-state:paused; }
.marquee-item { flex-shrink:0; display:flex; align-items:center; gap:10px; background:#F4F5F8; border:1px solid rgba(26,26,26,.06); border-radius:14px; padding:14px 24px; white-space:nowrap; }

/* Timeline */
.timeline { position:relative; padding-left:32px; }
.timeline::before { content:''; position:absolute; left:0; top:0; bottom:0; width:2px; background:linear-gradient(to bottom,var(--red),rgba(216,30,44,.0)); }
.timeline-item { position:relative; margin-bottom:44px; }
.timeline-item::before { content:''; position:absolute; left:-38px; top:6px; width:14px; height:14px; border-radius:50%; background:var(--red); border:3px solid #fff; box-shadow:0 0 0 2px var(--red); }
.timeline-year { font-size:12px; font-weight:500; color:var(--red); letter-spacing:.05em; text-transform:uppercase; margin-bottom:6px; }
.timeline-title { font-family:'Syne',sans-serif; font-weight:600; font-size:18px; color:var(--dark); margin-bottom:6px; }
.timeline-desc { font-size:14px; color:var(--mid); line-height:1.65; }

/* Accordion / FAQ */
.accordion { display:flex; flex-direction:column; gap:10px; }
.accordion-item { background:#fff; border:1px solid var(--border); border-radius:var(--radius); overflow:hidden; }
.accordion-btn { width:100%; display:flex; align-items:center; justify-content:space-between; gap:16px; background:none; border:none; padding:20px 24px; text-align:left; font-family:'Syne',sans-serif; font-weight:600; font-size:16px; color:var(--dark); }
.accordion-icon { flex-shrink:0; width:30px; height:30px; border-radius:50%; background:var(--red-light); color:var(--red); display:flex; align-items:center; justify-content:center; transition:transform .25s; }
.accordion-btn.open .accordion-icon { transform:rotate(45deg); }
.accordion-body { display:none; padding:0 24px 20px; font-size:14.5px; line-height:1.65; color:var(--mid); }
.accordion-body.open { display:block; animation:fadeIn .2s ease; }

/* Grid helpers */
.grid-2 { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.grid-3 { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.grid-4 { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.grid-2-3 { display:grid; grid-template-columns:2fr 3fr; gap:48px; align-items:center; }
.grid-3-2 { display:grid; grid-template-columns:3fr 2fr; gap:48px; align-items:center; }

/* CTA Banner */
.cta-banner { background:linear-gradient(150deg,#D81E2C 0%,#9c1119 100%); border-radius:28px; padding:64px; text-align:center; color:#fff; position:relative; overflow:hidden; box-shadow:0 30px 70px rgba(216,30,44,.25); }
.cta-banner::before { content:''; position:absolute; top:-80px; right:-80px; width:320px; height:320px; border-radius:50%; background:radial-gradient(circle,rgba(255,255,255,.15),transparent 70%); }
.cta-banner::after { content:''; position:absolute; bottom:-60px; left:-60px; width:240px; height:240px; border-radius:50%; background:radial-gradient(circle,rgba(255,255,255,.10),transparent 70%); }
.cta-banner > * { position:relative; z-index:1; }
.cta-banner h2 { color:#fff; margin-bottom:14px; }
.cta-banner p { color:rgba(255,255,255,.7); font-size:16px; margin-bottom:30px; max-width:500px; margin-left:auto; margin-right:auto; }

/* Testimonial card */
.testimonial-card { background:#fff; border:1px solid var(--border); border-radius:var(--radius); padding:36px; box-shadow:var(--shadow-sm); }
.stars { display:flex; gap:4px; margin-bottom:16px; }
.testimonial-text { font-family:'Syne',sans-serif; font-size:18px; font-weight:500; color:var(--dark); line-height:1.55; margin-bottom:22px; }
.testimonial-author { display:flex; align-items:center; gap:14px; }
.author-avatar { width:46px; height:46px; border-radius:50%; background:linear-gradient(135deg,#D81E2C,#9c1119); color:#fff; display:flex; align-items:center; justify-content:center; font-family:'Syne',sans-serif; font-weight:700; font-size:17px; flex-shrink:0; }
.author-name { font-weight:500; font-size:15px; color:var(--dark); }
.author-meta { font-size:12.5px; color:var(--muted); margin-top:2px; }

/* Info box */
.info-box { background:var(--red-light); border:1px solid var(--border-red); border-radius:var(--radius); padding:24px 28px; }
.info-box-title { font-family:'Syne',sans-serif; font-weight:600; font-size:15px; color:var(--dark); margin-bottom:8px; }
.info-box-text { font-size:14px; color:var(--mid); line-height:1.6; }

/* Table */
.data-table { width:100%; border-collapse:collapse; }
.data-table th { background:var(--red); color:#fff; padding:13px 18px; text-align:left; font-family:'Syne',sans-serif; font-weight:600; font-size:13.5px; letter-spacing:.02em; }
.data-table th:first-child { border-radius:10px 0 0 0; }
.data-table th:last-child { border-radius:0 10px 0 0; }
.data-table td { padding:13px 18px; border-bottom:1px solid var(--border); font-size:14px; color:var(--mid); }
.data-table tr:last-child td { border-bottom:none; }
.data-table tr:hover td { background:var(--red-light); }

/* ===========================
   SNAP SLIDER UTILITY
   Converts any grid/flex row into a swipeable horizontal carousel on mobile.
   Usage: add class "snap-x" (normal cards) or "snap-x snap-sm" (small cards)
   =========================== */
@media (max-width:768px) {
  .snap-x {
    display:flex !important;
    grid-template-columns:unset !important;
    flex-direction:row !important;
    flex-wrap:nowrap !important;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
    gap:14px !important;
    /* bleed to container edges so first card sits flush */
    padding:4px 20px 16px !important;
    margin-left:-20px !important;
    margin-right:-20px !important;
    scrollbar-width:none;
    /* remove stagger on mobile sliders */
    align-items:stretch !important;
  }
  .snap-x::-webkit-scrollbar { display:none; }
  .snap-x > * {
    flex:0 0 76vw !important;
    max-width:290px !important;
    scroll-snap-align:start;
    width:auto !important;
    margin-top:0 !important;   /* remove stagger */
  }
  /* narrower cards for stats / small items */
  .snap-x.snap-sm > * { flex:0 0 52vw !important; max-width:200px !important; }
  /* fix stat-item borders inside snap slider */
  .snap-x.snap-sm .stat-item { border-right:1px solid var(--border) !important; border-bottom:none !important; }
  /* wider cards for big hero-style cards */
  .snap-x.snap-lg > * { flex:0 0 88vw !important; max-width:360px !important; }

  /* Dot indicators — optional, shown when .snap-dots wrapper present */
  .snap-dots {
    display:flex; justify-content:center; gap:7px; margin-top:14px;
  }
  .snap-dot {
    width:7px; height:7px; border-radius:50%; background:rgba(26,26,26,.18);
    transition:background .2s, transform .2s;
  }
  .snap-dot.active { background:#D81E2C; transform:scale(1.3); }
}

/* ===========================
   RESPONSIVE
   =========================== */

/* --- 1200px: wide tablet / small laptop --- */
@media (max-width:1200px) {
  .container { max-width:100%; padding:0 32px; }
  .page-hero h1 { font-size:clamp(32px,5vw,52px); }
}

/* --- 1024px: tablet landscape --- */
@media (max-width:1024px) {
  .grid-4 { grid-template-columns:repeat(2,1fr); }
  .grid-3 { grid-template-columns:repeat(2,1fr); }
  .grid-2-3,.grid-3-2 { grid-template-columns:1fr; gap:32px; }
  .footer-grid { grid-template-columns:1fr 1fr; gap:32px; }
  .cta-banner { padding:48px 40px; }
  .page-hero { padding:calc(var(--header-h) + 56px) 0 60px; }
}

/* --- 768px: tablet portrait / large mobile --- */
@media (max-width:768px) {
  :root { --header-h:76px; }
  .container { padding:0 20px; }
  .section { padding:60px 0; }

  /* avoid expensive backdrop-filter blur on mobile scroll */
  .nav-wrap { backdrop-filter:none; -webkit-backdrop-filter:none; background:rgba(255,255,255,.97); }

  /* typography */
  h1 { font-size:clamp(28px,8vw,44px); }
  h2 { font-size:clamp(22px,6vw,32px); }
  h3 { font-size:clamp(18px,5vw,24px); }

  /* grids */
  .grid-2,.grid-3,.grid-4,.grid-2-3,.grid-3-2 { grid-template-columns:1fr; gap:20px; }

  /* nav */
  .nav-links,.nav-cta { display:none; }
  .nav-hamburger { display:flex; }

  /* dropdown — force close on mobile (controlled by hamburger menu) */
  .dropdown-menu { position:static; box-shadow:none; border:none; border-top:1px solid var(--border); border-radius:0; padding:8px 0; }

  /* page hero */
  .page-hero { padding:calc(var(--header-h) + 52px) 0 48px; }
  .page-hero h1 { font-size:clamp(26px,7vw,40px); }
  .page-hero p { font-size:15px; }

  /* stats bar */
  .stats-bar { flex-direction:column; }
  .stat-item { border-right:none; border-bottom:1px solid var(--border); padding:20px 0; }
  .stat-item:last-child { border-bottom:none; }

  /* cards */
  .card { padding:24px 20px; }

  /* CTA banner */
  .cta-banner { padding:40px 24px; border-radius:18px; }
  .cta-banner::before,.cta-banner::after { display:none; }

  /* footer */
  .footer-grid { grid-template-columns:1fr; }
  .footer-bottom { flex-direction:column; gap:14px; text-align:center; }

  /* accordion */
  .accordion-header { padding:16px 18px; font-size:15px; }
  .accordion-body { padding:0 18px 16px; }

  /* timeline */
  .timeline { padding-left:20px; }
  .timeline-item { gap:16px; }
  .timeline-item::before { width:14px; height:14px; left:-27px; }

  /* tables — horizontal scroll */
  .data-table-wrap { overflow-x:auto; -webkit-overflow-scrolling:touch; }
  .data-table { min-width:560px; }

  /* contact page */
  .contact-grid { grid-template-columns:1fr !important; }
  .contact-left { border-radius:var(--radius) var(--radius) 0 0 !important; }
  .contact-right { border-radius:0 0 var(--radius) var(--radius) !important; }

  /* about page */
  .about-hero-grid,.about-mission-grid,.about-team-grid { grid-template-columns:1fr !important; }

  /* services page */
  .services-grid,.service-list { grid-template-columns:1fr !important; }

  /* process page */
  .process-steps { padding-left:24px; }
  .process-step-num { width:40px; height:40px; font-size:16px; }

  /* gallery */
  .gallery-grid { columns:2 !important; }

  /* blog */
  .blog-layout { grid-template-columns:1fr !important; }
  .blog-sidebar { position:static !important; }

  /* destinations */
  .dest-grid { grid-template-columns:1fr !important; }
}

/* --- 480px: small mobile --- */
@media (max-width:480px) {
  .container { padding:0 16px; }
  .section { padding:48px 0; }

  /* typography */
  h1 { font-size:clamp(24px,9vw,36px); }
  h2 { font-size:clamp(20px,7vw,28px); }

  /* grids */
  .grid-4 { grid-template-columns:1fr; }

  /* page hero */
  .page-hero { padding:calc(var(--header-h) + 44px) 0 36px; }
  .page-hero h1 { font-size:clamp(22px,9vw,32px); }

  /* nav logo */
  .nav-logo-text { font-size:16px !important; }

  /* buttons */
  .btn { padding:11px 22px; font-size:14px; }
  .btn-lg { padding:14px 28px; font-size:15px; }

  /* hero badge / pill */
  .hero-badge,.badge,.pill { font-size:12px; padding:5px 12px; }

  /* cards */
  .card { padding:20px 16px; }

  /* CTA banner */
  .cta-banner { padding:32px 16px; }
  .cta-banner h2 { font-size:22px; }

  /* footer */
  .footer { padding:40px 0 20px; }
  .footer-logo-text { font-size:18px !important; }

  /* gallery */
  .gallery-grid { columns:1 !important; }

  /* contact quick cards */
  .quick-contact-grid { grid-template-columns:1fr !important; }

  /* stats */
  .stat-num { font-size:36px !important; }
  .stat-label { font-size:13px; }

  /* process tag */
  .process-tag { font-size:12px; padding:4px 10px; }
}

/* --- 375px: very small devices --- */
@media (max-width:375px) {
  .container { padding:0 12px; }
  h1 { font-size:clamp(20px,9vw,28px); }
  .btn,.btn-lg { width:100%; text-align:center; justify-content:center; }
  .nav-logo img { height:32px !important; }
}

/* --- Visa Timeline responsive --- */
@media (max-width:900px) {
  [data-timeline-wrap] {
    grid-template-columns:1fr !important;
    gap:40px !important;
  }
}
@media (max-width:768px) {
  [data-timeline-wrap] {
    padding:0 !important;
  }
  [data-timeline-wrap] > div:first-child {
    text-align:center;
  }
  [data-timeline-wrap] > div:first-child > div {
    justify-content:center !important;
  }
  /* vertical line — shift to align with smaller circles on mobile */
  [data-timeline-wrap] > div:last-child > div[style*="position:absolute"] {
    left:17px !important;
  }
}
@media (max-width:480px) {
  /* make step cards more compact */
  [data-timeline-wrap] > div:last-child > div > div:last-child {
    padding:12px 14px 14px !important;
  }
  /* tighten the section padding */
  section:has([data-timeline-wrap]) {
    padding:56px 20px !important;
  }
}

/* hide floating social on small screens — not enough space */
@media (max-width:600px) {
  [style*="position:fixed;right:18px;top:50%"] { display:none !important; }
}

@media (max-width:600px) {
  .floating-social-widget { display:none !important; }
}

/* prevent header flash / layout jump on page load */
#header-slot { min-height:88px; }
#header-slot:has(#site-header) { min-height:0; }