/* =========================================================
   V65.5 — RESPONSIVE MOBILE / TABLET / LANDSCAPE PATCH
   Surgical UI-only layer. No JS, Supabase or data logic touched.
   ========================================================= */

html{
  width:100%;
  max-width:100%;
  overflow-x:hidden;
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}
body{
  width:100%;
  max-width:100%;
  overflow-x:hidden;
}
img,svg,video,canvas,iframe{
  max-width:100%;
}
button,a,input,select,textarea{
  -webkit-tap-highlight-color:transparent;
}
.inner,
.hero-inner,
.section > *,
.cta > *{
  min-width:0;
}

/* ---------- Public header ---------- */
.header{
  max-width:calc(100vw - 20px);
}
.header .brand{
  min-width:0;
}
.header .brand img{
  display:block;
  max-width:100%;
}
.mobile-menu{
  max-width:calc(100vw - 20px);
  overflow-x:hidden;
}
.mobile-menu a{
  min-width:0;
  overflow-wrap:anywhere;
}

/* ---------- Hero: portrait ---------- */
@media (max-width: 700px){
  .hero{
    width:100%;
    min-height:760px;
    padding-left:16px;
    padding-right:16px;
    overflow:hidden;
  }
  .hero-inner{
    width:100%;
    min-height:680px;
    max-width:100%;
    padding-bottom:4px;
  }
  .hero-meta{
    max-width:100%;
  }
  .hero-meta .meta{
    max-width:100%;
    min-width:0;
    overflow-wrap:anywhere;
  }
  .hero-actions{
    width:100%;
  }
  .hero-actions .btn{
    min-width:0;
    max-width:100%;
  }
  .countdown{
    position:relative;
    right:auto;
    bottom:auto;
    width:100%;
    max-width:100%;
    margin-top:16px;
    padding:15px 12px;
  }
  .countdown-title{
    line-height:1.4;
  }
  .timer{
    width:100%;
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:6px;
  }
  .timer div{
    min-width:0;
    text-align:center;
  }
  .timer b{
    font-size:clamp(22px,7vw,31px);
    line-height:1.05;
  }
  .timer span{
    font-size:7px;
    letter-spacing:.08em;
    white-space:nowrap;
  }
  .remaining,
  .visitor-counter{
    overflow-wrap:anywhere;
  }

  /* Never allow long labels to force the viewport wider */
  .meta,
  .section-intro,
  .programme-highlight span,
  .programme-row-v8 p,
  .ticket-v6,
  .ticket-v6 *,
  .distinction-v8,
  .distinction-v8 *,
  .couple-gallery-card,
  .couple-gallery-card *,
  .testimonials-grid,
  .testimonials-grid *,
  .vote-candidate,
  .vote-candidate *{
    min-width:0;
    max-width:100%;
  }

  .section{
    width:100%;
    max-width:100%;
  }

  .section-title h2,
  .title,
  .heading h2{
    overflow-wrap:anywhere;
    hyphens:auto;
  }

  /* Programme */
  .programme-highlight{
    width:100%;
    max-width:100%;
  }
  .programme-highlight > div{
    min-width:0;
    max-width:100%;
  }
  .programme-highlight span{
    display:block;
    line-height:1.45;
    overflow-wrap:anywhere;
  }
  .programme-preview-item{
    min-width:0;
  }
  .programme-preview-item b,
  .programme-preview-item small{
    overflow-wrap:anywhere;
  }

  /* Ticket cards */
  .ticket-grid-v6{
    width:100%;
  }
  .ticket-v6{
    width:100%;
    min-height:0;
  }
  .ticket-v6 .ticket-head{
    min-width:0;
  }
  .ticket-v6 .ticket-name{
    min-width:0;
  }
  .ticket-v6 .ticket-name h3{
    overflow-wrap:anywhere;
  }

  /* Distinctions */
  .distinction-grid-v8{
    width:100%;
  }
  .distinction-v8{
    width:100%;
  }

  /* Public couple galleries */
  .couple-gallery-public{
    width:100%;
    max-width:100%;
  }
  .couple-gallery-card{
    width:100%;
    max-width:100%;
  }
  .couple-gallery-visual{
    width:100%;
    max-width:100%;
  }
  .couple-gallery-info{
    width:100%;
    max-width:100%;
  }

  /* Modals: fit the actual viewport rather than desktop dimensions */
  .programme-modal,
  .distinction-modal,
  .modal{
    width:100%;
    max-width:100%;
    padding-left:8px;
    padding-right:8px;
  }
  .programme-modal-card,
  .distinction-modal-card,
  .modalbox{
    width:min(100%,720px);
    max-width:100%;
    max-height:calc(100svh - 16px);
    overflow:auto;
    overscroll-behavior:contain;
  }
}

/* ---------- Landscape phones / small tablets ----------
   This is the key correction for the screenshots:
   the original 760px hero min-height forced the 3:2 hero artwork
   to crop aggressively in landscape. */
@media (orientation: landscape) and (max-height: 650px){
  body{
    min-width:0;
  }

  .header{
    top:6px;
    left:10px;
    right:10px;
    height:58px;
    padding:5px 10px 5px 14px;
  }
  .header .brand img{
    width:92px;
    height:48px;
    object-fit:contain;
  }
  .mobile-toggle{
    width:38px;
    height:38px;
    font-size:19px;
  }
  .mobile-menu{
    top:66px;
    left:8px;
    right:8px;
    max-height:calc(100svh - 74px);
    overflow-y:auto;
  }

  #nocesNewsBar{
    margin-top:70px;
  }

  .hero{
    min-height:520px;
    height:auto;
    padding:82px 20px 24px;
    background-position:center center;
  }
  .hero-inner{
    min-height:0;
    height:auto;
    width:min(1100px,100%);
    justify-content:flex-end;
  }
  .hero-meta{
    margin-bottom:12px;
  }
  .hero-meta .meta{
    font-size:9px;
    padding:8px 10px;
  }
  .hero-actions{
    gap:8px;
    margin-bottom:12px;
  }
  .hero-actions .btn{
    width:auto;
    min-width:0;
    padding:10px 15px;
    font-size:10px;
  }
  .countdown{
    position:relative;
    right:auto;
    bottom:auto;
    width:min(520px,100%);
    margin-left:auto;
    margin-top:8px;
    padding:12px;
  }
  .countdown-title{
    font-size:8px;
    margin-bottom:6px;
  }
  .timer{
    gap:10px;
  }
  .timer b{
    font-size:24px;
  }
  .timer span{
    font-size:7px;
  }
  .remaining,
  .visitor-counter{
    font-size:9px;
  }

  .section{
    padding-top:52px;
    padding-bottom:52px;
  }
  .section-title h2,
  .title,
  .heading h2{
    font-size:clamp(30px,5vw,52px);
    line-height:1.05;
  }

  .ticket-v6{
    min-height:0;
  }
  .programme-preview{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .programme-highlight{
    flex-direction:row;
    align-items:center;
    gap:16px;
  }
  .programme-download-btn{
    width:auto;
    flex:0 0 auto;
  }
  .couple-gallery-card{
    grid-template-columns:minmax(0,1.25fr) minmax(180px,.75fr);
  }
  .couple-gallery-visual{
    min-height:250px;
  }

  .programme-modal-card,
  .distinction-modal-card,
  .modalbox{
    max-height:calc(100svh - 12px);
  }
}

/* Very short landscape phones */
@media (orientation: landscape) and (max-height: 430px){
  .header{
    height:52px;
  }
  .header .brand img{
    width:82px;
    height:42px;
  }
  #nocesNewsBar{
    margin-top:62px;
  }
  .hero{
    min-height:450px;
    padding-top:72px;
  }
  .hero-meta .meta{
    font-size:8px;
    padding:6px 8px;
  }
  .hero-actions .btn{
    padding:8px 12px;
  }
  .countdown{
    padding:9px 10px;
  }
  .timer b{
    font-size:20px;
  }
  .section{
    padding-top:42px;
    padding-bottom:42px;
  }
}

/* ---------- Accessibility / interaction stability ---------- */
@media (hover:none){
  .distinction-v8:hover{
    transform:none;
  }
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    scroll-behavior:auto !important;
  }
}

/* =========================================================
   V65.5.1 — PRECISION MOBILE / SMARTPHONE POLISH
   Corrective layer loaded AFTER the original V65.5 styles.
   Desktop/tablet >700px remain untouched.
   No JS / Supabase / reservation / voting logic modified.
   ========================================================= */

@media (max-width:700px){
  /* ---------- Global mobile geometry ---------- */
  html,body{width:100%;max-width:100%;overflow-x:hidden}
  body{min-width:0}
  .inner,.section-inner{width:100%;max-width:100%;min-width:0}
  .section{padding-left:22px;padding-right:22px}
  section[id]{scroll-margin-top:104px}

  /* ---------- Header / NEWS: stable viewport geometry ---------- */
  .header{
    left:12px;right:12px;top:10px;height:68px;
    padding:6px 10px 6px 14px;border-radius:18px;
  }
  .header .brand img{width:118px;height:54px;object-fit:contain}
  .mobile-toggle{width:42px;height:42px;flex:0 0 42px}
  .mobile-menu{left:12px;right:12px;top:82px;max-height:calc(100svh - 94px);overflow:auto}
  #nocesNewsBar{margin-top:78px;width:100%;overflow:hidden}
  .noces-news-inner{min-width:0;width:100%}
  .noces-news-viewport{min-width:0;overflow:hidden}
  .noces-news-track{width:max-content;max-width:none}

  /* ---------- HERO: dedicated portrait composition ----------
     The source hero is 3:2 while a phone is ~9:19.5. Using the
     desktop asset with cover caused the giant title crop seen in CA1.
     A dedicated portrait crop keeps the title/staircase composition
     intact and lets the information panel live in normal flow. */
  .hero{
    min-height:0;height:auto;
    padding:0 14px 22px;
    display:block;
    overflow:hidden;
    background-image:
      linear-gradient(180deg,rgba(10,2,5,.02) 0%,rgba(10,2,5,.04) 52%,rgba(24,7,12,.96) 91%,var(--bg) 100%),
      url("hero-couple-mobile.png");
    background-repeat:no-repeat;
    background-position:center top;
    background-size:100% auto;
    background-color:var(--bg);
  }
  .hero:after{height:170px}
  .hero-inner{
    width:100%;min-height:0;height:auto;
    padding-top:clamp(365px,86vw,500px);
    padding-bottom:0;
    display:flex;flex-direction:column;justify-content:flex-end;
  }
  .hero-meta{
    width:100%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;margin:0 0 10px;
  }
  .hero-meta .meta{
    min-width:0;width:100%;justify-content:flex-start;
    padding:9px 10px;font-size:9px;line-height:1.25;
    overflow:hidden;white-space:normal;
  }
  .hero-meta .meta:last-child{grid-column:1/-1}
  .hero-actions{
    width:100%;display:grid;grid-template-columns:1fr 1fr;gap:8px;
    margin:0 0 10px;
  }
  .hero-actions .btn{
    width:100%;min-width:0;min-height:44px;padding:10px 8px;
    font-size:10px;line-height:1.2;text-align:center;
  }

  /* Countdown is now in-flow: no overlap with venue/meta/buttons. */
  .countdown{
    position:relative;right:auto;bottom:auto;z-index:3;
    width:100%;max-width:none;margin:0;padding:12px 10px;
    border-radius:15px;background:rgba(35,8,14,.82);
    backdrop-filter:blur(14px);
  }
  .countdown-title{font-size:8px;letter-spacing:.15em;margin-bottom:8px;line-height:1.35}
  .timer{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;width:100%}
  .timer>div{min-width:0;padding:8px 2px;border-radius:8px}
  .timer b{font-size:clamp(20px,6.2vw,29px);line-height:1}
  .timer span{display:block;font-size:6.5px;letter-spacing:.07em;white-space:nowrap}
  .remaining{font-size:8px;margin-top:8px}
  .visitor-counter{width:max-content;max-width:100%;margin:8px auto 0;font-size:8px;padding:7px 10px}

  /* ---------- Distinctions: horizontal, swipeable, never vertical ---------- */
  .distinction-grid-v8{
    display:flex!important;flex-wrap:nowrap!important;grid-template-columns:none!important;
    gap:10px;width:calc(100% + 44px);margin-left:-22px;
    overflow-x:auto;overflow-y:hidden;padding:4px 22px 12px;
    scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;
    scrollbar-width:none;
  }
  .distinction-grid-v8::-webkit-scrollbar{display:none}
  .distinction-v8{
    flex:0 0 clamp(154px,39vw,190px);width:auto;min-height:270px;
    padding:12px 10px 13px;border-radius:15px;scroll-snap-align:start;
  }
  .distinction-media{height:86px;margin:-2px 0 9px;border-radius:10px}
  .distinction-v8 .dicon{font-size:22px;margin-bottom:5px}
  .distinction-v8 h3{font-size:15px;line-height:1.08;margin-bottom:6px}
  .distinction-v8 p{font-size:8px;line-height:1.45}
  .distinction-v8 .d-more{margin-top:10px;padding:6px 8px;font-size:6.5px}
  .distinction-v8.featured:after{top:7px;right:7px;font-size:5px;padding:4px 5px}
  .final-note-v8{font-size:9px;line-height:1.6;margin-top:16px}
  .distinction-scoring-note{font-size:9px;line-height:1.6;padding:13px 12px}

  /* ---------- Testimonials: compact horizontal cards ---------- */
  .testimonials-head{margin-bottom:18px}
  .testimonials-head h2{font-size:clamp(29px,8vw,38px);line-height:1.02}
  .testimonials-head p{font-size:10px;line-height:1.6;margin-top:10px}
  .testimonials-grid{
    display:flex!important;flex-wrap:nowrap!important;grid-template-columns:none!important;
    gap:10px;width:calc(100% + 44px);margin-left:-22px;
    overflow-x:auto;overflow-y:hidden;padding:2px 22px 12px;
    scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;
    scrollbar-width:none;
  }
  .testimonials-grid::-webkit-scrollbar{display:none}
  .testimonial-card{
    flex:0 0 clamp(245px,72vw,300px);width:auto;border-radius:15px;
    box-shadow:0 12px 30px rgba(0,0,0,.18);scroll-snap-align:start;
  }
  .testimonial-card video{aspect-ratio:16/9}
  .testimonial-body{padding:10px 11px 12px}
  .testimonial-body h3{font-size:16px;line-height:1.12}
  .testimonial-body p{font-size:9px;line-height:1.5;margin-top:5px}

  /* ---------- Ticketing: three compact cards side-by-side ---------- */
  .ticket-section-head{margin-bottom:18px}
  .ticket-section-head .subline{font-size:10px;line-height:1.55}
  .ticket-grid-v6{
    display:flex!important;flex-wrap:nowrap!important;grid-template-columns:none!important;
    gap:9px;width:calc(100% + 44px);margin-left:-22px;
    overflow-x:auto;overflow-y:hidden;padding:4px 22px 14px;
    scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;
    scrollbar-width:none;
  }
  .ticket-grid-v6::-webkit-scrollbar{display:none}
  .ticket-v6{
    flex:0 0 clamp(158px,39vw,205px);width:auto;min-height:355px;
    padding:15px 11px 12px;border-radius:15px;scroll-snap-align:start;
  }
  .ticket-v6.featured{transform:none}
  .ticket-v6 .ticket-head{gap:7px;align-items:center}
  .ticket-v6 .ticket-icon{width:30px;height:30px;flex-basis:30px;font-size:14px}
  .ticket-v6 .ticket-name small{font-size:6px;letter-spacing:.12em}
  .ticket-v6 .ticket-name h3{font-size:20px;line-height:1.05}
  .ticket-v6 .v6-price{font-size:19px;margin:12px 0 3px;white-space:nowrap}
  .ticket-v6 .v6-price span{font-size:7px}
  .ticket-v6 .tagline{font-size:8px;line-height:1.45;margin-bottom:8px}
  .ticket-v6 .benefits{margin-bottom:8px}
  .ticket-v6 .benefits li{font-size:7.5px;line-height:1.4;margin:6px 0;padding-left:13px}
  .ticket-v6 .benefits li:before{font-size:8px}
  .ticket-v6 .distinction-tags{gap:3px;margin-bottom:8px}
  .ticket-v6 .distinction-tags span{font-size:6px;padding:4px 5px}
  .ticket-v6 .prize-box{padding:8px 8px;margin-bottom:8px;border-radius:8px}
  .ticket-v6 .prize-box strong{font-size:6.5px}
  .ticket-v6 .prize-box p{font-size:6.5px;line-height:1.4}
  .ticket-v6 .ticket-btn{min-height:34px;padding:8px 5px;font-size:8px;border-radius:8px}
  .ticket-note-v6{font-size:8px;line-height:1.55;padding:10px 11px;margin-top:10px}

  /* Keep the special Couples en cheminement card full-width and readable. */
  .cheminement-card{width:100%;min-height:0;margin-top:8px;padding:18px 15px}
  .cheminement-card .ticket-name h3{font-size:23px}
  .cheminement-card .cheminement-copy{font-size:10px;line-height:1.65}
  .cheminement-card .cheminement-points{grid-template-columns:1fr;gap:8px}
  .cheminement-card .ticket-btn{max-width:none}

  /* ---------- Programme: preserve compact vertical rhythm ---------- */
  .programme-highlight{padding:15px 15px;margin-bottom:12px}
  .programme-highlight strong{font-size:20px}
  .programme-preview{grid-template-columns:1fr!important;gap:8px}
  .programme-preview-item{min-height:96px;padding:12px}

  /* ---------- Couple galleries: compact cards ---------- */
  .couple-gallery-public{display:grid;grid-template-columns:1fr!important;gap:10px}
  .couple-gallery-card{min-height:0;border-radius:15px}
  .couple-gallery-visual{min-height:190px}
  .couple-gallery-info{padding:13px}
  .couple-gallery-info h3{font-size:18px}
  .couple-gallery-info p{font-size:9px}
  .couple-gallery-vote{margin-top:10px;padding:9px;font-size:8px}

  /* ---------- Voting: horizontal category tabs instead of wrapping awkwardly ---------- */
  .voting-section .section-inner{min-width:0}
  .voting-stats{grid-template-columns:1fr!important;gap:8px}
  .vote-candidate{grid-template-columns:64px minmax(0,1fr);gap:9px;padding:10px}
  .vote-candidate-photo{width:64px;height:64px}
  .vote-candidate-main strong{font-size:15px}

  /* ---------- Modals ---------- */
  .distinction-modal-card,.programme-modal-card,.modalbox,.vote-modal-card{
    max-width:calc(100vw - 20px);width:calc(100vw - 20px);max-height:calc(100svh - 20px)
  }
}

/* Small phones: tighten without making content microscopic. */
@media (max-width:390px){
  .section{padding-left:16px;padding-right:16px}
  .distinction-grid-v8,.testimonials-grid,.ticket-grid-v6{width:calc(100% + 32px);margin-left:-16px;padding-left:16px;padding-right:16px}
  .hero{padding-left:11px;padding-right:11px}
  .hero-inner{padding-top:clamp(330px,84vw,430px)}
  .hero-meta{gap:6px}
  .hero-meta .meta{font-size:8px;padding:8px 7px}
  .hero-actions{gap:6px}
  .hero-actions .btn{font-size:9px;padding-left:5px;padding-right:5px}
  .countdown{padding:10px 7px}
  .timer{gap:3px}
  .timer>div{padding:7px 1px}
  .timer b{font-size:19px}
  .timer span{font-size:6px}
  .distinction-v8{flex-basis:148px;min-height:258px}
  .testimonial-card{flex-basis:238px}
  .ticket-v6{flex-basis:150px;min-height:340px}
  .ticket-v6 .ticket-name h3{font-size:18px}
  .ticket-v6 .v6-price{font-size:17px}
}

/* Landscape phones: use the original 3:2 hero artwork, but never force portrait height. */
@media (orientation:landscape) and (max-height:650px){
  .hero{
    min-height:0;height:auto;padding:78px 20px 18px;
    background-image:
      linear-gradient(180deg,rgba(15,3,7,.06),rgba(15,3,7,.28)),
      url("hero-couple.png");
    background-position:center center;background-size:cover;background-repeat:no-repeat;
  }
  .hero-inner{min-height:0;padding:300px 0 0;display:flex;justify-content:flex-end}
  .hero-meta{grid-template-columns:repeat(3,minmax(0,1fr));margin-bottom:7px}
  .hero-meta .meta:last-child{grid-column:auto}
  .hero-actions{grid-template-columns:auto auto;width:max-content;max-width:100%;margin-bottom:7px}
  .hero-actions .btn{width:auto;min-height:36px;padding:8px 13px;font-size:9px}
  .countdown{width:min(480px,100%);margin-left:auto;padding:9px 10px}
  .timer b{font-size:21px}
  .timer span{font-size:6px}
  .visitor-counter{margin-top:5px}
}

/* =========================================================
   V65.5.2 — FINAL SMARTPHONE POLISH
   Mobile-only layout refinements requested after field testing.
   Desktop (>700px) is intentionally untouched.
   ========================================================= */

/* Slower NOCES NEWS on every screen. Higher duration = slower reading speed. */
.noces-news-track{animation-duration:110s !important}

@media (max-width:700px){
  /* NOCES NEWS — deliberately slower on small screens */
  .noces-news-track{
    animation-duration:125s !important;
    gap:58px;
  }

  /* PROGRAMME — compact 2-column preview on smartphones.
     The full programme remains available through the existing download/ficha. */
  .programme-preview{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:8px !important;
  }
  .programme-preview-item{
    min-height:112px !important;
    padding:11px 10px !important;
    border-radius:12px;
  }
  .programme-preview-item span{
    font-size:8px !important;
    margin-bottom:6px !important;
  }
  .programme-preview-item b{
    font-size:14px !important;
    line-height:1.12 !important;
    margin-bottom:4px !important;
  }
  .programme-preview-item small{
    font-size:8px !important;
    line-height:1.4 !important;
  }

  /* COUPLES À L'HONNEUR — two compact cards side-by-side.
     Images are kept in a controlled aspect ratio so every smartphone width
     gets the same visual treatment without horizontal overflow. */
  .couple-gallery-public{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:9px !important;
  }
  .couple-gallery-card{
    display:flex !important;
    flex-direction:column !important;
    min-width:0 !important;
    width:100% !important;
    min-height:0 !important;
    border-radius:14px !important;
  }
  .couple-gallery-visual{
    width:100% !important;
    min-height:0 !important;
    aspect-ratio:4/3 !important;
  }
  .couple-gallery-overlay{
    padding:28px 8px 8px !important;
  }
  .couple-gallery-overlay strong{
    font-size:12px !important;
    line-height:1.1 !important;
  }
  .couple-gallery-overlay small{
    font-size:6.5px !important;
  }
  .couple-gallery-controls{
    top:6px !important;
    right:6px !important;
  }
  .couple-gallery-controls button{
    width:25px !important;
    height:25px !important;
    font-size:12px !important;
  }
  .couple-gallery-dots{
    left:7px !important;
    top:8px !important;
  }
  .couple-gallery-info{
    min-width:0 !important;
    padding:9px !important;
    border-top:1px solid rgba(215,174,98,.12) !important;
    border-left:0 !important;
  }
  .couple-gallery-info .kicker-mini{
    font-size:6px !important;
  }
  .couple-gallery-info h3{
    font-size:13px !important;
    line-height:1.1 !important;
    margin:5px 0 !important;
  }
  .couple-gallery-info p{
    font-size:7px !important;
    line-height:1.4 !important;
  }
  .couple-gallery-vote{
    margin-top:7px !important;
    padding:7px 5px !important;
    font-size:7px !important;
    border-radius:7px !important;
  }
  .couple-gallery-share{
    font-size:6.5px !important;
    margin-top:5px !important;
  }

  /* PUBLIC VOTE — three headline counters remain on one line. */
  .voting-stats{
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:6px !important;
  }
  .voting-stat{
    min-width:0 !important;
    padding:11px 5px !important;
    border-radius:11px !important;
  }
  .voting-stat span{
    font-size:6px !important;
    line-height:1.25 !important;
    letter-spacing:.09em !important;
  }
  .voting-stat strong{
    font-size:22px !important;
    line-height:1 !important;
    margin-top:4px !important;
  }

  /* Vote category selector stays horizontal and touch-scrollable. */
  .vote-tabs{
    justify-content:flex-start !important;
    flex-wrap:nowrap !important;
    overflow-x:auto !important;
    width:calc(100% + 32px) !important;
    margin-left:-16px !important;
    padding:2px 16px 8px !important;
    gap:6px !important;
    scrollbar-width:none;
    -webkit-overflow-scrolling:touch;
  }
  .vote-tabs::-webkit-scrollbar{display:none}
  .vote-tab{
    flex:0 0 auto !important;
    white-space:nowrap !important;
    padding:8px 11px !important;
    font-size:8px !important;
  }

  /* Candidate cards: compact two-column information layout. */
  .vote-candidate{
    grid-template-columns:62px minmax(0,1fr) !important;
    gap:8px !important;
    padding:9px !important;
  }
  .vote-candidate-photo{
    width:62px !important;
    height:62px !important;
    border-radius:10px !important;
  }
  .vote-candidate-main strong{
    font-size:14px !important;
    line-height:1.15 !important;
  }
  .vote-candidate-main small{
    font-size:7px !important;
  }
  .vote-candidate-share,
  .vote-candidate-actions{
    grid-column:2 !important;
    text-align:left !important;
  }
  .vote-candidate-share b{font-size:15px !important}
  .vote-candidate-share span{font-size:7px !important}
  .vote-btn{
    padding:9px 10px !important;
    font-size:8px !important;
  }

  /* NOTRE VISION — three compact points side-by-side with horizontal touch scroll. */
  #vision .cards{
    display:flex !important;
    flex-wrap:nowrap !important;
    gap:9px !important;
    width:calc(100% + 32px) !important;
    margin-left:-16px !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    padding:2px 16px 10px !important;
    scroll-snap-type:x proximity;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
  }
  #vision .cards::-webkit-scrollbar{display:none}
  #vision .card{
    flex:0 0 clamp(170px,55vw,220px) !important;
    min-width:0 !important;
    padding:15px 12px !important;
    border-radius:13px !important;
    scroll-snap-align:start;
  }
  #vision .card-number{
    font-size:8px !important;
    margin-bottom:10px !important;
  }
  #vision .card h3{
    font-size:17px !important;
    line-height:1.1 !important;
    margin-bottom:6px !important;
  }
  #vision .card p{
    font-size:8px !important;
    line-height:1.45 !important;
  }

  /* Final mobile typography pass: slightly smaller body copy, preserving headings. */
  .two-col p,
  .two-col .lead,
  .quote p,
  .cta h2,
  .faq-list summary,
  .faq-list p,
  .section-intro,
  .ticket-note-v6,
  .distinction-scoring-note,
  .vote-note{
    font-size:clamp(9px,2.5vw,12px) !important;
    line-height:1.55 !important;
  }
  .cta h2{
    font-size:clamp(25px,7vw,34px) !important;
  }

  /* Keep section headings elegant but prevent oversized text on narrow phones. */
  .section-title h2,
  .title,
  .heading h2{
    font-size:clamp(27px,7.5vw,38px) !important;
    line-height:1.08 !important;
  }
}

@media (max-width:390px){
  .programme-preview-item{min-height:106px !important;padding:10px 8px !important}
  .programme-preview-item b{font-size:13px !important}
  .programme-preview-item small{font-size:7.5px !important}
  .couple-gallery-public{gap:7px !important}
  .couple-gallery-info{padding:8px !important}
  .couple-gallery-info h3{font-size:12px !important}
  .couple-gallery-info p{font-size:6.5px !important}
  .voting-stat{padding:10px 3px !important}
  .voting-stat span{font-size:5.5px !important}
  .voting-stat strong{font-size:20px !important}
  #vision .card{flex-basis:164px !important;padding:13px 10px !important}
  #vision .card h3{font-size:16px !important}
  #vision .card p{font-size:7.5px !important}
}