/*
Theme Name:   GAIA-theme-by-mic
Template:     twentytwentyfive
Version:      1.1.3
Description:  Child theme GAIA – header/footer fixed, columns full-height, clean typography
Author:       Your Name
*/

/* ===================== Variabili ===================== */
:root{
  --header-h: 72px;   /* aggiornata via JS */
  --footer-h: 0px;    /* aggiornata via JS se footer fixed */
  --gutter: 10px;

  /* Highlight globale (fucsia Gaia) */
  /* --highlight-color: #ff00aa; */
  --highlight-color: #c8a2ff;
  --wp--preset--color--white: #fff;
  --wp--preset--color--base: #000;

  --wp--preset--font-family--elegant-serif: "Cardinal Fruit Medium", serif;

  --bg-color: #fff;               /* sfondo base */
  --grid-size: 40px;              /* distanza tra linee */
  --grid-line: rgba(0,0,0,.06);   /* colore linee */
  --grid-blur: 10px;     
}

:root :where(.is-layout-flex) {
    gap: 0;
}
:root :where(.is-layout-constrained) > * {
    margin-block-start: 0rem;
    margin-block-end: 0.3rem;
}



/* ===================== Layout generali ===================== */
html, body{
  height: 100%;
  overflow: hidden;
}

/* ===================== Accessori ===================== */
body::before{
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
    background-image:
    linear-gradient(to right, var(--grid-line) 1px, transparent 1px),
    linear-gradient(to bottom, var(--grid-line) 1px, transparent 1px);
  background-size: var(--grid-size) var(--grid-size);
  /* filter: blur(var(--grid-blur));
  will-change: filter, background-image; 
  background-color: var(--bg-color);*/
}


/* body{ cursor: none; } */
body::after{
  content: "";
  position: fixed;
  width: 32px; height: 32px;
  background-image: url('http://localhost/wp-content/uploads/2025/05/ChatGPT-Image-27-mag-2025-02_28_05.png');
  background-size: contain;
  background-repeat: no-repeat;
  pointer-events: none;
  z-index: 9999;
  transform: translate(-50%, -50%) scale(1);
  transition: transform 0.2s ease;
}


body.home::before {
  z-index: 10;                     /* sotto al contenuto */
}

/* === 1. LINK GENERICI: barrato animato === */
a {
  position: relative;
  font-family: 'Carinal Fruit', serif;
  text-decoration: none !important;
  color: inherit;
}

/* barra sfumata */
a::after {
  content: "";
  position: absolute;
  left: 0; right: 0;
  top: 50%;
  height: 2px;
  background: linear-gradient(
    to right,
    transparent 0%,
    var(--highlight-color, #ff00aa) 50%,
    transparent 100%
  );
  transform: translateY(-50%) scaleX(0);
  transform-origin: left center;
  transition: transform 0.35s ease;
  pointer-events: none;
}

a:hover::after,
a:focus::after,
a:focus-visible::after {
  transform: translateY(-50%) scaleX(1);
}

/* ===================== Header & Footer fixed ===================== */
.wp-site-blocks > header {
  position: fixed;
  inset: 0 0 auto 0;
  z-index: 1000;
  border-bottom: none;
}

.wp-site-blocks > footer {
  position: fixed;
  inset: auto 0 0 0;
  z-index: 1000;
  border-top: none;
}
/* === 2. LINK NAV/FOOTER: effetto evidenziato === */
.gaia-nav a,
header .gaia-nav a,
footer a, button {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: auto;
  padding: 0px 3px;
  margin: 0;
  border: 1px solid rgba(0,0,0,0.04);
  font-size: 1.7rem;
  line-height: 1.2;
  position: relative;
  color: var(--wp--preset--color--base);
  text-decoration: none !important;
  backdrop-filter: blur(4px);
  background: rgba(255,255,255,0.1);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
    transition: color 0.35s ease, transform 0.25s ease;
}

/* niente barrato qui */
.gaia-nav a::after,
header .gaia-nav a::after,
footer a::after {
  content: none;
}

/* background fill sfumato */
.gaia-nav a::before,
button::before,
header .gaia-nav a::before,
footer a::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to right,
    var(--highlight-color, #ff00aa) 100%,
    var(--highlight-color, #ff00aa) 100%
  );
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 0.35s linear;
  z-index: -1;
}

/* hover: riempimento + testo bianco */
.gaia-nav a:hover,
button:hover,
header .gaia-nav a:hover,
footer a:hover {
  color: #fff!important;
  transform: rotate(var(--rot, 3deg));
}

.gaia-nav a:hover::before,
button:hover::before,
header .gaia-nav a:hover::before,
footer a:hover::before {
  transform: scaleX(1);
}

time {
  background: linear-gradient(
    to right,
    var(--highlight-color, #ff00aa) 100%,
    var(--highlight-color, #ff00aa) 100%
  );
}



/* ===================== Main offset (compensa header/footer fixed) ===================== */
.wp-site-blocks > main,
main[data-barba="container"]{
  padding-top: var(--header-h);
  padding-bottom: var(--footer-h);
  min-height: 100vh;
  margin-block-start: 0;
}


.wp-block-navigation.items-justified-right {
    margin-left: auto;
}

/* ===================== Colonne full-viewport ===================== */
.wp-block-columns.scrollable-columns{
  height: var(--group-h, auto);
  overflow: hidden; /* il wrapper non scorre */
  gap: var(--gutter);
}

.wp-block-columns.scrollable-columns > .wp-block-column{
  display: flex;
  flex-direction: column;
  min-height: 0;
  overflow: hidden;
  border-radius: 0;
  border: 1px solid rgba(0,0,0,0.06);
  background: var(--wp--preset--color--white);
}

/* Scroll interno sulle inner */
.wp-block-columns.scrollable-columns .wp-block-column .col-inner{
  height: 100%;
  overflow: auto ;
  scroll-padding-top: var(--header-h);
  -ms-overflow-style: none;   /* IE/Edge */
  scrollbar-width: none;      /* Firefox */
}
.wp-block-columns.scrollable-columns .wp-block-column .col-inner::-webkit-scrollbar{
  display: none;              /* Chrome/Safari */
}

/* Varianti colonne */
.scrollable-columns.no-col-borders > .wp-block-column {
  border: none;
  background: transparent;
}

/* Card a tutta larghezza */
.fullwidth-card {
  width: 100%;
  border: 1px solid rgba(0,0,0,0.06);
  border-radius: 12px;
  background: #fff;
  padding: 14px;
  margin-bottom: var(--gutter);
}

/* Immagini colonna */
.image-column img{
  max-width: 100%;
  height: auto;
  display: block;
}

/* ===================== Mobile ===================== */
@media (max-width: 781px){
  html, body{ overflow: auto; }
  .wp-block-columns.scrollable-columns{
    height: auto;
    overflow: visible;
  }
  .wp-block-columns.scrollable-columns > .wp-block-column{
    overflow: visible;
    border: none;
    border-radius: 0;
    background: transparent;
  }
  .wp-block-columns.scrollable-columns .wp-block-column .col-inner{
    height: auto;
    overflow: visible;
    padding: 0;
  }
}

/* ===================== Tipografia ===================== */
/* Titolo del sito (header): Cardinal Fruit */
.gaia-site-title,
.gaia-site-title a,
a {
  font-family: "Cardinal Fruit Medium", serif;
  font-weight: normal;
  letter-spacing: 0.01em;
  text-decoration: none;
}

/* Navigazione (header & footer): Helvetica */
.gaia-nav .wp-block-navigation-item__content,
.gaia-nav a{
  font-family: Helvetica, Arial, sans-serif;
   font-weight: bold;
  text-decoration: none;
}

:root :where(.wp-element-button, .wp-block-button__link) {
  padding: 3px 0px;
}

/* Titoli contenuti */
.wp-block-post-title,
.entry-title,
h1.project-title, h2.project-title, h3.project-title{
  font-family: "Cardinal Fruit Medium", serif;
  font-weight: normal;
  letter-spacing: 0.01em;
}

.page-template .wp-block-post-title,
.wp-block-query-title,
time {
  font-family: Helvetica, Arial, sans-serif;
  font-weight: normal;
  text-decoration: none;
}

/* Testi lunghi in serif elegante */
.entry-content,
.wp-block-post-content,
.is-layout-constrained p,
.is-layout-flow p{
  
  /* font-family: "Cormorant Garamond", serif; */
  font-family: "Cardinal Fruit Medium", serif;
  line-height: 1.3;
    margin-block-start: 0.2em;
    margin-block-end: 0.6em;

}



/* ===================== Focus reset ===================== */
:where(.wp-site-blocks *:focus){
  outline-width: initial;
  outline-style: initial;
  outline-offset: initial;
}


/* ===================== Barba.js perf ===================== */
[data-barba="container"]{
  will-change: transform, opacity;
  transform-style: preserve-3d;
  backface-visibility: hidden;
}

/* ===================== Projects grid ===================== */
.projects-grid{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: var(--gutter);
}
.proj-card{
  border: 1px solid rgba(0,0,0,0.06);
  border-radius: 12px;
  background: #fff;
  padding: 14px;
}
.proj-card__excerpt{ margin-top: 6px; }

/* ===================== Collaborations list ===================== */
.coll-row{
  display: grid;
  grid-template-columns: 10% 30% 25% 1fr; /* anno, titolo, crediti, descr. */
  gap: var(--gutter);
  align-items: start;
  padding: 12px 2px;
  border-bottom: 1px solid rgba(0,0,0,0.12);
}
.coll-row:last-child{ border-bottom: 0; }
.coll-row .cell{ min-width: 0; }

@media (max-width: 900px){
  .coll-row{ grid-template-columns: 1fr; gap: 6px; }
}

/* ===================== Homepage hero ===================== */
.home-hero{
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
.home-hero .wp-block-cover{
  min-height: 100vh;
}
.home main.wp-block-group.alignfull {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

/* ===================== Query list hover helpers ===================== */
.scrollable-columns .wp-block-post-featured-image { display: none !important; }
.wp-block-query .wp-block-post { display: block; position: relative; }

/* ===================== Hover preview layer ===================== */
#hover-preview{
  position: fixed; left:50%; top:50%;
  transform: translate(-50%,-50%) rotate(var(--rot,0deg)) scale(.94);
  opacity:0; pointer-events:none; z-index: 9999;
  transition: opacity .2s ease, transform .35s cubic-bezier(.2,.7,.1,1);
}
#hover-preview.is-visible{
  opacity:1;
  transform: translate(-50%,-50%) rotate(var(--rot,0deg)) scale(1);
}
#hover-preview img{
  max-width: 52vmin; max-height: 68vh; display:block;
  border-radius:10px; box-shadow:0 18px 60px rgba(0,0,0,.35);
}
@media (hover:none){ #hover-preview{ display:none; } }