/* GRANFONDO COLLI TERAMANI — restyling 2027 | compatible with existing CMS */
:root{--accent:#82a93b;--ink:#142321;--cream:#f6f5f0;--line:#dce3d8;--grey:#5c6965}
body{background:var(--cream);color:var(--ink)}
.site-header{position:sticky;top:0;z-index:100;background:rgba(16,30,29,.96);border:0;box-shadow:0 5px 30px #0002;backdrop-filter:blur(12px)}
.site-header .nav a,.site-header .nav-parent,.site-header .menu-toggle{color:#fff}
.site-header .nav a:hover,.site-header .nav a.active,.site-header .nav-parent:hover{color:#b5db70}
.site-header .nav-sub{background:#152c28}
.site-header .nav-sub a{color:#fff}
.site-header .logo img{max-height:76px;width:auto;object-fit:contain}
.btn{background:var(--accent);border-color:var(--accent);color:#102017;border-radius:5px;font-weight:800;transition:transform .2s,background .2s}
.btn:hover{background:#a7cf60;border-color:#a7cf60;color:#102017;transform:translateY(-2px)}
.hero{min-height:650px;align-items:center;background:#19342c}
.hero:before{background:linear-gradient(90deg,rgba(9,24,24,.91) 0%,rgba(9,24,24,.58) 45%,rgba(9,24,24,.18) 100%),url('foto-partenza-pulita.webp') center 46%/cover no-repeat;opacity:1}
.hero .wrap{padding-top:110px;padding-bottom:120px}
.hero h1{font-size:clamp(65px,8vw,124px);max-width:960px;text-shadow:0 3px 28px #0006;letter-spacing:-.02em}
.hero p{font-size:clamp(17px,2vw,21px);max-width:640px;color:#f0f4ed}
.hero .eyebrow{color:#c6e88d;font-weight:800}
.hero .btn-outline{border-color:#f1f5ee;background:#ffffff10;color:#fff}
.hero .btn-outline:hover{background:#fff;color:#102017}
.section{padding:86px 0}
.section.alt{background:#fff}
.section-heading h2,.intro h2{letter-spacing:-.015em}
.section .eyebrow{color:#5f8428}
.intro{gap:55px}
.intro-cycling-photo img{box-shadow:0 22px 45px #132a2526}
.cards{gap:24px}
.route{background:#fff;border:1px solid #e1e7dc;border-top:5px solid var(--accent);border-radius:9px;overflow:hidden;padding:22px;box-shadow:0 10px 35px #18271b0c;transition:transform .2s,box-shadow .2s}
.route:hover{transform:translateY(-4px);box-shadow:0 20px 42px #18271b20}
.route .photo-placeholder{border-radius:5px;overflow:hidden}
.mini{border-radius:8px;transition:transform .2s}
.mini:hover{transform:translateY(-3px)}
.text-link{color:#466f1e;font-weight:800}
.site-footer{background:#0f211d;color:#edf5e8}
.site-footer a{color:#edf5e8}
.site-footer a:hover{color:#b5db70}
:focus-visible{outline:3px solid #c7ee86;outline-offset:3px}
@media(max-width:800px){.site-header{position:relative}.hero{min-height:540px}.hero:before{background-position:56% center}.hero .wrap{padding-top:90px;padding-bottom:90px}.hero h1{font-size:clamp(54px,12vw,84px)}.section{padding:58px 0}.intro{gap:28px}}
@media(prefers-reduced-motion:reduce){.btn,.route,.mini{transition:none}}


/* HEADER UNIFICATO: dimensioni logo e spaziatura mobile */
.site-header .logo {width:220px;min-width:220px;flex-shrink:0;display:flex;align-items:center}
.site-header .logo img {display:block;width:210px;max-width:100%;height:132px;max-height:none;object-fit:contain}
.site-header .header-inner {min-height:142px}
@media (max-width:1100px) {
  .site-header .logo {width:170px;min-width:170px}
  .site-header .logo img {width:165px;height:105px}
  .site-header .header-inner {min-height:112px}
}
@media (max-width:1000px) {
  .site-header .nav.open {margin:12px 0 8px;padding:12px 24px;border-radius:14px;box-sizing:border-box;background:#101d19}
  .site-header .nav.open > a, .site-header .nav.open .nav-parent {padding:17px 14px;line-height:1.4}
  .site-header .nav.open .nav-sub {padding-left:18px}
  .site-header .nav.open .nav-sub a {padding:13px 12px}
}
@media (max-width:700px) {
  .site-header .logo {width:150px;min-width:150px}
  .site-header .logo img {width:148px;height:96px}
  .site-header .header-inner {min-height:104px}
  .site-header .nav.open {margin:12px 0 8px;padding:12px 22px}
}

/* CONTATTI: riduzione spazio tra introduzione e schede */
body:has(.gf-contact-grid) .page-hero {
  padding-top: 42px;
  padding-bottom: 32px;
}
body:has(.gf-contact-grid) .section:has(.gf-contact-grid) {
  padding-top: 36px;
  padding-bottom: 58px;
}
@media (max-width: 768px) {
  body:has(.gf-contact-grid) .page-hero {
    padding-top: 30px;
    padding-bottom: 24px;
  }
  body:has(.gf-contact-grid) .section:has(.gf-contact-grid) {
    padding-top: 26px;
    padding-bottom: 42px;
  }
}