/* Sortides de muntanya — mapa + seccions. Usa els tokens de home.css (--gold, --ink, ...) */

/* INTRO (centrada) */
.sortides-intro{padding:38px 0 14px;text-align:center}
.sortides-intro .wrap{max-width:760px}
.sortides-intro .eyebrow{display:inline-block}
.sortides-intro h2{font-family:"Mulish",sans-serif;font-weight:800;font-size:clamp(1.5rem,3.2vw,2.1rem);color:var(--ink);margin:6px 0 10px;line-height:1.15}
.sortides-intro p{color:var(--muted);font-size:1.05rem;margin:0 auto}

/* ESTADÍSTIQUES (línia discreta de xifres, sense caixa) */
.sortides-stats{padding:2px 0 6px}
.stats-band{
  display:flex;flex-wrap:wrap;justify-content:center;align-items:baseline;
  gap:6px 0;text-align:center;
}
.stat{padding:3px 22px;position:relative;line-height:1.35;white-space:nowrap}
.stat + .stat::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);height:1.05em;width:1px;background:var(--line)}
.stat__num{font-family:"Mulish",sans-serif;font-weight:800;color:var(--ink);font-size:1.1rem}
.stat__lab{color:var(--muted);font-size:.86rem;font-weight:600;margin-left:7px}

/* MAPA (amplada completa) */
.sortides-wrap{padding:16px 0 12px}
.map-hint{text-align:center;color:var(--muted);font-size:.9rem;margin:12px 0 0}
#sortides-map{
  width:100%;height:66vh;min-height:440px;
  border-radius:16px;overflow:hidden;
  border:1px solid var(--line);
  box-shadow:0 18px 40px -22px rgba(20,18,14,.55);
  z-index:0;
}

/* Popup de Leaflet a l'estil de marca */
.leaflet-popup-content-wrapper{border-radius:14px;box-shadow:0 14px 34px -14px rgba(0,0,0,.5)}
.leaflet-popup-content{margin:0;width:238px !important}
.sortida-pop{overflow:hidden;border-radius:14px}
.sortida-pop img{display:block;width:100%;height:130px;object-fit:cover}
.sortida-pop h3{margin:10px 12px 2px;font-family:"Mulish",sans-serif;font-weight:800;color:var(--ink);font-size:1.05rem;line-height:1.2}
.sortida-pop h3 .alt{color:var(--gold-d);font-size:.8em;font-weight:700}
.sortida-pop .zona{margin:0 12px;color:var(--muted);font-size:.85rem}
.sortida-pop .data{margin:4px 12px 0;color:var(--ink);font-size:.85rem}
.sortida-pop .stats{display:flex;flex-wrap:wrap;gap:6px;margin:8px 12px 2px}
.sortida-pop .stats span{background:#fbf6ea;border:1px solid var(--line);border-radius:8px;padding:3px 8px;font-size:.8rem;color:var(--ink-2)}
.sortida-pop .stats b{color:var(--gold-d)}
.sortida-pop .desc{margin:6px 12px;color:var(--ink-2);font-size:.85rem}
.sortida-pop .lnk{display:block;margin:8px 12px 12px;font-weight:700;color:var(--gold-d);text-decoration:none;font-size:.88rem}
.sortida-pop .lnk:hover{text-decoration:underline}
.sortida-pin{background:none;border:none;filter:drop-shadow(1px 3px 3px rgba(0,0,0,.35))}

/* Separador horitzontal entre seccions (com a la resta del web) */
.sec-line{border-top:1px solid var(--line)}

/* CRIDA A FER-SE SOCI (banner destacat) */
.soci-cta{padding:34px 0 10px}
.soci-cta__inner{
  position:relative;overflow:hidden;text-align:center;
  background:linear-gradient(135deg,var(--gold),#ffd451);
  border-radius:22px;padding:44px 28px;
  box-shadow:0 26px 54px -28px rgba(180,140,20,.75);
}
.soci-cta__inner::before,.soci-cta__inner::after{
  content:"";position:absolute;bottom:0;width:0;height:0;opacity:.18;
  border-left:120px solid transparent;border-right:120px solid transparent;border-bottom:170px solid var(--ink);
}
.soci-cta__inner::before{left:-40px}
.soci-cta__inner::after{right:-40px}
.soci-cta__inner>*{position:relative;z-index:1}
.soci-cta .eyebrow{color:var(--ink)}
.soci-cta h2{font-family:"Mulish",sans-serif;font-weight:800;color:var(--ink);font-size:clamp(1.6rem,3.6vw,2.4rem);margin:6px 0 10px;line-height:1.12}
.soci-cta p{color:var(--ink-2);max-width:620px;margin:0 auto 18px;font-size:1.05rem}
.soci-cta__perks{list-style:none;padding:0;margin:0 auto 22px;display:flex;flex-wrap:wrap;justify-content:center;gap:10px 22px;max-width:720px}
.soci-cta__perks li{display:inline-flex;align-items:center;gap:8px;color:var(--ink);font-weight:700;font-size:.95rem}
.soci-cta__perks svg{width:20px;height:20px;color:var(--ink);background:rgba(20,18,14,.12);border-radius:50%;padding:3px}
.soci-cta__btns{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.btn--ghost{background:transparent;color:var(--ink);border:2px solid rgba(20,18,14,.5)}
.btn--ghost:hover{background:rgba(20,18,14,.08)}

/* PROPERES SORTIDES */
.properes{padding:40px 0 44px}
.properes__cta{text-align:center;margin-top:2px}
.properes__cta .btn{white-space:nowrap}

/* SEGUEIX-NOS (xarxes) */
.segueix{padding:40px 0 60px}
.sl-head{text-align:center;max-width:720px;margin:0 auto 26px}
.sl-head h2{font-family:"Mulish",sans-serif;font-weight:800;font-size:clamp(1.4rem,2.8vw,2rem);color:var(--ink);margin:6px 0 8px;line-height:1.15}
.sl-head p{color:var(--muted);margin:0}

.social-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.social{
  display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;
  text-decoration:none;background:#fff;border:1px solid var(--line);border-radius:18px;
  padding:28px 20px;position:relative;overflow:hidden;
  box-shadow:0 16px 34px -24px rgba(20,18,14,.5);
  transition:transform .16s,box-shadow .16s,border-color .16s;
}
.social::before{content:"";position:absolute;inset:0 0 auto 0;height:5px;background:var(--brand,var(--gold))}
.social:hover{transform:translateY(-4px);box-shadow:0 24px 40px -20px rgba(20,18,14,.45);border-color:var(--brand,var(--gold))}
.social__ic{
  width:64px;height:64px;border-radius:50%;display:grid;place-items:center;margin-top:6px;
  background:var(--brand,var(--gold));color:#fff;
}
.social__ic svg{width:32px;height:32px}
.social__nom{font-family:"Mulish",sans-serif;font-weight:800;font-size:1.15rem;color:var(--ink);margin-top:4px}
.social__sub{color:var(--muted);font-size:.85rem;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:0 4px}
.social--ig{--brand:#E1306C}
.social--ig .social__ic{background:linear-gradient(45deg,#F58529,#DD2A7B,#8134AF)}
.social--fb{--brand:#1877F2}
.social--wk{--brand:#2E8B57}

@media (max-width:820px){
  .social-grid{grid-template-columns:1fr}
  #sortides-map{height:58vh;min-height:360px}
  .stat{padding:3px 15px}
}
@media (max-width:420px){
  .stat{padding:3px 11px}
  .stat__lab{font-size:.8rem}
}
