/* ===========================================================
   ARCA MEDIA COMPANY — MOBILE (smartphone ≤820px)
   Layer dedicato: non tocca il desktop. Caricato per ultimo.
   - Menu: pillola flottante in basso, SEMPRE visibile
   - Area riservata: solo dentro il menu
   - Logo piccolo · hero home rifatto · card corsi con media
   =========================================================== */

/* slot media dei corsi: nascosto su desktop, attivo su mobile */
.course-media{display:none}

@media (max-width:820px){

/* ---------- NAV: barra snella, logo piccolo ---------- */
.nav{padding:10px 16px !important}
.nav .logo img{height:20px !important}
.nav .logo span{font-size:.82rem !important;letter-spacing:0}
.nav .area-btn{display:none !important}          /* solo nel menu */
.theme-toggle{width:38px !important;height:38px !important;font-size:.95rem !important}

/* ---------- MENU: pillola flottante in basso, sempre visibile ---------- */
.menu-btn{
  position:fixed !important;inset:auto !important;
  left:50% !important;top:auto !important;
  bottom:calc(14px + env(safe-area-inset-bottom,0px)) !important;
  transform:translateX(-50%) !important;
  z-index:1500 !important;
  margin:0 !important;width:auto !important;height:auto !important;
  padding:13px 26px !important;min-height:48px;
  background:rgba(16,9,30,.82) !important;
  border:1.5px solid rgba(186,127,255,.45) !important;
  backdrop-filter:blur(16px) saturate(1.3) !important;
  box-shadow:0 10px 34px rgba(5,2,14,.6),0 0 22px rgba(138,75,255,.35) !important;
  font-size:.95rem !important}
[data-theme="light"] .menu-btn{
  background:rgba(255,255,255,.85) !important;
  border-color:rgba(124,58,237,.4) !important}
.menu-btn .mb-txt{display:inline !important}

/* il fondo pagina non deve finire sotto la pillola */
.footer{padding-bottom:96px !important}

/* ---------- HERO HOME: ordine e respiro ---------- */
.hero{padding-top:56px !important}
.hero-layout{padding-top:14px !important;padding-bottom:44px !important;gap:26px !important}
.hero::before{display:none !important}           /* via il ♛ gigante */
.fx-orbit{display:none !important}               /* niente orbite su schermo piccolo */
.hero .kicker,.page-hero .kicker{
  font-size:.56rem !important;letter-spacing:.22em !important;
  white-space:normal;line-height:1.9}
.hero-title{font-size:clamp(1.7rem,8.6vw,2.2rem) !important;line-height:1.12 !important;margin:12px 0 10px !important}
.hero-tag{font-size:1.02rem !important;line-height:1.5 !important;max-width:30ch;margin-inline:auto}
.hero-sub{font-size:.95rem !important;line-height:1.7 !important;text-align:left !important;margin-top:20px !important}
.hero-chips{justify-content:center;gap:8px !important}
.hero-chips>*{font-size:.78rem !important}
.hero-actions{margin-top:22px !important;gap:10px !important}
.hero-actions .btn{width:100%;justify-content:center;min-height:50px}
.hero-stats{
  display:grid !important;grid-template-columns:repeat(3,1fr) !important;
  gap:10px !important;margin-top:28px !important;padding:0}
.hero-stats div{padding-left:10px !important}
.hero-stats b{font-size:1.02rem !important}
.hero-stats span{font-size:.5rem !important;letter-spacing:.08em !important}
.hero-img{margin-top:26px}
.hero-img img{border-radius:22px}

/* ---------- SEZIONI: meno vuoto, più ritmo ---------- */
.section{padding:52px 0 !important}
.section-head{margin-bottom:26px !important}
.section-head h2{font-size:clamp(1.35rem,6.4vw,1.7rem) !important}
.section-head p{font-size:.92rem !important}
.fx-secpc{font-size:3.6rem !important;right:-4px !important;opacity:.8}
.page-hero h1{font-size:clamp(1.5rem,7.4vw,2rem) !important}
[data-hero-fx].page-hero .fx-ghost{font-size:clamp(2.4rem,15vw,3.6rem) !important;top:70px !important}
.fx-marquee{padding:16px 0}
.fx-marquee span{font-size:.92rem}

/* ---------- ARCADEMY (home): card con spazio media ---------- */
.course-band{
  grid-template-columns:1fr !important;
  padding:16px 16px 20px !important;gap:14px !important;
  border-width:1.5px !important;border-radius:22px !important}
.course-visual{display:none !important}          /* via il glifo enorme */
.course-media{
  display:flex;position:relative;z-index:1;
  aspect-ratio:16/9;width:100%;border-radius:14px;overflow:hidden;
  align-items:center;justify-content:center;flex-direction:column;gap:6px;
  background:
    radial-gradient(90% 120% at 20% 0%,rgba(138,75,255,.28),transparent 55%),
    radial-gradient(80% 100% at 85% 100%,rgba(198,68,255,.18),transparent 60%),
    #140b28;
  border:1px solid rgba(186,127,255,.28)}
.course-media img,.course-media video{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.course-media .cm-piece{
  font-size:3.4rem;line-height:1;color:transparent;
  -webkit-text-stroke:1.5px rgba(200,150,255,.55);
  filter:drop-shadow(0 4px 14px rgba(138,75,255,.4))}
.course-media .cm-play{
  display:inline-flex;align-items:center;gap:7px;
  font-size:.62rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  color:#d9c6ff;background:rgba(16,9,30,.65);border:1px solid rgba(186,127,255,.35);
  border-radius:100px;padding:6px 13px;backdrop-filter:blur(6px)}
.course-media .cm-play::before{content:"▶";font-size:.6rem}
.course-band h3{font-size:1.18rem !important;margin-bottom:8px !important}
.course-band p{font-size:.88rem !important;margin-bottom:12px !important}
.course-band-foot{gap:10px !important}
.course-band-foot .btn{min-height:44px}
.course-price{font-size:1.05rem}
.carousel-arr{width:40px !important;height:40px !important;font-size:1.2rem !important}

/* ---------- CARD & CTA generici: pollici felici ---------- */
.btn,.btn-neon,.area-btn,.add-btn,.checkout-btn{min-height:46px}
.call-card,.case-card,[class*="card"]{border-radius:20px !important}
.contact-form{padding:24px 18px !important;border-radius:20px !important}

/* ---------- footer compatto ---------- */
.footer-grid{gap:22px !important}
.footer h4{margin-bottom:8px !important}
}

/* schermi molto piccoli */
@media (max-width:380px){
.hero-title{font-size:1.55rem !important}
.hero-stats b{font-size:.92rem !important}
.menu-btn{padding:12px 20px !important}
}