/*
Theme Name: Stellinea
Theme URI: https://stellinea.it
Author: Studio Woland
Author URI: https://www.studiowoland.com
Description: Tema della landing page Stellinea — Arci Parma. Tutti i testi e le immagini sono modificabili da Aspetto → Personalizza.
Version: 1.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: stellinea
*/

html, body { margin: 0; padding: 0; background: #191919; }
* { box-sizing: border-box; }
a { color: #CBAEF8; text-decoration: none; }
a:hover { color: #FFF9B0; }
img { max-width: 100%; }
input::placeholder { color: #C9C9E2; opacity: .55; }

@keyframes twinkle { 0%, 100% { opacity: .15; transform: scale(.7); } 50% { opacity: 1; transform: scale(1); } }
@keyframes drift { 0% { transform: translateY(0); } 100% { transform: translateY(-14px); } }

.sl-menu-toggle { position: absolute; opacity: 0; pointer-events: none; }
.sl-burger { display: none; }

@media (max-width: 899px) {
  #sl-header { flex-wrap: wrap; }
  .sl-burger {
    display: flex; flex-direction: column; justify-content: center; gap: 5px;
    width: 48px; height: 48px; padding: 0 12px; cursor: pointer;
    border: 1px solid rgba(238,238,255,.28); border-radius: 14px;
  }
  .sl-burger span { display: block; height: 2px; border-radius: 2px; background: #EEEEFF; transition: transform .22s ease, opacity .22s ease; }
  .sl-menu-toggle:checked ~ .sl-burger span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .sl-menu-toggle:checked ~ .sl-burger span:nth-child(2) { opacity: 0; }
  .sl-menu-toggle:checked ~ .sl-burger span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
  .sl-nav {
    display: none !important; order: 3; width: 100%;
    flex-direction: column !important; flex-wrap: nowrap !important;
    gap: 2px !important; margin: 10px -4px 6px; font-size: 14px !important;
  }
  .sl-menu-toggle:checked ~ .sl-nav { display: flex !important; }
  .sl-nav .sl-navlink { padding: 15px 2px; border-bottom: 1px solid rgba(201,201,226,.12); }
  .sl-nav .sl-btn-primary { justify-content: center; height: 50px !important; margin-top: 14px; }
}

.sl-navlink { color: #EEEEFF; }
.sl-navlink:hover { color: #CBAEF8; }
.sl-btn-primary:hover { background: #FFF9B0; color: #191919; }
.sl-btn-ghost:hover { border-color: #CBAEF8; color: #CBAEF8; }
.sl-card:hover { background: #1F1F24; }
.sl-mapframe:hover { border-color: #CBAEF8; }
.sl-underline-wrap a { color: #CBAEF8; text-decoration: underline; }
.sl-underline-wrap a:hover { color: #FFF9B0; }

/* la barra di amministrazione non deve spostare il layout sticky */
body.admin-bar #sl-header { top: 32px; }
@media screen and (max-width: 782px) { body.admin-bar #sl-header { top: 46px; } }

/* pagine interne (articoli, pagine WordPress) */
.sl-page { max-width: 760px; margin: 0 auto; padding: clamp(48px,7vw,96px) clamp(18px,4vw,56px); color: #EEEEFF; font-family: Quicksand, system-ui, sans-serif; }
.sl-page h1, .sl-page h2, .sl-page h3 { font-family: Commissioner, system-ui, sans-serif; text-transform: uppercase; line-height: .98; font-weight: 700; }
.sl-page h1 { font-size: clamp(34px,5vw,64px); margin: 0 0 24px; }
.sl-page h2 { font-size: clamp(26px,3.4vw,42px); margin: 40px 0 16px; }
.sl-page p, .sl-page li { font-size: 17px; line-height: 1.75; color: #C9C9E2; }
.sl-page img { height: auto; border-radius: 16px; }