/* ======================================================================
   ACCADEMIA DI CHITARRA - OTTIMIZZAZIONE SMARTPHONE / TABLET
   ----------------------------------------------------------------------
   Questo foglio viene caricato PER ULTIMO e interviene solo sotto 1100px.
   La grafica desktop resta invariata.
   ====================================================================== */

/* Evita micro-scroll orizzontali generati da immagini/griglie larghe. */
html,body{max-width:100%;overflow-x:hidden}

/* ----------------------------------------------------------------------
   TABLET / NOTEBOOK COMPATTI
   ---------------------------------------------------------------------- */
@media (max-width:1100px){
  .container{width:min(100% - 36px,980px)}

  /* Header: menu hamburger prima che le molte voci inizino a comprimersi. */
  .header-inner{
    width:calc(100% - 32px);
    min-height:96px;
    height:auto;
    justify-content:space-between;
    gap:16px;
  }
  .site-logo-wrap{margin-left:0!important}
  .site-logo-box{width:88px;height:88px;padding:5px;border-radius:11px}
  .menu-toggle{
    display:grid!important;
    place-items:center;
    width:48px;
    height:48px;
    margin-left:auto;
    border:1px solid rgba(255,255,255,.18);
    border-radius:10px;
    background:rgba(255,255,255,.045);
    color:#fff;
    font-size:27px;
    line-height:1;
  }
  .main-nav{
    display:none;
    position:absolute;
    top:96px;
    left:0;
    right:0;
    margin:0!important;
    padding:14px 16px 18px;
    background:#020d1d;
    border:1px solid rgba(255,255,255,.10);
    border-top:0;
    border-radius:0 0 14px 14px;
    box-shadow:0 20px 34px rgba(0,0,0,.34);
    flex-direction:column;
    align-items:stretch;
    gap:2px;
    z-index:100;
  }
  .main-nav.open{display:flex}
  .main-nav a{
    width:100%;
    padding:12px 14px!important;
    min-height:44px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:8px;
    text-align:center;
  }
  .main-nav a:not(.nav-login):not(.nav-register):after{display:none}
  .nav-login,.nav-register{margin:4px 0 0!important}

  /* Home hero: mantiene due colonne sui tablet orizzontali ma più compatte. */
  .home-hero-grid{width:100%;grid-template-columns:52% 48%;min-height:360px}
  .home-hero-copy{padding:50px 18px 44px 5vw}
  .home-hero-copy h1{font-size:clamp(36px,4.2vw,44px)}
  .home-hero-photo{min-height:360px}

  .home-course-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
  .home-course-image{height:160px}
  .home-course-card{min-height:295px}
  .home-course-body p{min-height:0}

  .home-feature-grid{grid-template-columns:repeat(3,1fr);gap:0}
  .home-feature{padding:20px 18px;border-bottom:1px solid rgba(255,255,255,.15)}
  .home-feature:nth-child(3){border-right:0}
  .home-feature:nth-child(4),.home-feature:nth-child(5){border-bottom:0}
  .home-feature:nth-child(5){grid-column:2}

  /* Dashboard e admin: sidebar orizzontale, contenuto a tutta larghezza. */
  .dashboard-shell{grid-template-columns:1fr;min-height:0}
  .sidebar{
    position:sticky;
    top:96px;
    z-index:35;
    display:flex;
    align-items:center;
    gap:6px;
    overflow-x:auto;
    overscroll-behavior-x:contain;
    scrollbar-width:thin;
    padding:10px 14px;
    border-right:0;
    border-bottom:1px solid rgba(255,255,255,.08);
    -webkit-overflow-scrolling:touch;
  }
  .sidebar-title{display:none}
  .sidebar a{flex:0 0 auto;white-space:nowrap;margin:0;padding:10px 12px}
  .content{padding:28px 24px}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
  .split{grid-template-columns:1fr}
  .video-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .quick-admin-grid{grid-template-columns:1fr!important}
  .course-buy-box,.lesson-course-sidebar{position:static!important;max-height:none!important}

  /* Tabelle: swipe orizzontale solo dentro il contenitore. */
  .table-wrap{
    width:100%;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    border-radius:8px;
  }
  .table{min-width:700px}

  /* Pagine pubbliche */
  .public-hero-grid{gap:34px}
  .about-pillar-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* ----------------------------------------------------------------------
   TABLET PORTRAIT / SMARTPHONE GRANDI
   ---------------------------------------------------------------------- */
@media (max-width:860px){
  .container{width:calc(100% - 32px)}
  .header-inner{min-height:88px;width:calc(100% - 28px)}
  .site-logo-box{width:80px;height:80px}
  .main-nav{top:88px;left:-14px;right:-14px}
  .sidebar{top:88px}

  /* Hero verticale: testo prima, immagine sotto. */
  .home-hero-grid{grid-template-columns:1fr;min-height:0}
  .home-hero-copy{
    padding:48px max(24px,7vw) 34px;
    text-align:center;
  }
  .home-hero-copy h1{
    font-size:clamp(38px,7vw,50px);
    line-height:1.06;
    max-width:680px;
    margin-left:auto;
    margin-right:auto;
  }
  .home-hero-copy p{font-size:15px;max-width:620px;margin-left:auto;margin-right:auto}
  .home-hero-copy .desktop-only{display:none}
  .hero-main-btn{margin:0 auto;min-width:210px}
  .home-hero-photo{min-height:360px;max-height:430px}
  .home-hero-photo:before{background:linear-gradient(180deg,#031328 0%,rgba(3,19,40,.20) 20%,transparent 55%)}
  .home-hero-photo img{object-position:center center;transform:none}

  .home-courses{padding:30px 0 34px}
  .home-section-title{gap:18px}
  .home-section-title span{width:42px}
  .home-section-title h2{font-size:18px;text-align:center}

  .home-feature-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .home-feature:nth-child(n){grid-column:auto;border-right:1px solid rgba(255,255,255,.18);border-bottom:1px solid rgba(255,255,255,.14)}
  .home-feature:nth-child(2n){border-right:0}
  .home-feature:last-child{grid-column:1/-1;border-right:0;border-bottom:0}

  /* Parte finale Home */
  .student-section{grid-template-columns:1fr!important;padding:28px max(20px,5vw) 34px!important;gap:24px!important}
  .student-photo{width:min(720px,100%);min-height:300px;margin:0 auto;border-radius:16px}
  .student-copy{width:min(720px,100%);max-width:none!important;margin:0 auto;padding:4px!important;text-align:center}
  .student-copy ul{display:inline-block;text-align:left;max-width:620px}
  .student-actions{justify-content:center}

  .journey-card{width:calc(100% - 32px)!important;grid-template-columns:1fr!important;gap:12px!important;padding:26px 22px 30px!important;text-align:center}
  .journey-logo-box{width:210px!important;height:165px!important;margin:0 auto!important}
  .journey-divider{display:none!important}
  .journey-copy{padding:0!important;justify-self:center!important;max-width:620px!important}
  .journey-button{margin:0 auto;min-width:0;width:min(100%,420px)!important}

  .compact-footer{width:calc(100% - 32px)!important;grid-template-columns:1fr!important;justify-items:center!important;text-align:center!important;gap:14px!important}
  .footer-copy,.footer-links{justify-self:center!important;text-align:center!important}
  .footer-links{justify-content:center!important;flex-wrap:wrap}

  /* Recensioni */
  .testimonial-grid,.reviews-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .testimonial-card{height:100%}

  /* Pagine corsi / area utente */
  .student-course-grid{grid-template-columns:1fr!important}
  .course-detail-grid,.lesson-view-layout{grid-template-columns:1fr!important}
  .course-detail-hero{grid-template-columns:1fr!important}
  .course-detail-cover{min-height:260px}
  .lesson-bottom-actions{grid-template-columns:1fr!important}
  .lesson-bottom-actions>div:last-child{text-align:left!important}
  .student-material-grid{grid-template-columns:1fr!important}

  /* Form */
  .form-row,.contact-form-row{grid-template-columns:1fr!important}
  .auth-wrap{padding:42px 16px;min-height:calc(100vh - 88px)}
  .auth-card{width:min(620px,100%);padding:28px 26px 32px}
  .auth-card>img{width:180px!important;height:180px!important;margin:0 auto 12px!important}

  .setup-shell{grid-template-columns:1fr;gap:22px;padding:30px 0}
  .setup-logo-box img{width:260px!important;height:260px!important;max-width:100%!important}
  .setup-card{padding:28px}

  /* Admin */
  .admin-title-row,.panel-heading-flex,.course-status-row{align-items:flex-start!important;flex-direction:column!important;gap:10px}
  .course-create-grid,.lesson-upload-grid{grid-template-columns:1fr!important}
  .lesson-desc-field,.lesson-file-field,.lesson-options{grid-column:1!important}
  .materials-admin-split{grid-template-columns:1fr!important}
}

/* ----------------------------------------------------------------------
   SMARTPHONE
   ---------------------------------------------------------------------- */
@media (max-width:620px){
  :root{--mobile-gutter:16px}
  .container{width:calc(100% - (var(--mobile-gutter) * 2))}

  .header-inner{width:calc(100% - 24px);min-height:80px}
  .site-logo-box{width:70px;height:70px;padding:4px;border-radius:9px}
  .menu-toggle{width:44px;height:44px;font-size:24px}
  .main-nav{top:80px;left:-12px;right:-12px;padding:12px}
  .sidebar{top:80px;padding:8px 12px}
  .sidebar a{padding:9px 11px;font-size:12px}

  /* Tipografia / pulsanti touch-friendly */
  .btn{min-height:44px;padding:12px 16px;font-size:12px}
  .btn-sm{min-height:40px;padding:10px 12px}
  input.form-control,select.form-control,textarea.form-control,input,select,textarea{font-size:16px}

  .home-hero-copy{padding:38px 18px 28px}
  .home-hero-copy h1{font-size:clamp(34px,10vw,43px);letter-spacing:-1px}
  .home-hero-copy p{font-size:14px;line-height:1.6}
  .hero-main-btn{width:min(100%,300px)}
  .home-hero-photo{min-height:280px;height:52vw;max-height:340px}
  .home-hero-photo img{object-position:center 55%}

  .home-course-grid{grid-template-columns:1fr;gap:16px}
  .home-course-image{height:190px}
  .home-course-card{min-height:0}
  .home-course-body{padding:34px 18px 20px}

  .home-feature-grid{grid-template-columns:1fr}
  .home-feature:nth-child(n){grid-column:auto;border-right:0;border-bottom:1px solid rgba(255,255,255,.14);padding:22px 12px}
  .home-feature:last-child{border-bottom:0}
  .home-feature p br{display:none}

  .student-section{padding:20px 16px 28px!important}
  .student-photo{min-height:0;height:56vw;max-height:300px;border-radius:14px}
  .student-photo img{object-position:center!important;transform:none!important}
  .student-copy h2{font-size:30px!important;line-height:1.08}
  .student-copy h2 br{display:none}
  .student-copy li{font-size:13px!important;line-height:1.55!important;margin:9px 0!important}
  .student-actions{display:grid!important;grid-template-columns:1fr;gap:9px!important}
  .student-actions .btn{width:100%}

  .testimonials-home,.reviews-section{padding:48px 0!important}
  .testimonial-grid,.reviews-grid{grid-template-columns:1fr}
  .testimonials-intro{font-size:14px;line-height:1.6}
  .testimonial-home-actions,.reviews-hero-actions{display:grid;grid-template-columns:1fr;gap:9px}
  .testimonial-home-actions .btn,.reviews-hero-actions .btn{width:100%}

  .journey-section{padding:18px 0!important}
  .journey-card{width:calc(100% - 24px)!important;padding:22px 16px 24px!important;border-radius:15px!important}
  .journey-logo-box{width:170px!important;height:138px!important}
  .journey-copy h2{font-size:29px!important;letter-spacing:-.7px!important}
  .journey-button{width:100%!important}

  .site-footer{padding:18px 0!important}
  .compact-footer{width:calc(100% - 28px)!important}
  .footer-logo-box{width:72px!important;height:72px!important}
  .footer-links{gap:11px!important;font-size:12px}
  .footer-links span{display:none!important}

  /* Chi Sono / Contatti */
  .public-hero-grid{padding-top:34px!important;padding-bottom:38px!important}
  .public-hero-copy,.contact-hero-inner{text-align:center}
  .public-hero-copy h1,.contact-hero h1{font-size:clamp(36px,11vw,44px)!important;letter-spacing:-1.2px!important}
  .public-hero-copy p,.contact-hero p{font-size:15px!important}
  .public-hero-actions{display:grid;grid-template-columns:1fr;gap:9px}
  .public-hero-actions .btn{width:100%}
  .about-visual{min-height:300px!important}
  .about-image-card{height:270px!important;width:94%!important}
  .about-logo-card{width:112px!important;height:112px!important}
  .about-intro,.about-pillars{padding:46px 0!important}
  .about-intro h2,.about-path-copy h2{font-size:30px!important}
  .about-pillar-grid{grid-template-columns:1fr!important}
  .about-pillar{padding:24px 20px}
  .about-path{padding:38px 0!important}
  .about-path-card{padding:24px 18px!important}
  .about-final-card,.contact-bottom-card{padding:25px 20px!important;align-items:stretch!important}
  .about-final-card .btn,.contact-bottom-card .btn{width:100%}
  .contact-section{padding:48px 0!important}
  .contact-info-card,.contact-form-card{padding:21px!important}
  .contact-info-card h2,.contact-form-head h2{font-size:27px}
  .contact-info-item{grid-template-columns:36px 1fr;padding:13px}

  /* Login / registrazione */
  .auth-wrap{padding:28px 12px}
  .auth-card{padding:23px 18px 27px;border-radius:12px}
  .auth-card h1{font-size:28px;margin-top:4px}
  .auth-card>img{width:150px!important;height:150px!important}

  /* Dashboard / amministrazione */
  .content{padding:20px 14px}
  .page-title{align-items:flex-start;flex-direction:column;margin-bottom:20px}
  .page-title h1,.admin-top h1{font-size:27px}
  .stats{grid-template-columns:1fr;gap:10px;margin-bottom:20px}
  .stat{padding:17px}
  .panel{padding:18px 14px;margin-bottom:16px;border-radius:9px}
  .video-grid{grid-template-columns:1fr}
  .video-thumb{height:190px}
  .dashboard-course-item{grid-template-columns:44px minmax(0,1fr) 20px;padding:11px 9px}
  .dashboard-course-icon{width:42px;height:42px}
  .lesson-material-row{align-items:flex-start;flex-wrap:wrap}
  .lesson-material-row .btn{width:100%;margin-top:4px}

  .student-course-card,.admin-course-card{grid-template-columns:1fr!important}
  .student-course-cover,.admin-course-cover{min-height:190px!important}
  .student-course-body{padding:18px}
  .course-detail-hero{padding:15px!important;gap:16px!important}
  .course-detail-cover{min-height:205px!important}
  .course-curriculum{padding:15px!important}
  .curriculum-item{grid-template-columns:38px minmax(0,1fr)!important;padding:10px}
  .curriculum-number{width:36px;height:36px}
  .curriculum-meta{grid-column:2!important;justify-content:flex-start!important;flex-wrap:wrap}

  .material-admin-item summary{grid-template-columns:1fr!important;padding:14px!important}
  .material-summary-right{grid-column:1!important;justify-content:flex-start!important}
  .student-material-card{grid-template-columns:1fr!important;padding:15px}
  .material-actions{flex-direction:column;align-items:stretch!important}
  .material-actions .btn,.material-actions button{width:100%}
  .inline-checks{gap:12px;flex-direction:column}

  .feedback-form{padding:18px!important}
  .feedback-photo-row{grid-template-columns:1fr!important;text-align:center}
  .feedback-photo-preview{margin:auto}
  .admin-review-card{grid-template-columns:1fr!important}
  .admin-review-photo{margin:auto}
  .admin-review-actions{grid-column:auto!important;justify-content:stretch!important;display:grid!important;grid-template-columns:1fr}
  .admin-review-actions form,.admin-review-actions .btn{width:100%}

  .contact-admin-head{flex-direction:column!important}
  .contact-admin-actions{width:100%;align-items:stretch!important;display:grid!important;grid-template-columns:1fr}
  .contact-admin-actions form,.contact-admin-actions .btn{width:100%}

  .setup-shell{width:calc(100% - 24px);padding:18px 0}
  .setup-logo-box img{width:190px!important;height:190px!important}
  .setup-card{padding:22px 17px}
  .install-success-grid{grid-template-columns:1fr!important}

  /* Player video mantiene 16:9 e non esce dallo schermo. */
  .video-player-wrap{width:100%;aspect-ratio:16/9;border-radius:9px}
  .video-player{width:100%;height:100%;max-height:none;object-fit:contain}

  /* Tabelle amministrative: il contenitore mostra chiaramente che è scrollabile. */
  .table-wrap{margin-left:-4px;margin-right:-4px;padding-bottom:5px}
  .table{min-width:640px}
}

/* Smartphone molto piccoli */
@media (max-width:390px){
  .container{width:calc(100% - 24px)}
  .home-hero-copy{padding-left:14px;padding-right:14px}
  .home-hero-copy h1{font-size:32px}
  .home-course-image{height:170px}
  .home-section-title span{width:28px}
  .site-logo-box{width:66px;height:66px}
  .header-inner{min-height:76px}
  .main-nav{top:76px}
  .sidebar{top:76px}
  .journey-card{width:calc(100% - 18px)!important}
  .journey-copy h2{font-size:27px!important}
  .content{padding-left:10px;padding-right:10px}
}

/* Landscape smartphone: evita un header/menu troppo alto. */
@media (max-height:520px) and (orientation:landscape) and (max-width:900px){
  .site-header{position:relative}
  .sidebar{position:relative;top:0}
  .main-nav{max-height:calc(100vh - 76px);overflow-y:auto}
  .home-hero-grid{grid-template-columns:1fr 1fr}
  .home-hero-copy{text-align:left;padding:30px 24px}
  .home-hero-copy h1{font-size:34px;margin-left:0}
  .hero-main-btn{margin-left:0}
  .home-hero-photo{min-height:300px;height:auto}
}

/* Migliore focus per navigazione touch/tastiera. */
@media (hover:none){
  .btn:hover,.course-card:hover,.home-course-card:hover{transform:none}
}