@media (max-width: 1060px) {
  .nav-links, .nav-cta { display: none; }
  .mobile-toggle { display: flex; }
  .site-nav { width: min(92vw, 680px); }
  .hero-grid, .split-grid { grid-template-columns: 1fr; }
  .hero-copy { text-align: center; margin: 0 auto; }
  .button-row { justify-content: center; }
  .hero-collage { min-height: 560px; max-width: 640px; margin: 0 auto; width: 100%; }
  .section-photo { min-height: 460px; max-width: 560px; margin: 0 auto; }
  .circle-orbit { right: auto; left: 50%; top: 18%; transform: translateX(-50%); }
}

@media (max-width: 820px) {
  .section { padding: 92px 20px; }
  .hero { padding-top: 112px; }
  .about-grid, .blog-grid, .event-cards, .paper-gallery { grid-template-columns: 1fr; }
  .paper-gallery { max-width: 360px; }
  .workshop-detail-grid { grid-template-columns: 1fr; }
  .workshop-detail-image img { height: 260px; }
  .workshop-header { align-items: flex-start; padding: 28px 24px; }
  .workshop-header-left { grid-template-columns: 1fr; }
  .workshop-icon { width: 58px; height: 58px; }
  .workshop-card.expanded .workshop-details { padding: 0 24px 32px; }
  .workshop-details { padding: 0 24px; }
  .icon-row { grid-template-columns: repeat(5, 1fr); gap: 8px; }
  .icon-row span { height: 54px; font-size: 1.25rem; }
  .section-photo { min-height: 360px; }
  .blog-hero, .article-view { padding-top: 128px; }
}

@media (max-width: 560px) {
  html { font-size: 15px; }
  .site-nav { top: 10px; min-height: 58px; padding: 10px 14px; }
  .nav-logo { font-size: 1.08rem; }
  .nav-logo span { font-size: 1.18rem; }
  .hero-title { font-size: clamp(3.4rem, 18vw, 4.8rem); }
  .hero-title .hand { margin-left: 18px; }
  .hero-collage { min-height: 460px; }
  .collage-img.founders { width: 66%; height: 315px; right: 0; }
  .collage-img.circle { width: 58%; height: 245px; left: 0; bottom: 18px; }
  .workshop-postcard { width: 48%; top: 215px; right: 4px; }
  .hand-note { left: 28%; top: 78px; font-size: 1.35rem; }
  .button-row, .btn { width: 100%; }
  .about-card { padding: 34px 24px; border-radius: 34px; }
  .profile-letter { width: 94px; height: 94px; }
  .contact-form { border-radius: 32px; }
  .floating-glyph, .soft-blob { opacity: 0.32; }
  .mobile-overlay a { font-size: 1.9rem; }
}

/* Mobile overrides for v2 */
@media (max-width: 1060px) {
  .nav-links, .nav-social { display: none; }
  .workshop-list { grid-template-columns: 1fr; max-width: 620px; }
  .hero-collage { max-width: 560px; }
}

@media (max-width: 820px) {
  .workshop-cover { height: 260px; }
  .workshop-card-summary { padding: 24px 24px 28px; }
  .workshop-details, .workshop-card.expanded .workshop-details { padding-left: 24px; padding-right: 24px; }
  .section-photo { min-height: 520px; }
  .botanical-drift { opacity: 0.22; }
}

@media (max-width: 560px) {
  .hero-collage { min-height: 500px; }
  .collage-img.founders { width: 78%; height: 335px; right: 0; }
  .collage-img.future-slot { width: 54%; height: 220px; left: 0; bottom: 20px; }
  .collage-img.future-slot::after { font-size: 3rem; }
  .workshop-cover { height: 230px; }
  .workshop-card-summary .chevron { right: 20px; bottom: 22px; }
  .section-photo { min-height: 460px; }
  .manifesto-leaves, .manifesto-roots, .manifesto-hydrangea, .root-thread { display: none; }
  .section:not(.hero)::before, .section:not(.hero)::after { font-size: 2.6rem; opacity: 0.12; }
}

/* ============================================
   v4 mobile refinements
   ============================================ */
@media (max-width: 1060px) {
  .nav-logo-text { max-width: none; }
  .nav-social { display: none; }
  .hero-brand { margin-left: auto; margin-right: auto; }
}

@media (max-width: 820px) {
  .section { padding: 84px 18px; }
  .site-nav { width: min(94vw, 680px); }
  .hero-copy { text-align: center; }
  .hero-title { font-size: clamp(3rem, 13vw, 4.8rem); }
  .workshop-list { grid-template-columns: 1fr; max-width: 620px; margin-inline: auto; }
  .collage-img.founders { width: 74%; height: 360px; }
  .collage-img.future-slot { width: 54%; height: 240px; }
  .nav-logo-icon, .footer-logo-icon { width: 36px; height: 36px; }
  .botanical-drift { width: 110px; height: 110px; opacity: 0.08; }
}

@media (max-width: 560px) {
  .site-nav { border-radius: 26px; padding: 10px 12px; top: 8px; }
  .nav-logo { gap: 8px; }
  .nav-logo-text { font-size: 0.98rem; }
  .hero { min-height: auto; padding-top: 102px; }
  .hero-grid { gap: 28px; }
  .hero-collage { min-height: 420px; }
  .hero-brand { width: 160px; }
  .hero-title { font-size: clamp(2.75rem, 12vw, 4rem); }
  .button-row { flex-direction: column; }
  .btn { width: 100%; }
  .collage-img.founders { width: 82%; height: 300px; }
  .collage-img.future-slot { width: 60%; height: 190px; }
  .section-photo { min-height: 320px; }
  .about-card, .blog-card, .workshop-card, .contact-form { border-radius: 26px; }
  .workshop-cover { height: 210px; border-radius: 26px 26px 0 0; }
  .workshop-card-summary { padding: 20px 20px 22px; }
  .workshop-details, .workshop-card.expanded .workshop-details { padding-left: 20px; padding-right: 20px; }
  .section-title { font-size: clamp(2.2rem, 10vw, 3.1rem); }
  .mobile-overlay a { font-size: 1.45rem; text-align: center; }
  .footer { padding-bottom: 42px; }
  .section:not(.hero)::before,
  .section:not(.hero)::after,
  .botanical-drift,
  .root-thread { opacity: 0.06; }
}

/* ============================================
   v5 mobile refinements
   ============================================ */
@media (max-width: 560px) {
  .profile-photo {
    width: 148px;
    height: 148px;
    border-radius: 26px;
  }
  .services-panel {
    padding: 14px;
  }
  .services-panel a {
    font-size: 0.96rem;
    line-height: 1.35;
  }
  .footer-links {
    gap: 12px;
  }
}

/* ============================================
   v6 patch — header, spacing and botanical mobile tuning
   ============================================ */
@media (max-width: 1060px) {
  .nav-logo {
    min-width: 118px;
    max-width: 138px;
    height: 44px;
  }
  .nav-logo-full {
    width: 132px;
    max-height: 44px;
  }
}
@media (max-width: 820px) {
  .section {
    padding-top: 72px;
    padding-bottom: 72px;
  }
  .hero {
    padding-top: 96px;
    padding-bottom: 54px;
  }
  .hero-collage {
    min-height: 350px;
  }
  .collage-img.founders {
    width: 82%;
    max-width: 420px;
    height: 335px;
    right: 50%;
    transform: translateX(50%);
  }
  .botanical-drift,
  section.section::before,
  section.section::after,
  .blog-hero::before,
  .blog-hero::after {
    width: 115px !important;
    height: 115px !important;
    opacity: 0.08 !important;
  }
  #workshop::before,
  #cerchi::after,
  #progetti::before {
    display: none !important;
  }
}
@media (max-width: 560px) {
  .site-nav {
    min-height: 54px;
    padding: 8px 12px;
  }
  .nav-logo {
    min-width: 104px;
    max-width: 116px;
    height: 38px;
  }
  .nav-logo-full {
    width: 112px;
    max-height: 38px;
  }
  .section {
    padding-top: 58px;
    padding-bottom: 58px;
  }
  .section-heading {
    margin-bottom: 28px;
  }
  .hero {
    padding-top: 86px;
    padding-bottom: 42px;
  }
  .hero-collage {
    min-height: 300px;
  }
  .collage-img.founders {
    height: 285px;
    width: 88%;
  }
  .botanical-drift,
  section.section::before,
  section.section::after,
  .blog-hero::before,
  .blog-hero::after {
    width: 88px !important;
    height: 88px !important;
    opacity: 0.055 !important;
  }
  #about::before,
  #blog::after,
  #contatti::before {
    display: none !important;
  }
}


/* ============================================
   v7 patch — mobile cleanup
   ============================================ */
@media (max-width: 1060px) {
  .nav-logo { display: none !important; }
  .site-nav {
    justify-content: space-between;
  }
}
@media (max-width: 820px) {
  .hero {
    padding-top: 96px !important;
    padding-bottom: 46px !important;
  }
  .section {
    padding-top: 58px !important;
    padding-bottom: 58px !important;
  }
  .hero-grid {
    gap: 18px !important;
  }
  .hero-brand {
    width: min(230px, 58vw);
    margin-inline: auto;
  }
  .hero-copy::after {
    width: 84px;
    height: 84px;
    right: auto;
    left: 0;
    bottom: -10px;
    opacity: 0.1;
  }
  .hero-collage {
    min-height: 360px !important;
  }
  .collage-img.founders {
    position: relative;
    right: auto;
    left: 50%;
    transform: translateX(-50%);
    width: min(76vw, 360px);
  }
  .collage-img.future-slot {
    width: min(34vw, 160px);
    left: 2vw;
    bottom: 8px;
  }
  .about-card,
  .workshop-card,
  .contact-form {
    padding: 20px !important;
  }
}
@media (max-width: 560px) {
  .site-nav {
    padding: 8px 12px !important;
  }
  .hero {
    padding-top: 84px !important;
    padding-bottom: 38px !important;
  }
  .section {
    padding-top: 48px !important;
    padding-bottom: 48px !important;
  }
  .hero-title {
    margin-bottom: 10px;
  }
  .hero-brand {
    width: min(190px, 52vw);
  }
  .hero-collage {
    min-height: 300px !important;
  }
  .collage-img.founders {
    width: min(78vw, 300px);
  }
  .collage-img.future-slot {
    width: 112px;
    left: 0;
    bottom: 0;
  }
  #manifesto::before,
  #about::after,
  #progetti::before,
  #contatti::after {
    display: none !important;
  }
}

/* ============================================
   v10 mobile — figura sotto al titolo, senza spazio vuoto
   ============================================ */
@media (max-width: 820px) {
  .hero {
    padding-top: 76px !important;
    padding-bottom: 38px !important;
  }
  .hero-copy {
    position: relative !important;
    isolation: isolate !important;
    padding-top: 0 !important;
  }
  .hero-brand {
    position: absolute !important;
    z-index: -1 !important;
    left: 50% !important;
    top: -24px !important;
    width: min(260px, 62vw) !important;
    height: min(330px, 76vw) !important;
    margin: 0 !important;
    opacity: 0.12 !important;
    transform: translateX(-50%) rotate(-3deg) !important;
    pointer-events: none !important;
  }
  .hero-title,
  .hero-subtitle,
  .hero-text,
  .hero .button-row {
    position: relative !important;
    z-index: 2 !important;
  }
  .project-section .paper-sheet,
  .paper-gallery .paper-sheet {
    min-height: 190px !important;
  }
}
@media (max-width: 560px) {
  .hero {
    padding-top: 68px !important;
    padding-bottom: 32px !important;
  }
  .hero-brand {
    top: -18px !important;
    width: min(220px, 66vw) !important;
    height: min(285px, 80vw) !important;
    opacity: 0.10 !important;
  }
  .project-section .paper-sheet,
  .paper-gallery .paper-sheet {
    min-height: 170px !important;
  }
}


/* ============================================
   v11 mobile — keep hero visual balanced
   ============================================ */
@media (max-width: 820px) {
  .hero-collage {
    transform: none !important;
  }
}
