/* Mediastile — stili del tema (mobile-first) */
:root{
  --ink:#181816; --white:#fff; --lilac:#d1a4ff; --violet:#5b4b9a;
  --font-brand:var(--wp--preset--font-family--syne);
  --font-ui:var(--wp--preset--font-family--inter);
  --step-brand:clamp(3rem,11vw,9rem);
  --step-mail:clamp(1.5rem,5vw,3.5rem);
  --gap:2px; --header-h:56px; --tap:44px; --cols:2;
}
@media (min-width:900px){:root{--cols:4}}
@media (min-width:1400px){:root{--cols:5}}
@media (min-width:1800px){:root{--cols:6}}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:var(--header-h)}
html:has(dialog[open]){overflow:hidden}
body{margin:0;font-family:var(--font-ui)}
.wp-site-blocks{min-height:100svh;display:flex;flex-direction:column}
.site-main{flex:1}
img{display:block;max-width:100%;height:auto}

.theme-dark{--accent:var(--lilac);background:var(--ink);color:var(--white)}
.theme-light{--accent:var(--violet);background:var(--white);color:var(--ink)}
.theme-dark a,.theme-light a{color:inherit}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px}

.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* header */
.site-header__inner{height:var(--header-h);padding:0 4px 0 16px;flex-wrap:nowrap}
.theme-light .site-header{position:sticky;top:var(--wp-admin--admin-bar--height,0px);z-index:10;background:var(--white);border-bottom:1px solid #e6e6e6}
.theme-dark .site-header{position:absolute;inset:0 0 auto 0;z-index:10;background:linear-gradient(rgb(24 24 22 / .7),transparent)}
.logo{margin:0}
.logo a{display:flex;align-items:center;min-height:var(--tap)}
.logo img{height:28px!important;width:auto!important}
.theme-light .logo img{mix-blend-mode:multiply}
.theme-dark .logo img{filter:invert(1);mix-blend-mode:screen}
.nav,.nav a{color:inherit}
.nav .wp-block-navigation__container{gap:0}
.nav .wp-block-navigation-item__content{display:inline-flex;align-items:center;min-height:var(--tap);padding:0 12px;font-weight:500;text-decoration:underline;text-decoration-color:transparent;text-decoration-thickness:2px;text-underline-offset:6px}
.nav .wp-block-navigation-item__content:hover,.nav .wp-block-navigation-item__content[aria-current="page"]{text-decoration-color:var(--accent)}

/* home */
.hero{position:relative}
.hero-image{margin:0}
.hero-image img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;object-position:62% 40%}
.hero-title{margin:0;padding:16px 16px 24px;font:800 var(--step-brand)/.9 var(--font-brand);letter-spacing:-.02em}
@media (min-width:900px){
  .hero{height:100svh;min-height:560px}
  .hero-image,.hero-image img{height:100%;aspect-ratio:auto}
  .hero::after{content:"";position:absolute;inset:auto 0 0 0;height:55%;background:linear-gradient(transparent,rgb(24 24 22 / .8));pointer-events:none}
  .hero-title{position:absolute;z-index:1;left:32px;bottom:32px;padding:0}
}
.peek{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--gap);margin-top:var(--gap);height:clamp(120px,40vw,200px);overflow:hidden}
.peek img{width:100%;aspect-ratio:4/5;object-fit:cover}
.peek img:nth-child(n+3){display:none}
@media (min-width:900px){
  .peek{grid-template-columns:repeat(4,1fr);height:clamp(160px,18vw,300px)}
  .peek img:nth-child(n+3){display:block}
}

/* galleria: il blocco Galleria di WordPress trasformato in griglia stile Instagram */
.foto-page .wp-block-gallery.has-nested-images{display:grid;grid-template-columns:repeat(var(--cols),1fr);gap:var(--gap);margin:0;padding:0}
.foto-page .wp-block-gallery.has-nested-images figure.wp-block-image:not(#individual-image){width:auto;margin:0;flex:none;aspect-ratio:4/5;overflow:hidden;position:relative;background:#eee}
.foto-page .wp-block-gallery.has-nested-images figure.wp-block-image:not(#individual-image) a{display:block;height:100%;cursor:zoom-in}
.foto-page .wp-block-gallery.has-nested-images figure.wp-block-image:not(#individual-image) img{width:100%;height:100%;flex:none;object-fit:cover;object-position:50% 35%}
.foto-page .wp-block-gallery figcaption{display:none}
.foto-page .wp-block-gallery figure.wp-block-image :focus-visible,
.foto-page .wp-block-gallery figure.wp-block-image:focus-visible{outline:3px solid var(--violet);outline-offset:-3px}

/* contatti e 404 */
.contact{min-height:calc(100svh - var(--header-h) - 64px);display:grid;place-content:center;justify-items:center;gap:32px;padding:32px 16px;text-align:center}
.mail{margin:0;font:800 var(--step-mail)/1.1 var(--font-brand);color:var(--violet);overflow-wrap:anywhere}
.mail a{color:var(--violet);text-decoration:underline;text-decoration-thickness:.06em;text-underline-offset:.15em}
.mail a:hover{color:var(--ink)}
.social.wp-block-social-links{margin:0;padding:0;gap:8px}
.social .wp-social-link a{display:grid;place-items:center;width:var(--tap);height:var(--tap);padding:0;color:var(--ink)}
.social .wp-social-link a:hover{color:var(--violet)}
.social .wp-social-link svg{width:28px;height:28px}

/* footer */
.site-footer{padding:16px;font-size:.875rem}
.footer-text{margin:0}
.theme-light .site-footer{color:#555}
.theme-dark .site-footer{color:#bdbdbd}

/* lightbox */
.lightbox{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;background:rgb(24 24 22 / .96);color:var(--white);touch-action:pan-y}
.lightbox[open]{display:grid;place-items:center}
.lightbox::backdrop{background:var(--ink)}
.lb-img{max-width:100%;max-height:100svh;width:auto;height:auto;object-fit:contain}
.lb-btn{position:absolute;display:grid;place-items:center;width:48px;height:48px;padding:0;border:0;border-radius:50%;background:rgb(24 24 22 / .6);color:var(--white);cursor:pointer}
.lb-btn:focus-visible{outline-color:var(--lilac)}
.lb-btn svg{width:24px;height:24px}
.lb-close{top:12px;right:12px}
.lb-prev{left:12px;top:50%;translate:0 -50%}
.lb-next{right:12px;top:50%;translate:0 -50%}
.lb-count{position:absolute;left:0;right:0;bottom:12px;margin:0;text-align:center;font-size:.875rem;text-shadow:0 1px 3px #000}

/* passaggio di pagina: la "luce che si accende" */
@media (prefers-reduced-motion:no-preference){
  @view-transition{navigation:auto}
  ::view-transition-group(root){animation-duration:.6s}
}