/* MAIN STYLESHEET - IMPORTS ALL MODULAR CSS FILES */

/* Base Styles */
@import url('css/base.css');

/* Animations */
@import url('css/animations.css');

/* Header and Navigation */
@import url('css/header.css');

/* Hero Sections */
@import url('css/hero.css');

/* Buttons */
@import url('css/buttons.css');

/* Construction Page */
@import url('css/construction.css');

/* Carousel and Gallery */
@import url('css/carousel.css');

/* Cards */
@import url('css/cards.css');

/* Tables */
@import url('css/tables.css');

/* Forms */
@import url('css/forms.css');

/* Program Page */
@import url('css/program.css');

/* Dinner Page */
@import url('css/dinner.css');

/* Contacts Page */
@import url('css/contacts.css');

/* Footer */
@import url('css/footer.css');

/* Utilities */
@import url('css/utilities.css');

#registration {
  scroll-margin-top: 150px;
}

.photographer-note {
  background: #f7f3e9;
  color: #7a5c2e;
  font-weight: 600;
  border-left: 4px solid #c2a76c;
  padding: 0.75em 1em;
  margin: 1.5em 0em 3em 0;
  border-radius: 0 8px 8px 0;
  font-size: 1.08em;
  box-shadow: 0 2px 8px rgba(194,167,108,0.07);
  width: 100%;
  box-sizing: border-box;
  display: block;
}

@media (max-width: 480px) {

  /* 1) Evita scroll orizzontale da 100vw + padding */
  html, body {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden !important;
    padding: 0 !important; /* niente padding su body/html */
  }

  /* 2) Layout base: tutto a 100% e padding interno */
  .content-section {
    padding: 0 12px !important;              /* al posto dei 175px desktop */
    background-size: 70% !important;         /* riduci watermark */
    background-position: 50% 20% !important; /* centrato e più in alto */
  }

  .container,
  .program-schedule,
  .day-schedule,
  .participation-rules,
  .rules-content,
  .schedule-timeline {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    overflow-x: visible !important; /* NO auto: crea scroll inutili */
  }

  /* 3) Spaziature */
  .day-schedule,
  .participation-rules {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  .content-section h2 {
    font-size: 1.5rem !important;
    margin-bottom: 18px !important;
  }

  /* 4) Timeline: stack verticale leggibile */
  .schedule-timeline {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
  }

  .time-slot {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 6px !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important; /* meglio di word-break: break-word */
  }

  .time-slot .time {
    font-weight: 700;
    font-size: 0.95rem;
    line-height: 1.2;
  }

  .time-slot .activity {
    font-size: 0.98rem;
    line-height: 1.3;
  }

  /* 5) Sezione "Sotto egida": colonna + gatti a riga */
  .aegis-section {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 14px !important;
    padding: 0 12px !important;
  }

  .aegis-cats-left,
  .aegis-cats-right {
    display: flex !important;
    flex-direction: row !important;
    justify-content: center !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
  }

  /* opzionale: evita bolle troppo grandi su mobile */
  .aegis-cat-bubble {
    max-width: 78px !important;
    max-height: 78px !important;
  }
  .aegis-cat-bubble img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
  }
}