/* ANB Immigration — P2 production UX/UI & responsive polish */
:root{
  --anb-p2-brand:#0d7d96;
  --anb-p2-ink:#040d15;
  --anb-p2-line:#dde4ea;
  --anb-p2-safe-x:clamp(1rem,4vw,2rem);
}

html,body{max-width:100%;overflow-x:clip}
html{scroll-padding-top:var(--anb-header-height,104px)}
body.spa-app{min-width:320px;background:#fff}
#spa-view{overflow:clip}
#spa-view main{min-width:0}
#spa-view main :where(h1,h2,h3,h4,p,li,dd,dt,a,button,label,span){overflow-wrap:break-word}
#spa-view main :where(h1,h2){text-wrap:balance}
#spa-view main p{text-wrap:pretty}
#spa-view main :where(img,video,svg,canvas){max-width:100%}

/* Consistent interaction geometry across all conversion and discovery routes. */
#spa-view main :where(button,[role="button"],input:not([type="checkbox"]):not([type="radio"]),select,textarea){min-height:44px}
#spa-view main :where(input:not([type="checkbox"]):not([type="radio"]),select,textarea){max-width:100%}
#spa-view main textarea{resize:vertical;min-height:112px}
#spa-view main :where(button,[role="button"]){touch-action:manipulation}
#spa-view main :where(a[class*="px-"],button[class*="px-"]){min-height:44px}
#spa-view main :where(input,select,textarea)::placeholder{opacity:.72}

/* Make cards and forms feel like one product rather than route-specific templates. */
#spa-view main form{min-width:0}
#spa-view main fieldset{min-width:0}
#spa-view main :where(.r5-choice,.course-card-selector,[role="radio"]){min-width:0}
.r5-trust-strip{flex-wrap:wrap}
.r5-trust-strip>span{min-width:0}

/* Tables never force a page-level horizontal scrollbar. */
#spa-view main table{max-width:100%}
#spa-view main :where(.overflow-x-auto,[class*="overflow-x-auto"]){-webkit-overflow-scrolling:touch}

/* Header/mobile navigation polish. */
.anb-topbar{min-height:32px;padding-inline-start:max(.75rem,env(safe-area-inset-left));padding-inline-end:max(.75rem,env(safe-area-inset-right))}
.anb-topbar-phone,.anb-topbar-whatsapp{touch-action:manipulation}
#mobile-menu{
  max-height:calc(100dvh - var(--anb-header-height,104px));
  padding-bottom:env(safe-area-inset-bottom,0px);
}
#mobile-menu-backdrop{height:calc(100dvh - var(--anb-header-height,104px))}
#mobile-menu .anb-mobile-links a{min-height:44px;display:flex;align-items:center}
#mobile-menu .anb-mobile-section>summary{min-height:52px}
#mobile-menu .anb-lang-button{min-height:40px}
#mobile-menu{padding-bottom:calc(1rem + env(safe-area-inset-bottom,0px))}

/* Footer polish: easier scanning, better wrapping and larger tap targets. */
footer a{overflow-wrap:anywhere}
footer a[href]{min-height:32px;display:inline-flex;align-items:center}
footer .anb-footer-contact a{display:inline;color:inherit;text-decoration-thickness:1px;text-underline-offset:3px}
footer .anb-footer-meta{gap:.5rem 1rem;flex-wrap:wrap;text-align:center}

/* Route-level content polish. */
.r7-context-bar,.r7-breadcrumbs{max-width:100%}
.r7-breadcrumbs{overflow-x:auto;scrollbar-width:none}
.r7-breadcrumbs::-webkit-scrollbar{display:none}
.r7-reading-progress{transform:translateZ(0)}

/* Prevent decorative art from becoming a mobile overflow source. */
#spa-view main .fa-globe.text-\[320px\]{font-size:clamp(10rem,52vw,20rem)!important}

@media (max-width:767px){
  /* iOS: 16px controls avoid automatic zoom on focus. */
  #spa-view main :where(input:not([type="checkbox"]):not([type="radio"]),select,textarea){font-size:16px!important}

  /* Consistent mobile typography across legacy route families. */
  #spa-view main h1{font-size:clamp(2rem,9vw,2.75rem)!important;line-height:1.06!important;letter-spacing:-.03em!important}
  #spa-view main h2{font-size:clamp(1.65rem,7vw,2.25rem);line-height:1.12}
  #spa-view main h3{line-height:1.25}

  /* Long CTA copy must wrap instead of stretching 320–375 px screens. */
  #spa-view main a.whitespace-nowrap,
  #spa-view main button.whitespace-nowrap{white-space:normal!important;text-align:center}

  /* Radio/checkbox rows become wrap-safe without changing semantics. */
  #spa-view main form :where(.flex){min-width:0}
  #spa-view main form label{min-width:0}

  /* Slightly tighter global vertical rhythm on small screens. */
  #spa-view main section[class*="py-20"]{padding-top:4rem;padding-bottom:4rem}
  #spa-view main section[class*="py-24"]{padding-top:4.5rem;padding-bottom:4.5rem}
  #spa-view main section[class*="py-28"]{padding-top:4.75rem;padding-bottom:4.75rem}

  footer{margin-top:4rem!important;padding-left:var(--anb-p2-safe-x)!important;padding-right:var(--anb-p2-safe-x)!important}
}

@media (max-width:639px){
  .anb-mainbar-inner{height:68px!important;padding-left:max(.875rem,env(safe-area-inset-left))!important;padding-right:max(.875rem,env(safe-area-inset-right))!important;gap:.75rem!important}
  .anb-mainbar-inner>a:first-child img{height:2.25rem!important;max-width:148px}
  .anb-topbar{padding-left:max(.75rem,env(safe-area-inset-left))!important;padding-right:max(.75rem,env(safe-area-inset-right))!important;gap:.5rem}
  .anb-topbar>div{gap:.5rem!important;min-width:0}
  .anb-topbar-phone{font-size:10px}
  .anb-topbar-whatsapp{font-size:10px!important;padding:.25rem .55rem!important}
  #mobile-menu>.max-w-2xl{padding-left:1rem!important;padding-right:1rem!important;padding-top:1rem!important}
  .anb-mobile-links{padding-left:1.5rem!important}

  /* Footer columns become single-column on phones. */
  footer .anb-footer-links{grid-template-columns:minmax(0,1fr)!important;gap:1.75rem!important}
  footer .anb-footer-meta{justify-content:center!important}

  /* Homepage quick-path cards remain three choices but avoid icon/text collisions. */
  .r3-hero [aria-label="Choisir un parcours"] a{padding:.65rem!important}
  .r3-hero [aria-label="Choisir un parcours"] a>div{align-items:flex-start}
}

@media (max-width:359px){
  .anb-topbar-phone span{display:none}
  .anb-topbar-phone{width:30px;height:30px;justify-content:center;border:1px solid rgba(255,255,255,.28);border-radius:9999px}
  .anb-mainbar-inner>a:first-child img{max-width:132px}
}

@media (min-width:768px) and (max-width:1279px){
  .anb-mainbar-inner{gap:1rem}
}

@media (hover:hover) and (pointer:fine){
  #spa-view main a[class*="rounded-"]:not(.glightbox),
  #spa-view main button[class*="rounded-"]{transition-property:transform,box-shadow,background-color,border-color,color;transition-duration:.18s}
}

@media (prefers-reduced-motion:reduce){
  #spa-view main *,header *,footer *{scroll-behavior:auto!important}
}

/* ========================================================================== 
   CANONICAL DARK HERO COMPONENT SYSTEM (All SPA Routes)
   ========================================================================== */
.r7-breadcrumb-shell:has(+ .dest-hero),
.r7-breadcrumb-shell:has(+ .r7-hero.dest-hero) {
  display: none !important;
}

body[data-r7-template] .dest-hero,
body[data-r7-template] .dest-hero.r7-hero,
.dest-hero.r7-hero,
.dest-hero {
  position: relative !important;
  background-color: #040d15 !important;
  background-image: none !important;
  padding-top: 8.5rem;
  padding-bottom: 3.5rem;
  overflow: hidden !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
@media (min-width: 640px) {
  body[data-r7-template] .dest-hero,
  body[data-r7-template] .dest-hero.r7-hero,
  .dest-hero {
    padding-top: 9.25rem;
    padding-bottom: 4rem;
  }
}
@media (min-width: 1024px) {
  body[data-r7-template] .dest-hero,
  body[data-r7-template] .dest-hero.r7-hero,
  .dest-hero {
    padding-top: 10rem;
    padding-bottom: 4.5rem;
  }
}

body[data-r7-template] .dest-hero:before,
body[data-r7-template] .dest-hero.r7-hero:before,
.dest-hero:before {
  display: none !important;
}

body[data-r7-template] .dest-hero > img.absolute,
.dest-hero > img.absolute {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  z-index: 0 !important;
}

body[data-r7-template] .dest-hero > .dest-hero-overlay,
body[data-r7-template] .dest-hero.r7-hero > .dest-hero-overlay,
.dest-hero > .dest-hero-overlay {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background: linear-gradient(90deg, rgba(4,13,21,.95) 0%, rgba(4,13,21,.82) 48%, rgba(4,13,21,.40) 100%) !important;
  z-index: 1 !important;
  pointer-events: none !important;
}
@media (max-width: 767px) {
  body[data-r7-template] .dest-hero > .dest-hero-overlay,
  body[data-r7-template] .dest-hero.r7-hero > .dest-hero-overlay,
  .dest-hero > .dest-hero-overlay {
    background: linear-gradient(180deg, rgba(4,13,21,.88) 0%, rgba(4,13,21,.96) 100%) !important;
  }
}

body[data-r7-template] .dest-hero > .anb-grid-fade,
body[data-r7-template] .dest-hero.r7-hero > .anb-grid-fade,
.dest-hero > .anb-grid-fade {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  z-index: 2 !important;
  pointer-events: none !important;
}

body[data-r7-template] .dest-hero > .dest-hero-vignette,
body[data-r7-template] .dest-hero.r7-hero > .dest-hero-vignette,
.dest-hero > .dest-hero-vignette {
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  height: 8rem !important;
  background: linear-gradient(to top, #040d15, transparent) !important;
  z-index: 3 !important;
  pointer-events: none !important;
}

body[data-r7-template] .dest-hero > .dest-container,
body[data-r7-template] .dest-hero.r7-hero > .dest-container,
.dest-hero > .dest-container {
  position: relative !important;
  z-index: 10 !important;
}
.dest-hero-title {
  font-family: "Hanken Grotesk", sans-serif;
  font-weight: 600;
  letter-spacing: -.035em;
  line-height: 1.05;
  font-size: clamp(2rem, 5.5vw, 3.75rem);
  color: #ffffff;
  word-break: break-word;
  overflow-wrap: break-word;
}
.dest-hero-desc {
  font-family: Inter, sans-serif;
  color: rgba(255, 255, 255, .82);
  line-height: 1.6;
}
.dest-container {
  width: 100%;
  max-width: 1440px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}
@media (min-width: 640px) {
  .dest-container {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
@media (min-width: 1024px) {
  .dest-container {
    padding-left: 4rem;
    padding-right: 4rem;
  }
}
.anb-kicker { 
  letter-spacing: .18em; 
  text-transform: uppercase; 
  font-size: .72rem; 
  font-weight: 700; 
}
.anb-grid-fade { 
  background-image: linear-gradient(rgba(255,255,255,.055) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.055) 1px, transparent 1px); 
  background-size: 48px 48px; 
}
.anb-card-lift:hover { 
  border-color: rgba(13,125,150,.55); 
}

/* Universal AOS content safety: ensure all content sections and cards are always 100% visible and sharp */
[data-aos],
[data-aos].aos-animate,
.dest-hero [data-aos],
.dest-hero [data-aos].aos-animate {
  opacity: 1 !important;
  transform: none !important;
  visibility: visible !important;
}