/* ==========================================================================
   IMCD — Responsive overrides (Android / iOS / tablets)
   Targets: site.css + inline CSS in Landing Page, BTS, Bachelor, Mastere,
            Alternance, Formations, Admissions, Entreprises, Candidature,
            Brochure, Contact
   ========================================================================== */

/* iOS safe-area + smooth touch */
html{
  -webkit-text-size-adjust:100%;
  -webkit-tap-highlight-color:rgba(255,107,0,.15);
}
body{
  overflow-x:hidden;
  text-size-adjust:100%;
}
*{
  -webkit-overflow-scrolling:touch;
}

/* Burger button — injected by mobile.js, hidden on desktop */
.burger{
  display:none;
  width:42px;height:42px;
  background:transparent;border:none;
  align-items:center;justify-content:center;
  cursor:pointer;padding:0;
  position:relative;z-index:30;
}
.burger span{
  display:block;width:22px;height:2px;background:#fff;
  position:absolute;left:10px;border-radius:2px;
  transition:transform .25s ease, top .25s ease, opacity .15s ease;
}
.burger span:nth-child(1){top:14px}
.burger span:nth-child(2){top:20px}
.burger span:nth-child(3){top:26px}
.burger.open span:nth-child(1){top:20px;transform:rotate(45deg)}
.burger.open span:nth-child(2){opacity:0}
.burger.open span:nth-child(3){top:20px;transform:rotate(-45deg)}

/* ============================================================
   TABLET — up to 1024px
   ============================================================ */
@media (max-width:1024px){
  .wrap{padding:0 24px}
  .hero-body{padding-left:24px;padding-right:24px}
  .nav{padding-left:20px;padding-right:24px}

  /* Slight font tighten */
  .hero-title{font-size:42px !important}
  .section-title{font-size:26px}

  /* 4-col grids → 3 cols on tablet */
  .cards-4{grid-template-columns:repeat(2,1fr) !important}
  .formations-grid{grid-template-columns:repeat(2,1fr)}
  .bcards-5{grid-template-columns:repeat(3,1fr)}
  .why-grid{grid-template-columns:repeat(3,1fr)}
  .reasons{grid-template-columns:repeat(3,1fr)}
  .stats-row{grid-template-columns:repeat(2,1fr)}

  /* Why-feat borders : reset for 3-col layout */
  .why-feat{border-right:1px solid rgba(255,255,255,.08)}
  .why-feat:nth-child(3n){border-right:none}

  /* Footer 4col → 2col */
  .footer .wrap{grid-template-columns:1fr 1fr}
}

/* ============================================================
   MOBILE — up to 768px (iPad portrait + phones)
   ============================================================ */
@media (max-width:768px){
  .wrap{padding:0 18px}
  body{font-size:14px}

  /* ===== Nav ===== */
  .nav{padding:14px 18px 0 16px;flex-wrap:wrap;align-items:center;gap:8px}
  .logo,.logo img{width:100px !important}
  .burger{display:flex}
  .nav-links{
    display:none !important;
    flex-direction:column;
    width:100%;
    order:99;
    background:rgba(15,17,20,.98);
    backdrop-filter:blur(8px);
    -webkit-backdrop-filter:blur(8px);
    margin:14px -18px 0 -16px;
    padding:18px 20px;
    gap:4px !important;
    border-top:1px solid rgba(255,255,255,.08);
  }
  .nav-links.open{display:flex !important}
  .nav-links a{
    padding:14px 6px !important;
    font-size:13px !important;
    border-bottom:1px solid rgba(255,255,255,.06);
    opacity:1 !important;
  }
  .nav-links a:last-child{border-bottom:none}
  /* CANDIDATER button next to burger — keep visible but compact */
  .nav > a.btn,
  .nav > .btn{padding:9px 14px !important;font-size:10.5px !important}

  /* ===== Hero ===== */
  .hero{padding-bottom:0 !important}
  .hero-body{
    grid-template-columns:1fr !important;
    padding:20px 18px 32px !important;
    min-height:auto !important;
    gap:0 !important;
  }
  .hero-left{
    padding:24px 0 36px !important;
    max-width:100% !important;
    order:1;
  }
  .hero-title{
    font-size:32px !important;
    line-height:1.08 !important;
    margin-bottom:14px !important;
  }
  .hero-title .gold{display:inline !important;font-size:inherit !important}
  .hero-rule{margin:8px 0 18px !important}
  .hero-lead{font-size:14px !important;line-height:1.55 !important;margin-bottom:18px !important;max-width:100% !important}
  .hero-sub{font-size:13px !important;max-width:100% !important}
  .hero-cta{flex-direction:column;gap:10px !important;margin-bottom:28px !important}
  .hero-cta .btn{width:100%;justify-content:center}

  .hero-feats{
    grid-template-columns:repeat(2,1fr) !important;
    gap:14px !important;max-width:100% !important;
  }

  /* Landing Page right image - bring it to flow */
  .hero-image{
    position:relative !important;
    width:calc(100% + 36px) !important;
    margin:0 -18px;
    height:260px !important;
    order:0;
    top:auto !important;bottom:auto !important;right:auto !important;
  }
  .hero-image::before{display:none !important}
  .hero-image img{filter:none !important}

  /* Inner pages hero-right (image only, no overlay) */
  .hero-right{
    position:relative !important;
    width:calc(100% + 36px) !important;
    margin:0 -18px;
    height:240px !important;
    min-height:0 !important;
    overflow:hidden !important;
    order:0;
  }
  .hero-right::before{display:none !important}
  .hero-right img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

  /* Floating alt-card on hero-right → static at bottom of image */
  .alt-card{
    position:relative !important;
    width:100%;right:auto !important;bottom:auto !important;
    min-width:0 !important;
    margin:0;
    border-radius:0 !important;
    padding:14px 18px !important;
  }
  .alt-card::before{display:none !important}

  /* Parcours card (Landing Page) */
  .parcours-card{
    position:relative !important;
    right:auto !important;bottom:auto !important;
    width:auto;margin:24px 18px 0 !important;
  }

  /* KPI row on inner pages */
  .kpi-row{display:grid !important;grid-template-columns:1fr 1fr;gap:0 !important;margin-bottom:20px !important}
  .kpi{padding:14px 8px !important;border-right:1px solid rgba(255,255,255,.08) !important;border-bottom:1px solid rgba(255,255,255,.08)}
  .kpi:nth-child(2n){border-right:none}
  .kpi:nth-child(n+3){border-bottom:none}

  /* Feature row alternance */
  .feat-row{flex-wrap:wrap;gap:0 !important}
  .feat-row .ft{flex:0 0 50%;padding:14px 8px}

  /* ===== Section spacing ===== */
  section.section{padding:48px 0 44px !important}
  .section-title{font-size:22px !important;letter-spacing:0 !important}
  .section-rule{margin:14px auto 36px !important}

  /* ===== Card grids → 1 col ===== */
  .cards-4,.cards-3,.cards-2,.formations-grid,.bcards-5,
  .cards-row,.cards-row-h{
    grid-template-columns:1fr !important;
    gap:16px !important;
  }
  .card,.bcard,.fcard,.hcard{min-width:0 !important}
  .hcard{grid-template-columns:1fr !important}
  .hcard-ph{min-height:200px !important}
  .card .ph,.bcard .ph{aspect-ratio:16/9 !important}

  /* ===== Why grid ===== */
  .why-grid{grid-template-columns:1fr 1fr !important}
  .why-feat{
    padding:18px 14px !important;
    border-right:1px solid rgba(255,255,255,.08) !important;
    border-bottom:1px solid rgba(255,255,255,.08) !important;
  }
  .why-feat:nth-child(2n){border-right:none !important}
  .why-feat svg{width:42px !important;height:42px !important;margin-bottom:12px !important}
  .why-feat h5{font-size:11.5px !important;margin-bottom:8px !important}
  .why-feat p{font-size:12px !important}

  /* Reasons (alternance) */
  .reasons{grid-template-columns:1fr 1fr !important;gap:12px !important}
  .reason{padding:22px 14px 20px !important}
  .reason svg{width:38px !important;height:38px !important;margin-bottom:14px !important}

  /* ===== Stats ===== */
  .stats-row{grid-template-columns:1fr 1fr !important;gap:0 !important}
  .stat{
    padding:18px 16px !important;
    border-right:1px solid var(--line) !important;
    border-bottom:1px solid var(--line);
  }
  .stat:nth-child(2n){border-right:none !important}
  .stat:nth-last-child(-n+2){border-bottom:none}
  .stat .num{font-size:22px !important}
  .stat .ico{width:38px !important;height:38px !important;flex:0 0 38px !important}
  .stat .ico svg{width:32px !important;height:32px !important}
  .stat .lbl{font-size:10.5px !important}

  /* ===== Process steps (alternance/admissions) ===== */
  .process-grid{display:grid !important;grid-template-columns:1fr !important;gap:18px !important}
  .proc-arr{display:none !important}
  .proc-card-grid{grid-template-columns:1fr !important;gap:32px 0 !important}
  .proc-card{padding:28px 22px !important}

  /* Poles (alternance) */
  .poles{grid-template-columns:1fr !important;gap:24px !important}

  /* Dates key */
  .dates-row{grid-template-columns:1fr 1fr !important;gap:28px 12px !important}
  .dates-row::before{display:none !important}
  .date-step{padding:0 6px}

  /* Search + pieces (admissions) */
  .search-pieces{grid-template-columns:1fr !important;gap:36px !important}
  .pieces-block{grid-template-columns:1fr !important}
  .pieces-block .pr{min-height:200px}

  /* Services (entreprises) */
  .services-block{grid-template-columns:1fr !important;gap:18px !important}
  .services-list{grid-template-columns:1fr !important;gap:22px !important}
  .services-img{min-height:200px}

  /* Trust + logos (entreprises) */
  .trust-block{grid-template-columns:1fr !important;gap:36px !important}
  .logo-wall{grid-template-columns:repeat(2,1fr) !important;gap:20px !important}

  /* ===== Forms (Candidature, Brochure, Contact) ===== */
  .form-wrap,.brochure-grid,.contact-grid{
    grid-template-columns:1fr !important;
    gap:30px !important;
  }
  .form-row,.field-row{grid-template-columns:1fr !important;gap:0 !important}
  .form-card,.contact-form,.brochure-card{padding:24px 20px 26px !important}
  .form-col h2,.contact-form h2,.brochure-card h2{font-size:15px !important;gap:10px !important}

  /* File rows */
  .file-row{flex-wrap:wrap;gap:10px !important}
  .file-row .info{flex:1 1 100%;order:2}
  .file-row .browse{order:3;margin-left:auto}

  /* Radio rows */
  .radio-row{flex-wrap:wrap;gap:12px 18px !important}

  /* Submit button — already full-width but tweak */
  .submit-btn{padding:16px !important;font-size:12px !important}

  /* Reassure row (candidature) */
  .reassure-row{grid-template-columns:1fr !important;padding:0 !important}
  .reassure-item{padding:16px 18px !important;border-right:none !important;border-bottom:1px solid var(--line)}
  .reassure-item:last-child{border-bottom:none}

  /* ===== Map / Campus card (Contact) ===== */
  .map-card{grid-template-columns:1fr !important}
  .map-card .map{min-height:220px}
  .map-card .info{padding:24px 22px !important}

  /* Coord cards (Contact) */
  .coord-card{padding:18px 20px !important;gap:14px !important}
  .coord-card .ico{width:44px !important;height:44px !important;flex:0 0 44px !important}
  .coord-card .value{font-size:16px !important}

  /* Hours */
  .hours{padding:18px 20px !important}

  /* ===== CTA Band ===== */
  .cta-band .wrap{
    grid-template-columns:1fr !important;
    gap:18px !important;text-align:center;
  }
  .cta-portrait{width:100px !important;height:100px !important;margin:0 auto !important}
  .cta-text h3{font-size:17px !important}
  .cta-text p{font-size:13px !important}
  .cta-actions{min-width:0 !important;width:100%}
  .cta-actions .btn{justify-content:center !important;padding:14px 18px !important}

  /* Gold CTA band (admissions) */
  .gold-cta{padding:30px 0 !important}
  .gold-cta::before{width:100% !important;opacity:.18}
  .gold-cta .wrap{grid-template-columns:1fr !important;text-align:center;gap:16px !important}

  /* ===== CTA band (Landing Page) ===== */
  .cta-band .right{flex-direction:column;gap:12px !important}

  /* ===== Testimonials ===== */
  .tst-grid{grid-template-columns:1fr !important;gap:36px !important}

  /* ===== Footer ===== */
  .footer{padding:38px 0 32px !important}
  .footer .wrap{grid-template-columns:1fr !important;gap:30px !important;text-align:left}
  .footer .logo img{width:120px !important}
  .footer h6{font-size:11px !important}

  /* Forms inside Why section (Landing Page) */
  .form-card{padding:24px 20px !important}
  .form-grid{grid-template-columns:1fr !important}
  .form-card .form-grid > *{grid-column:1/-1 !important}

  /* Why grid Landing Page */
  .why-feats{grid-template-columns:1fr !important;gap:22px !important}

  /* Why on Landing inner */
  .why-grid{grid-template-columns:1fr !important;gap:30px !important}
  .why h2{font-size:22px !important}

  /* Buttons everywhere — full width on mobile when alone */
  .btn{padding:12px 16px}
}

/* ============================================================
   SMALL PHONES — up to 480px
   ============================================================ */
@media (max-width:480px){
  .hero-title{font-size:28px !important}
  .section-title{font-size:20px !important}
  .why h2{font-size:20px !important}
  .stats-row{grid-template-columns:1fr !important}
  .stat{border-right:none !important;border-bottom:1px solid var(--line)}
  .stat:last-child{border-bottom:none}
  .reasons{grid-template-columns:1fr !important}
  .reason{border-bottom:none}
  .dates-row{grid-template-columns:1fr !important}
  .logo-wall{grid-template-columns:1fr 1fr !important;gap:18px !important}
  .why-grid{grid-template-columns:1fr !important}
  .why-feat{border-right:none !important;border-bottom:1px solid rgba(255,255,255,.08) !important}
  .why-feat:last-child{border-bottom:none !important}
  .hero-feats{grid-template-columns:1fr !important}
  .kpi-row{grid-template-columns:1fr 1fr !important}
}

/* ============================================================
   iOS notch / safe area
   ============================================================ */
@supports (padding:max(0px)){
  .nav{
    padding-left:max(16px, env(safe-area-inset-left));
    padding-right:max(20px, env(safe-area-inset-right));
  }
  .footer .wrap{
    padding-left:max(18px, env(safe-area-inset-left));
    padding-right:max(18px, env(safe-area-inset-right));
  }
}