* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

body {
    background-color: #000000;
    color: #ffffff;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    padding: 40px 24px;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

a {
    color: #ffffff;
    text-decoration: none;
    transition: opacity 0.2s ease;
}

a:hover {
    opacity: 0.7;
}

/* Header */
header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 60px;
}

.brand {
    font-size: 1.25rem;
    line-height: 1.3;
    font-weight: 400;
}

.nav-links {
    display: flex;
    gap: 40px;
    font-size: 1.25rem;
    line-height: 1.3;
}

.nav-column {
    display: flex;
    flex-direction: column;
}

.active-link {
    color: #666666;
}

.hello-link {
    color: #666666;
}

/* Main Container */
main {
    max-width: 600px;
    margin: 0 auto;
    width: 100%;
}

/* Typography & Layouts */
h1 {
    font-size: 1.5rem;
    font-weight: 400;
    margin-bottom: 40px;
}

p.description, .bio-text {
    font-size: 1.5rem;
    line-height: 1.3;
    font-weight: 400;
    margin-bottom: 32px;
}

.email-link {
    font-size: 1.5rem;
    display: inline-block;
    margin-bottom: 40px;
}

.social-title {
    font-size: 1.5rem;
    margin-bottom: 24px;
}

.social-list {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.social-list li a {
    font-size: 1.35rem;
}

.strikethrough {
    text-decoration: line-through;
}

/* Media & Cards */
.media-card {
    width: 100%;
    margin-bottom: 60px;

}

.media-container {
  display: flex;
  flex-direction: column; /* Mette il testo sotto l'immagine */
  align-items: flex-start;
  gap: 0; /* Annulla lo spazio verticale tra foto e testo */
}

.media-img {
  max-width: 350px !important; /* Dimensione compatta della foto */
  width: 100%;
  height: auto;
  margin-bottom: 0 !important;
}

.card-title {
  margin-top: 4px; /* Distanza minima dal bordo inferiore della foto */
  margin-bottom: 0;
}

.card-subtitle {
  margin-top: 0;
}

.card-text {
  margin: 0;
  padding: 0;
}

.card-title, 
.card-subtitle {
  margin-top: 0; /* Rimuove i margini di default per attaccare la scritta al bordo della foto */
}



/* Regola per 4° e 5° video (Più grandi) */
/*.media-container.video-low {
    max-width: 480px !important;
    margin-left: auto;
    margin-right: auto;
}

.media-container.video-low video {
    width: 100%;
    max-height: 520px !important;
    object-fit: contain;
}*/



/* Regola standard per i primi 3 video e le immagini */
.media-img,
.media-container video {
    width: 100%;
    height: auto;
    display: block;
}


.profile-img {
  width: 250px !important; /* Dimensione della foto */
  height: auto !important;
  filter: none !important;
  background: transparent !important;

  /* Sfumatura rettangolare: mantiene la forma e sfuma solo i contorni */
  -webkit-mask-image: linear-gradient(to right, transparent, black 15%, black 85%, transparent),
                      linear-gradient(to bottom, transparent, black 15%, black 85%, transparent);
  -webkit-mask-composite: source-in;
  mask-image: linear-gradient(to right, transparent, black 15%, black 85%, transparent),
              linear-gradient(to bottom, transparent, black 15%, black 85%, transparent);
  mask-composite: intersect;
}

.media-container {
  background: transparent !important;
  box-shadow: none !important;
  border: none !important;
}



.card-title {
    font-size: 1.5rem;
    font-weight: 400;
    margin-bottom: 6px;
}

.card-subtitle {
    font-size: 1.25rem;
    color: #555555;
}

/* Journal Article */
.journal-meta {
    font-size: 1.25rem;
    margin-bottom: 40px;
}

.journal-meta .date {
    margin-top: 8px;
}

.article-body p {
    font-size: 1.25rem;
    line-height: 1.4;
    margin-bottom: 32px;
}

/* Footer */
footer {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    font-size: 1.25rem;
    line-height: 1.3;
    margin-top: 60px;
}

.coordinates {
    text-align: center;
    font-variant-numeric: tabular-nums;
}

.top-arrow {
    font-size: 1.25rem;
}

/* Immagini dentro il diario */
.article-body figure {
    margin: 0 0 32px 0;
}

.article-body figcaption {
    margin-top: 6px;
}

/* Immagini larghe (righe di documenti) */
.media-img.wide {
    max-width: 100% !important;
}

/* Immagini piccole (ritratti) */
.media-img.small {
    max-width: 200px !important;
}

/* --- Ritocchi 29.10.26 --- */
/* Immagini della stessa larghezza dei video */
.media-img { max-width: 100% !important; }
.media-img.small { max-width: 200px !important; }
/* Sottotitoli piu leggibili */
.card-subtitle { color: #888888; }
/* Header su telefono: menu sotto il nome */
@media (max-width: 600px) {
    header { flex-direction: column; gap: 24px; margin-bottom: 40px; }
    .nav-links { gap: 32px; }
}

/* Selettore di lingua EN / IT */
.lang-switch { margin-top: 12px; color: #888888; }
.lang-switch a { color: #ffffff; }
.lang-switch .lang-current { color: #888888; }

/* Pagina About, testo lungo */
.about-body { margin-top: 48px; }
.about-body a { text-decoration: underline; }

/* Piede: coordinate e frase */
.coordinates .tagline { display: block; color: #888888; font-size: 0.85em; margin-top: 4px; }
@media (max-width: 600px) {
    footer { flex-wrap: wrap; row-gap: 24px; }
    .coordinates { order: 3; width: 100%; }
}