@import url('https://fonts.googleapis.com/css2?family=Italiana&family=Jost:wght@300;400;500;600&display=swap');

/* ============ SITO ============ */
.header .logo-bar .logo img{
  max-height:55px !important;
  width:auto !important;
  max-width:100% !important;
}
.header .page-header::before{
  content:"";position:absolute;top:0;left:0;right:0;bottom:0;
  background:rgba(0,0,0,.60);z-index:0;
}
.header .page-header > *{position:relative;z-index:1;}

/* ============ BASE ============ */
.ay,.ay-c{
  --notte:#101317;
  --perla:#F7F6F3;
  --champagne:#C9A96A;
  --champagne-chiaro:#E3CB96;
  --oro-scuro:#8C6F3C;
  --fumo:#9AA0A6;
  --inchiostro:#2A2F35;
  --filo:rgba(16,19,23,.12);
  --titolo:'Italiana',Georgia,serif;
  --corpo:'Jost',system-ui,sans-serif;
  font-family:var(--corpo);
  font-weight:300;
  font-size:17px;
  line-height:1.75;
  color:var(--inchiostro);
  -webkit-font-smoothing:antialiased;
}
.ay *,.ay *::before,.ay *::after,
.ay-c *,.ay-c *::before,.ay-c *::after{box-sizing:border-box;}
.ay p,.ay-c p{margin:0 0 1.15em;color:inherit;font-weight:300;}
.ay p:last-child,.ay-c p:last-child{margin-bottom:0;}
.ay h2,.ay h3,.ay h4,.ay-c h2{
  font-family:var(--titolo);font-weight:400;margin:0;
  line-height:1.14;letter-spacing:.005em;color:var(--notte);
}
.ay a,.ay-c a{text-decoration:none;}

.ay-w{max-width:1000px;margin:0 auto;padding:0 24px;}
.ay-w-l{max-width:1180px;margin:0 auto;padding:0 24px;}
.ay-s{padding:92px 0;}
.ay-p{padding:88px 56px;}
.ay-scuro{
  background:var(--notte);color:#C6CBD1;
  background-image:linear-gradient(172deg,#171B21 0%,#0D1014 100%);
}
.ay-scuro h2,.ay-scuro h3{color:var(--perla);}
.ay-scuro p{color:#A2A9B0;}

.ay-filo{
  height:1px;border:0;margin:0 0 30px;max-width:120px;
  background:linear-gradient(90deg,var(--champagne),rgba(201,169,106,0));
  transform-origin:left center;
}
.ay-scuro .ay-filo{background:linear-gradient(90deg,var(--champagne-chiaro),rgba(227,203,150,0));}

.ay-oc{
  font-size:11px;font-weight:500;letter-spacing:.34em;
  text-transform:uppercase;color:var(--oro-scuro);margin:0 0 14px;
}
.ay-scuro .ay-oc{color:var(--champagne);}

/* ============ APERTURA ============ */
.ay-apertura h2{
  font-size:clamp(38px,6vw,72px);line-height:1.06;
  letter-spacing:.01em;max-width:13ch;margin-bottom:36px;
}
.ay-apertura h2 span{color:var(--champagne);display:block;}
.ay-due{display:grid;grid-template-columns:1fr 1fr;gap:48px;}
.ay-guida{
  font-size:19px;line-height:1.7;color:var(--perla);
  border-left:1px solid var(--champagne);padding-left:22px;
}

/* ============ STORIA ============ */
.ay-storia{display:grid;grid-template-columns:.7fr 1.3fr;gap:64px;align-items:start;}
.ay-anno{
  font-family:var(--titolo);font-size:clamp(64px,10vw,116px);
  line-height:.9;letter-spacing:.02em;color:var(--champagne);margin:0 0 10px;
}
.ay-anno-e{
  font-size:10.5px;font-weight:500;letter-spacing:.3em;
  text-transform:uppercase;color:var(--fumo);
}
.ay-storia h2{font-size:clamp(27px,3.4vw,40px);margin-bottom:24px;}

/* ============ MISSIONE ============ */
.ay-missione{text-align:center;}
.ay-missione .ay-filo{margin:0 auto 30px;transform-origin:center;}
.ay-missione h2{
  font-size:clamp(30px,4.6vw,54px);line-height:1.18;
  max-width:17ch;margin:0 auto 34px;
}
.ay-missione .ay-testo{max-width:60ch;margin:0 auto;color:#4A5057;}

/* ============ GALLERIA ============ */
.ay-galleria{background:#FAFAF8;}
.ay-galleria .ay-w-l{text-align:center;}
.ay-galleria .ay-oc{text-align:center;margin-left:auto;margin-right:auto;}
.ay-galleria .ay-filo{margin:0 auto 30px;transform-origin:center;}
.ay-galleria h2{
 font-size:clamp(28px,4vw,46px);
  margin:0 auto 20px !important;
  max-width:22ch;
  text-align:center;
}
.ay-galleria .ay-testo{
  max-width:56ch;margin:0 auto 50px;color:#4A5057;text-align:center;
}

.ay-gr{
  display:grid;grid-template-columns:repeat(4,1fr);
  grid-auto-rows:200px;gap:2px;text-align:left;
}
.ay-gi{position:relative;overflow:hidden;background:#E6E7E5;display:block;}
.ay-gi img{
  width:100%;height:100%;object-fit:cover;display:block;
  transition:transform 1.2s cubic-bezier(.22,.61,.36,1),filter .6s ease;
  filter:saturate(.9);
}
.ay-gi:hover img{transform:scale(1.06);filter:saturate(1.04);}
.ay-gi::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(16,19,23,0) 42%,rgba(16,19,23,.76) 100%);
  opacity:0;transition:opacity .55s ease;
}
.ay-gi:hover::after{opacity:1;}
.ay-gi-t{
  position:absolute;left:22px;bottom:18px;z-index:2;
  font-size:10.5px;font-weight:500;letter-spacing:.24em;
  text-transform:uppercase;color:var(--perla);
  opacity:0;transform:translateY(8px);
  transition:opacity .5s ease,transform .5s cubic-bezier(.22,.61,.36,1);
}
.ay-gi:hover .ay-gi-t{opacity:1;transform:none;}
.ay-gi-l{grid-column:span 2;grid-row:span 2;}
.ay-gi-w{grid-column:span 2;}

/* ============ CARATTERISTICHE ============ */
.ay-car{display:grid;grid-template-columns:repeat(3,1fr);}
.ay-sch{
  padding:34px 32px;
  border-top:1px solid var(--filo);
  border-right:1px solid var(--filo);
  transition:background .45s ease,box-shadow .45s ease;
}
.ay-car .ay-sch:nth-child(3n){border-right:none;}
.ay-car .ay-sch:nth-last-child(-n+3){border-bottom:1px solid var(--filo);}
.ay-sch:hover{background:#FBFAF7;box-shadow:inset 3px 0 0 var(--champagne);}
.ay-sch h4{
  font-family:var(--corpo);font-size:11px;font-weight:500;
  letter-spacing:.24em;text-transform:uppercase;
  color:var(--oro-scuro);margin-bottom:14px;transition:color .45s ease;
}
.ay-sch:hover h4{color:var(--notte);}
.ay-sch p{font-size:15.5px;color:#4A5057;margin:0;}

/* ============ CHIUSURA ============ */
.ay-chiusura{text-align:center;}
.ay-chiusura .ay-filo{margin:0 auto 28px;transform-origin:center;}
.ay-chiusura h2{font-size:clamp(30px,4.4vw,52px);margin-bottom:18px;}
.ay-chiusura p{max-width:50ch;margin:0 auto 38px;}
.ay-btn{
  display:inline-block;position:relative;overflow:hidden;
  font-weight:400;font-size:11.5px;
  letter-spacing:.28em;text-transform:uppercase;
  color:var(--champagne-chiaro);padding:17px 42px;
  border:1px solid rgba(227,203,150,.45);background:transparent;
  transition:color .45s ease,border-color .45s ease;
}
.ay-btn::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:var(--champagne-chiaro);
  transform:scaleX(0);transform-origin:left center;
  transition:transform .45s cubic-bezier(.22,.61,.36,1);
}
.ay-btn:hover::before,.ay-btn:focus::before{transform:scaleX(1);}
.ay-btn:hover,.ay-btn:focus{color:var(--notte);border-color:var(--champagne-chiaro);}
.ay-btn:focus-visible{outline:2px solid var(--perla);outline-offset:4px;}
.ay-firma{
  margin-top:44px;padding-top:26px;
  border-top:1px solid rgba(227,203,150,.16);
  font-size:10.5px;letter-spacing:.3em;
  text-transform:uppercase;color:var(--fumo);
}

/* ============ CONTATTI ============ */
.ay-targa{
  background:linear-gradient(155deg,#F0E2C4 0%,#D9BE8C 34%,#C2A268 62%,#E6D3AC 100%);
  border:1px solid #A98B54;
  padding:44px 46px 12px;
  box-shadow:
    0 1px 0 rgba(255,255,255,.55) inset,
    0 -1px 0 rgba(120,95,50,.35) inset,
    0 26px 60px -34px rgba(0,0,0,.75);
}
.ay-targa-t{
  display:flex;justify-content:space-between;align-items:baseline;gap:20px;
  padding-bottom:18px;margin-bottom:6px;
  border-bottom:1px solid rgba(90,70,35,.38);
  font-size:10.5px;font-weight:500;letter-spacing:.3em;
  text-transform:uppercase;color:#6B542B;
}
.ay-c-titolo{font-size:clamp(30px,4.2vw,50px);margin-bottom:16px;}
.ay-c-intro{max-width:56ch;margin-bottom:52px;color:#4A5057;}
.ay-c-griglia{display:grid;grid-template-columns:1fr 1fr;gap:52px;align-items:start;}
.ay-c-r{
  display:grid;grid-template-columns:120px 1fr;gap:24px;
  padding:20px 0;border-bottom:1px solid rgba(90,70,35,.22);
  transition:background .35s ease;
}
.ay-c-r:last-child{border-bottom:none;}
.ay-c-r:hover{background:rgba(255,255,255,.22);}
.ay-c-campo{
  font-size:10.5px;font-weight:500;letter-spacing:.26em;
  text-transform:uppercase;color:#6B542B;padding-top:5px;
}
.ay-c-val{font-size:16px;line-height:1.6;color:#33280F;}
.ay-c-val a{color:#33280F;border-bottom:1px solid rgba(51,40,15,.35);}

.ay-c-orari{margin-top:34px;border:1px solid var(--filo);}
.ay-c-orari-t{
  font-size:10.5px;font-weight:500;letter-spacing:.28em;
  text-transform:uppercase;color:var(--oro-scuro);
  padding:16px 22px;border-bottom:1px solid var(--filo);
}
.ay-g{
  display:flex;justify-content:space-between;gap:16px;
  padding:13px 22px;border-bottom:1px solid rgba(16,19,23,.07);
  font-size:15px;color:#4A5057;
}
.ay-g:last-child{border-bottom:none;}
.ay-g span:last-child{color:var(--inchiostro);letter-spacing:.04em;}
.ay-chiuso span:last-child{color:var(--oro-scuro);}

.ay-c-mappa{border:1px solid var(--filo);filter:grayscale(1) contrast(1.05);line-height:0;}
.ay-c-mappa iframe{width:100%;min-height:460px;border:0;display:block;}
.ay-c-nota{
  margin-top:26px;font-size:10.5px;font-weight:500;
  letter-spacing:.26em;text-transform:uppercase;color:var(--fumo);
}

/* ============ ANIMAZIONI ============ */
/* Guidate dallo scroll, senza JavaScript.
   Se il browser non le supporta, tutto resta visibile. */

@keyframes ay-sali{
  from{opacity:0;transform:translateY(26px);}
  to{opacity:1;transform:none;}
}
@keyframes ay-filo-in{
  from{transform:scaleX(0);}
  to{transform:scaleX(1);}
}
@keyframes ay-img-in{
  from{opacity:0;transform:scale(1.08);}
  to{opacity:1;transform:none;}
}

@supports (animation-timeline: view()){
  @media (prefers-reduced-motion: no-preference){

    .ay-oc,
    .ay h2,
    .ay-testo,
    .ay-due,
    .ay-storia,
    .ay-anno,
    .ay-anno-e,
    .ay-sch,
    .ay-targa,
    .ay-btn,
    .ay-firma,
    .ay-c-griglia{
      animation:ay-sali .9s cubic-bezier(.22,.61,.36,1) both;
      animation-timeline:view();
      animation-range:entry 4% cover 26%;
    }

    .ay-filo{
      animation:ay-filo-in .9s cubic-bezier(.22,.61,.36,1) both;
      animation-timeline:view();
      animation-range:entry 6% cover 24%;
    }

    .ay-gi{
      animation:ay-img-in 1.1s cubic-bezier(.22,.61,.36,1) both;
      animation-timeline:view();
      animation-range:entry 2% cover 30%;
    }

    /* le schede entrano leggermente sfalsate */
    .ay-car .ay-sch:nth-child(2){animation-range:entry 6% cover 28%;}
    .ay-car .ay-sch:nth-child(3){animation-range:entry 8% cover 30%;}
    .ay-car .ay-sch:nth-child(5){animation-range:entry 6% cover 28%;}
    .ay-car .ay-sch:nth-child(6){animation-range:entry 8% cover 30%;}
  }
}

/* ============ RESPONSIVE ============ */
@media (max-width:900px){
  .ay-due,.ay-storia,.ay-c-griglia{grid-template-columns:1fr;gap:34px;}
  .ay-car{grid-template-columns:repeat(2,1fr);}
  .ay-car .ay-sch:nth-child(3n){border-right:1px solid var(--filo);}
  .ay-car .ay-sch:nth-child(2n){border-right:none;}
  .ay-p{padding:64px 34px;}
  .ay-gr{grid-template-columns:repeat(2,1fr);grid-auto-rows:170px;}
  .ay-gi-l{grid-column:span 2;grid-row:span 1;}
  .ay-c-mappa iframe{min-height:340px;}
}
@media (max-width:640px){
  .ay,.ay-c{font-size:16px;}
  .ay-s{padding:58px 0;}
  .ay-p{padding:52px 24px;}
  .ay-car{grid-template-columns:1fr;}
  .ay-car .ay-sch{border-right:none;}
  .ay-gr{grid-template-columns:1fr;grid-auto-rows:220px;}
  .ay-gi-l,.ay-gi-w{grid-column:span 1;}
  .ay-targa{padding:28px 24px 6px;}
  .ay-c-r{grid-template-columns:1fr;gap:10px;padding:18px 0;}
}