/* Milky Way Pilates — stile del sito */
:root{
  --milk:#FBF8F3; --ink:#2E2620; --text:#4A4038; --muted:#6E6259;
  --honey:#D1A054; --honey-deep:#8A6420; --honey-border:#C08F45; --gold-star:#E3BE85;
  --cream:#F5ECDA; --stone:#EFEBE6; --line:#EAE2D8;
  --serif:'Cormorant Garamond',Georgia,'Times New Roman',serif;
  --sans:'Jost',system-ui,-apple-system,'Segoe UI',sans-serif;
}
*{box-sizing:border-box}
html.mw-pending body{opacity:0}
body{transition:opacity .25s ease}
html{scroll-behavior:smooth;scroll-padding-top:84px;overflow-anchor:none}
body{margin:0;background:var(--milk);color:var(--ink);font-family:var(--sans);font-weight:300;font-size:17px;line-height:1.65;-webkit-font-smoothing:antialiased}
img{max-width:100%}
a{color:var(--ink)}a:hover{color:var(--honey-deep)}
:focus-visible{outline:2px solid var(--honey-deep);outline-offset:3px}
.mw{container-type:inline-size;container-name:page}
.mw-root{display:flex;flex-direction:column;min-height:100vh;overflow-x:clip}
.grow{flex:1 0 auto}
.stars{background-color:var(--milk);background-image:url("../img/stelle.svg");background-size:420px 420px}
.stars-cream{background-color:var(--cream);background-image:url("../img/stelle.svg");background-size:420px 420px}

/* bottoni e link */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:0 26px;border-radius:999px;font-family:var(--sans);font-size:15px;font-weight:500;letter-spacing:.02em;text-decoration:none;transition:background-color .25s ease,color .25s ease,border-color .25s ease,transform .25s ease;cursor:pointer;border:1px solid transparent;white-space:nowrap}
.btn-rose{background:var(--honey);color:var(--ink);border-color:var(--honey)}
.btn-rose:hover{background:var(--ink);color:var(--milk);border-color:var(--ink)}
.btn-line{background:transparent;color:var(--ink);border-color:var(--ink)}
.btn-line:hover{background:var(--ink);color:var(--milk)}
.btn-sm{min-height:44px;padding:0 20px;font-size:14px}
.link-arrow{display:inline-flex;align-items:center;gap:8px;font-family:var(--sans);font-size:14px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--ink);text-decoration:none;border-bottom:1px solid var(--ink);padding-bottom:4px;min-height:32px}
.link-arrow:hover{color:var(--honey-deep);border-color:var(--honey-deep)}
.link-arrow-light{color:var(--milk);border-color:var(--milk)}
.link-arrow-light:hover{color:var(--honey);border-color:var(--honey)}
.nav-link{font-family:var(--sans);font-size:14px;letter-spacing:.06em;text-transform:uppercase;color:var(--text);text-decoration:none;padding:12px 2px}
.nav-link:hover{color:var(--honey-deep)}

/* tipografia ricorrente */
.eyebrow{margin:0;font-size:13px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--honey-deep)}
.h2{margin:0;font-family:var(--serif);font-weight:400;font-size:clamp(40px,4.6cqi,64px);line-height:1.05;color:var(--ink)}
.h2 em,.h1 em{font-style:italic}

/* form */
.field{width:100%;min-height:50px;padding:14px 16px;border:1px solid #D9CFC3;border-radius:10px;background:#FFFFFF;font-family:var(--sans);font-size:16px;color:var(--ink);outline:none;transition:border-color .2s}
.field:focus{border-color:var(--ink)}
.field::placeholder{color:#8E8278}
.lbl{display:block;margin-bottom:8px;font-family:var(--sans);font-size:13px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--text)}
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}

/* instagram */
.ig-tile{position:relative;display:block;aspect-ratio:1/1;overflow:hidden;border-radius:6px;background:#EEEAE5}
.ig-tile img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s ease}
.ig-tile:hover img{transform:scale(1.04)}

/* post instagram */
.ig-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
@container page (max-width: 560px){.ig-grid{gap:8px}.ig-type{top:6px!important;right:6px!important}.ig-type svg{width:14px;height:14px}}
.ig-live::after{content:"";position:absolute;inset:0;background:rgba(46,38,32,0);transition:background .5s ease;pointer-events:none}
.ig-live:hover::after,.ig-live:focus-visible::after{background:rgba(46,38,32,.22)}
.ig-type{position:absolute;top:10px;right:10px;z-index:2;color:#FBF8F3;filter:drop-shadow(0 1px 3px rgba(0,0,0,.35))}
.ig-over{position:absolute;left:0;right:0;bottom:0;z-index:2;display:flex;flex-direction:column;gap:8px;padding:18px 16px 16px;color:#FBF8F3;background:linear-gradient(to top,rgba(46,38,32,.92),rgba(46,38,32,.72) 70%,rgba(46,38,32,0));transform:translateY(101%);transition:transform .55s cubic-bezier(.22,.61,.36,1)}
.ig-live:hover .ig-over,.ig-live:focus-visible .ig-over{transform:translateY(0)}
.ig-stats{display:flex;align-items:center;gap:16px;font-size:14px;font-weight:500;font-variant-numeric:tabular-nums}
.ig-stats span{display:inline-flex;align-items:center;gap:6px}
.ig-stats .ig-share{margin-left:auto;color:var(--honey)}
.ig-cap{font-size:13px;line-height:1.45;color:#E9DCC6;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
@media (hover: none){
  .ig-over{transform:none;padding:22px 12px 10px;background:linear-gradient(to top,rgba(46,38,32,.75),rgba(46,38,32,0))}
  .ig-cap{display:none}
  .ig-stats{font-size:13px;gap:12px}
}

/* strisce scorrevoli */
.marquee{display:flex;width:max-content;animation:mw-scroll 38s linear infinite}
.marquee-slow{animation-duration:60s}
.mq-feat{display:flex;align-items:center;gap:28px;padding-right:28px;white-space:nowrap;font-size:14px;font-weight:500;letter-spacing:.14em;text-transform:uppercase}
.mq-quote{display:flex;align-items:center;gap:40px;padding-right:40px;white-space:nowrap;font-family:var(--serif);font-style:italic;font-size:30px;line-height:1.2}
@keyframes mw-scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* schede */
.appro-photo{min-height:420px}
.card{transition:transform 1.1s cubic-bezier(.25,.6,.3,1),box-shadow 1.1s ease}
.card:hover{transform:translateY(-2px);box-shadow:0 16px 40px rgba(46,38,32,.07)}
.card-dark:hover{box-shadow:0 18px 44px rgba(46,38,32,.30)}

/* hero */
.hero-fig{position:relative;width:100%;aspect-ratio:1319/1193;justify-self:center}
.hero-arco{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 0%;display:block;-webkit-mask-image:linear-gradient(to right,transparent,#000 5%,#000 95%,transparent),linear-gradient(to bottom,transparent,#000 5%,#000 95%,transparent);-webkit-mask-composite:source-in;mask-image:linear-gradient(to right,transparent,#000 5%,#000 95%,transparent),linear-gradient(to bottom,transparent,#000 5%,#000 95%,transparent);mask-composite:intersect}
.hero-badge{width:max-content;position:absolute;left:50%;bottom:-4%;transform:translateX(-50%);white-space:nowrap;z-index:2;display:flex;align-items:center;gap:12px;padding:14px 20px 14px 14px;background:var(--milk);border-radius:999px;box-shadow:0 12px 32px rgba(46,38,32,.10)}
.hero-badge img{width:40px;height:40px;object-fit:contain;display:block}

/* selettore lingua */
.lang{position:relative;display:inline-flex;align-items:center;padding:4px;border-radius:999px;background:var(--stone);box-shadow:inset 0 1px 3px rgba(46,38,32,.14)}
.lang-knob{position:absolute;top:4px;left:4px;width:42px;height:36px;border-radius:999px;background:#FFFFFF;box-shadow:0 2px 8px rgba(46,38,32,.18);transition:transform .45s cubic-bezier(.3,.7,.2,1)}
.lang-btn{position:relative;z-index:1;width:42px;height:36px;border:0;background:transparent;border-radius:999px;font-family:var(--sans);font-size:13px;font-weight:500;letter-spacing:.08em;color:var(--muted);cursor:pointer;transition:color .3s}
.lang-btn:hover,.lang-btn[aria-pressed="true"]{color:var(--ink)}

/* footer */
.foot a{color:#E9DCC6;text-decoration:none}
.foot a:hover{color:var(--honey)}

/* WhatsApp */
.wa-float{white-space:nowrap;position:fixed;right:24px;bottom:24px;z-index:50;display:inline-flex;align-items:center;gap:10px;min-height:46px;padding:0 18px 0 6px;border-radius:999px;background:var(--ink);color:var(--milk);text-decoration:none;font-family:var(--sans);font-size:14px;font-weight:500;box-shadow:0 0 0 1px rgba(251,248,243,.4),0 0 16px 2px rgba(251,248,243,.16),0 8px 24px rgba(46,38,32,.18);transition:transform .25s ease}
.wa-float:hover{transform:translateY(-2px);color:var(--milk)}
.wa-dot{display:flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:999px;background:#25D366;color:#FFFFFF}

/* cambio lingua: polvere di stelle */
[data-i18n],[data-i18n-html]{transition:opacity .6s cubic-bezier(.4,0,.2,1),filter .6s cubic-bezier(.4,0,.2,1)}
.i18n-out{opacity:0!important;filter:blur(3px)}
.i18n-in{animation:i18nIn .85s cubic-bezier(.22,.61,.36,1) both}
@keyframes i18nIn{from{opacity:0;filter:blur(3px)}to{opacity:1;filter:blur(0)}}
#stardust{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:60}

/* pagine legali */
.doc h2{margin:48px 0 12px;font-family:var(--serif);font-weight:500;font-size:30px;line-height:1.15;color:var(--ink)}
.doc p,.doc li{margin:0 0 12px;font-size:17px;line-height:1.7;color:var(--text)}
.doc ul{margin:0 0 12px;padding-left:20px}

/* responsive */
@container page (max-width: 900px){
  .nav-links{display:none!important}
  .hero-photo{max-width:560px}
  .contact-sec{padding-top:80px!important;padding-bottom:80px!important;gap:40px!important}
  .form-card{padding:28px!important;gap:14px!important}
}
@container page (min-width: 561px) and (max-width: 900px){
  .hero-grid{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr)!important;gap:28px!important;align-items:center!important;padding-top:56px!important;padding-bottom:64px!important}
  .hero-grid h1{font-size:46px!important}
  .appro-photo{min-height:0;aspect-ratio:3/2}
  .hero-photo{max-width:none!important;align-self:start!important;margin-top:36px}
  .hero-badge{padding:9px 14px 9px 9px!important;gap:8px!important;bottom:1%!important}
  .hero-badge img{width:28px!important;height:28px!important}
  .hero-badge span{font-size:11px!important}
}
@container page (max-width: 560px){
  .appro-photo{min-height:0;height:auto;aspect-ratio:3/2}
  .head-cta{display:none!important}
  .head-word{height:40px!important}
  .contact-sec{padding-top:64px!important;padding-bottom:64px!important;gap:32px!important}
  .form-card{padding:22px!important;gap:12px!important}
  .form-card .lbl{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .form-card .field{min-height:46px;padding:11px 14px}
  .form-card textarea.field{min-height:92px!important}
  .form-sub{display:none}
  .contact-intro{font-size:16px!important}
  .contact-list a{padding:12px 0!important}
  .foot-in{padding-top:48px!important;padding-bottom:28px!important;gap:32px!important}
  .foot-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:28px 20px!important}
  .foot-grid > div:first-child{grid-column:1 / -1}
  .foot-grid > div{font-size:14px!important}
  .btn{width:100%}
  .btn-sm{width:auto}
  .pad-x{padding-left:20px!important;padding-right:20px!important}
  .hero-badge{padding:10px 16px 10px 10px;gap:10px}
  .hero-badge img{width:30px;height:30px}
  .hero-badge span{font-size:12px!important}
  .mq-quote{font-size:24px}
}
@media (max-width: 560px){
  .wa-float{padding:0;width:50px;height:50px;justify-content:center;right:16px;bottom:16px}
  .wa-label{display:none}
}
@media (prefers-reduced-motion: reduce){
  .marquee{animation:none}
  html{scroll-behavior:auto}
  .card,.card:hover{transition:none;transform:none}
}

/* il russo ha parole più lunghe: titolo principale leggermente più piccolo */
html[lang="ru"] .h1{font-size:clamp(40px,5cqi,70px)!important;line-height:1.02!important}
@container page (min-width: 561px) and (max-width: 900px){ html[lang="ru"] .hero-grid h1{font-size:38px!important} }
/* instagram: polaroid su pannello stellato (prova) */
#ig-feed{gap:36px;padding:48px 44px 52px;border-radius:22px;background:var(--cream) url("../img/stelle.svg");background-size:420px 420px}
#ig-feed .ig-tile{aspect-ratio:auto;overflow:visible;border-radius:3px;background:#FFFFFF;padding:10px 10px 40px;box-shadow:0 12px 28px rgba(46,38,32,.12),0 1px 3px rgba(46,38,32,.08);transform:rotate(var(--tilt,0deg));transition:transform .7s cubic-bezier(.22,.61,.36,1),box-shadow .7s ease}
#ig-feed .ig-tile:nth-child(1){--tilt:-2.2deg}
#ig-feed .ig-tile:nth-child(2){--tilt:1.6deg;margin-top:14px}
#ig-feed .ig-tile:nth-child(3){--tilt:-1deg}
#ig-feed .ig-tile:hover,#ig-feed .ig-tile:focus-visible{transform:rotate(0deg) translateY(-6px);box-shadow:0 22px 44px rgba(46,38,32,.16),0 2px 4px rgba(46,38,32,.08)}
#ig-feed .ig-tile img{aspect-ratio:1/1;height:auto;border-radius:1px}
#ig-feed .ig-tile:hover img{transform:none}
#ig-feed .ig-tile::before{content:"";position:absolute;top:-11px;left:50%;width:78px;height:22px;z-index:3;transform:translateX(-50%) rotate(-3deg);background:repeating-linear-gradient(135deg,rgba(209,160,84,.62) 0 7px,rgba(227,190,133,.62) 7px 14px);box-shadow:0 1px 2px rgba(46,38,32,.08)}
#ig-feed .ig-tile:nth-child(2)::before{transform:translateX(-50%) rotate(4deg)}
#ig-feed .ig-live::after{inset:10px 10px 40px}
#ig-feed .ig-type{top:18px;right:18px}
#ig-feed .ig-over{left:10px;right:10px;bottom:40px;transform:translateY(6px);opacity:0;transition:opacity .5s ease,transform .5s cubic-bezier(.22,.61,.36,1)}
#ig-feed .ig-live:hover .ig-over,#ig-feed .ig-live:focus-visible .ig-over{transform:none;opacity:1}
@media (hover: none){ #ig-feed .ig-over{opacity:1;transform:none} }
@container page (max-width: 560px){
  #ig-feed{gap:8px;margin:0 -20px;padding:30px 12px 32px;border-radius:0}
  #ig-feed .ig-tile{padding:4px 4px 16px}
  #ig-feed .ig-tile img{aspect-ratio:3/4}
  #ig-feed .ig-tile:nth-child(2){margin-top:8px}
  #ig-feed .ig-tile::before{width:40px;height:12px;top:-6px}
  #ig-feed .ig-live::after{inset:4px 4px 16px}
  #ig-feed .ig-over{left:4px;right:4px;bottom:16px;padding:18px 8px 7px}
  #ig-feed .ig-stats{gap:9px}
  #ig-feed .ig-stats svg{width:14px;height:14px}
  #ig-feed .ig-type{top:9px!important;right:9px!important}
}
/* instagram: icone e didascalia nella cornice bianca */
#ig-feed{align-items:start}
#ig-feed .ig-tile{padding:10px 10px 14px;text-decoration:none}
#ig-feed .ig-live::after{display:none}
#ig-feed .ig-over{position:static;opacity:1;transform:none;background:none;color:#2E2620;padding:12px 4px 0;gap:6px}
#ig-feed .ig-stats{color:#2E2620}
#ig-feed .ig-cap{display:-webkit-box;color:#6E6259}
/* hero mobile: titolo, foto, poi testo e bottone */
@container page (max-width: 560px){
  .hero-grid{gap:0!important}
  .hero-grid > div:first-child{display:contents!important}
  .hero-grid > div:first-child > *{order:4}
  .hero-grid > div:first-child > :nth-child(1){order:1;margin-bottom:18px!important}
  .hero-grid > div:first-child > :nth-child(2){order:2;margin-bottom:28px!important}
  .hero-grid > div:first-child > :nth-child(3){margin-bottom:24px!important}
  .hero-grid > div:first-child > :nth-child(4){margin-bottom:18px!important}
  .hero-grid > .hero-photo{order:3;margin-bottom:44px}
  #ig-feed .ig-tile{padding:4px 4px 7px}
  #ig-feed .ig-over{padding:7px 2px 0;gap:4px}
  #ig-feed .ig-stats{gap:7px}
  #ig-feed .ig-stats svg{width:12px;height:12px}
  #ig-feed .ig-cap{font-size:10.5px;line-height:1.35}
}
/* instagram: scotch a stelline + leggera sfumatura scura all'hover */
#ig-feed .ig-tile::before{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='14' viewBox='0 0 16 14'%3E%3Cpath d='M8 2l1.3 2.7 3 .4-2.2 2.1.5 3L8 8.8 5.4 10.2l.5-3L3.7 5.1l3-.4z' fill='%23FFFFFF' fill-opacity='.9'/%3E%3C/svg%3E") 0 0/16px 14px repeat,rgba(209,160,84,.62)}
#ig-feed .ig-tile img{transition:filter .6s ease}
#ig-feed .ig-tile:hover img,#ig-feed .ig-tile:focus-visible img{filter:brightness(.86)}
@container page (max-width: 560px){ #ig-feed .ig-tile::before{background-size:9px 8px,auto} }

/* lezioni: griglia bento (6 tipologie + foto) */
.bento{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.bento + div{margin-top:-28px}
.bento-photo{grid-column:2 / span 2;grid-row:1 / span 2;border-radius:16px;overflow:hidden;min-height:340px;background:#EEEAE5}
.bento-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 25%;display:block}
.bento-tile{display:flex;flex-direction:column;gap:6px;padding:24px;border-radius:16px;min-width:0}
.bento-tile:nth-last-child(-n+2){grid-column:span 2}
.bento-ic{width:42px;height:42px;border-radius:999px;display:grid;place-items:center;background:#F5ECDA;color:#8A6420;margin-bottom:6px}
.bento-ic svg{width:21px;height:21px}
.bento-tag{margin:0;font-size:12px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:#6E6259}
.bento-tile h3{margin:0;font-family:var(--serif);font-weight:500;font-size:30px;line-height:1.08;color:#2E2620}
.bento-text{margin:0;font-size:16px;line-height:1.5;color:#4A4038;text-wrap:pretty}
.bt-white{background:#FFFFFF}
.bt-cream{background:#F5ECDA}.bt-cream .bento-ic{background:#FBF8F3}
.bt-ink{background:#2E2620}.bt-ink h3{color:#FBF8F3}.bt-ink .bento-text{color:#E9DCC6}.bt-ink .bento-tag{color:#CDBBA3}.bt-ink .bento-ic{background:#43382F;color:#D1A054}
.bt-ink:hover{box-shadow:0 18px 44px rgba(46,38,32,.30)}
.bt-honey{background:#D1A054}.bt-honey .bento-tag,.bt-honey .bento-text{color:#2E2620}.bt-honey .bento-ic{background:rgba(255,255,255,.45);color:#2E2620}
@container page (max-width: 900px){
  .bento{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
  .bento-photo{grid-column:1 / -1;grid-row:auto;order:-1;min-height:0;aspect-ratio:21/9}
  .bento-tile:nth-last-child(-n+2){grid-column:auto}
  .bento-tile{padding:18px}
  .bento-tile h3{font-size:24px}
  .bento-text{font-size:15px}
}
@container page (max-width: 560px){
  .bento{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .bento + div{margin-top:-16px}
  .bento-photo{aspect-ratio:16/10;border-radius:12px}
  .bento-tile{padding:13px 12px;gap:4px;border-radius:12px}
  .bento-ic{width:30px;height:30px;margin-bottom:4px}.bento-ic svg{width:16px;height:16px}
  .bento-tag{font-size:10px;letter-spacing:.1em;line-height:1.3}
  .bento-tile h3{font-size:20px}
  .bento-text{font-size:13px;line-height:1.4}
}

/* footer: link legali vanno a capo nelle lingue lunghe */
.foot-in > div:last-child > div{flex-wrap:wrap;justify-content:center;row-gap:8px}

/* footer: griglia per computer, tablet e telefono; lezioni su due colonne */
.foot-lessons-list{display:grid;grid-template-columns:repeat(2,minmax(0,max-content));grid-template-rows:repeat(3,auto);grid-auto-flow:column;column-gap:36px;row-gap:10px}
.foot-lessons-list a{overflow-wrap:anywhere}
.foot-grid > div{min-width:0}
.foot-grid a,.foot-grid span{overflow-wrap:anywhere}
@container page (min-width: 1001px){
  .foot-grid{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr) minmax(0,1.2fr) minmax(0,1.55fr)!important;gap:40px!important}
}
@container page (min-width: 561px) and (max-width: 1000px){
  .foot-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:36px 32px!important}
  .foot-grid > div:first-child{grid-column:1 / -1}
  .foot-lessons{grid-column:1 / -1}
}
@container page (max-width: 560px){
  .foot-lessons{grid-column:1 / -1}
  .foot-lessons-list{column-gap:20px;grid-template-columns:repeat(2,minmax(0,1fr))}
}
