/*
Theme Name: La Camilla
Theme URI: https://www.centroippicolacamilla.com
Author: Centro Ippico e Cinofilo La Camilla SSD
Description: Tema su misura per il Centro Ippico e Cinofilo La Camilla SSD di Cinisello Balsamo. Intestazione e pie di pagina sono gestiti dal tema; tutti i contenuti si modificano dalle pagine.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 7.1
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: lacamilla
Tags: one-column, custom-menu, custom-logo, editor-style, block-patterns
*/

/* ============================================================
   FONT INCORPORATI
   Caricati dal server del sito, non da Google: evita di inviare
   l'indirizzo IP dei visitatori a terze parti (GDPR).
   ============================================================ */
@font-face{
  font-family:"Fraunces";
  src:url("assets/fonts/fraunces-latin.woff2") format("woff2");
  font-weight:300 900;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:"Fraunces";
  src:url("assets/fonts/fraunces-italic-latin.woff2") format("woff2");
  font-weight:300 900;
  font-style:italic;
  font-display:swap;
}
@font-face{
  font-family:"Karla";
  src:url("assets/fonts/karla-latin.woff2") format("woff2");
  font-weight:400 700;
  font-style:normal;
  font-display:swap;
}

/* ============================================================
   TOKEN DI DESIGN
   I colori vengono dal logo: il blu e quello del marchio.
   ============================================================ */
:root{
  --lc-crema:#f4f2e9;
  --lc-carta:#f8f7f1;
  --lc-sabbia:#e3decf;
  --lc-blu:#286cab;
  --lc-blu-fondo:#003b7f;
  --lc-oro:#cd9a50;
  --lc-inchiostro:#0d1e2f;
  --lc-tenue:#3c4f62;
  --lc-display:"Fraunces",Georgia,"Times New Roman",serif;
  --lc-testo:"Karla",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --lc-guscio:1120px;
}

*,*::before,*::after{box-sizing:border-box}

body{
  margin:0;
  background:var(--lc-crema);
  color:var(--lc-inchiostro);
  font-family:var(--lc-testo);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img,video,iframe{max-width:100%;height:auto;display:block}
a{color:inherit}
:focus-visible{outline:2px solid var(--lc-blu);outline-offset:3px;border-radius:4px}

.lc-guscio{max-width:var(--lc-guscio);margin-inline:auto;padding-inline:24px}

/* accessibilita: salta al contenuto */
.lc-salta{
  position:absolute;left:-9999px;top:0;z-index:100;
  background:var(--lc-inchiostro);color:var(--lc-crema);
  padding:12px 20px;border-radius:0 0 8px 0;
}
.lc-salta:focus{left:0}

/* ============================================================
   TIPOGRAFIA
   ============================================================ */
h1,h2,h3,h4{
  font-family:var(--lc-display);font-weight:600;
  letter-spacing:-.02em;text-wrap:balance;margin:0;
}
h1{font-size:clamp(2.2rem,5vw,3.6rem);line-height:1.03}
h2{font-size:clamp(1.8rem,3.4vw,2.6rem);line-height:1.1}
h3{font-size:1.28rem;line-height:1.25}
h4{font-size:1.08rem}
h1 em,h2 em{font-style:italic;color:var(--lc-blu);font-weight:500}
p{margin:0}

.lc-occhiello{
  font-size:11.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;
  color:var(--lc-oro);margin:0 0 12px;display:flex;align-items:center;gap:9px;
  font-family:var(--lc-testo);
}
.lc-occhiello::before{content:"";width:22px;height:1.5px;background:var(--lc-oro);flex:none}

/* ============================================================
   BOTTONI
   :not(.lc-bottone) sui selettori dei link evita che il colore
   del testo dei bottoni venga sovrascritto dal contesto.
   ============================================================ */
.lc-bottone{
  display:inline-block;border-radius:999px;padding:13px 26px;
  font-family:var(--lc-testo);font-weight:600;font-size:15px;
  text-decoration:none;border:0;cursor:pointer;
  transition:background .15s,border-color .15s,color .15s;
}
.lc-bottone-pieno{background:var(--lc-blu-fondo);color:var(--lc-crema)}
.lc-bottone-pieno:hover{background:var(--lc-inchiostro);color:var(--lc-crema)}
.lc-bottone-vuoto{border:1.5px solid rgba(13,30,47,.22);color:var(--lc-inchiostro);background:none}
.lc-bottone-vuoto:hover{border-color:var(--lc-blu-fondo);color:var(--lc-blu-fondo)}
.lc-bottone-chiaro{border:1.5px solid rgba(244,242,233,.4);color:var(--lc-crema);background:none}
.lc-bottone-chiaro:hover{background:rgba(244,242,233,.12);color:var(--lc-crema)}

/* ============================================================
   INTESTAZIONE
   ============================================================ */
.lc-testata{
  border-bottom:1px solid rgba(13,30,47,.08);
  position:sticky;top:0;z-index:30;background:var(--lc-crema);
}
.admin-bar .lc-testata{top:32px}
@media(max-width:782px){.admin-bar .lc-testata{top:46px}}

.lc-testata > div{
  display:flex;align-items:center;justify-content:space-between;
  gap:20px;flex-wrap:wrap;padding-block:16px;
}
.lc-marchio img{width:176px;height:auto}
.lc-marchio{display:block;line-height:0}

.lc-navigazione ul{
  display:flex;flex-wrap:wrap;gap:4px 22px;align-items:center;
  list-style:none;margin:0;padding:0;
  font-size:14.5px;font-weight:500;color:var(--lc-tenue);
}
.lc-navigazione a{text-decoration:none;padding-block:4px;display:inline-block;
  transition:color .15s}
.lc-navigazione a:not(.lc-bottone):hover{color:var(--lc-blu-fondo)}
.lc-navigazione .current-menu-item > a,
.lc-navigazione .current_page_item > a{
  color:var(--lc-blu-fondo);font-weight:600;box-shadow:inset 0 -2px 0 var(--lc-oro);
}
/* il pulsante di richiamo si aggiunge dal menu con la classe lc-bottone */
.lc-navigazione .lc-bottone,
.lc-navigazione .menu-item.lc-cta > a{
  background:var(--lc-blu-fondo);color:var(--lc-crema);
  border-radius:999px;padding:13px 26px;font-weight:600;box-shadow:none;
}
.lc-navigazione .menu-item.lc-cta > a:hover{background:var(--lc-inchiostro);color:var(--lc-crema)}

/* apri/chiudi su telefono */
.lc-apri-menu{
  display:none;background:none;border:1.5px solid rgba(13,30,47,.2);
  border-radius:999px;padding:9px 16px;font-family:var(--lc-testo);
  font-weight:600;font-size:14px;cursor:pointer;color:var(--lc-inchiostro);
}
@media(max-width:860px){
  .lc-apri-menu{display:block}
  .lc-navigazione{flex-basis:100%;display:none}
  .lc-navigazione.aperto{display:block}
  .lc-navigazione ul{flex-direction:column;align-items:stretch;gap:0}
  .lc-navigazione li{border-top:1px solid rgba(13,30,47,.1)}
  .lc-navigazione a{padding:13px 0}
  .lc-navigazione .menu-item.lc-cta > a{
    display:inline-block;margin:12px 0;padding:13px 26px;
  }
}

/* ============================================================
   CONTENUTO DELLE PAGINE
   Stili per i blocchi standard, cosi il testo scritto
   nell'editor risulta gia impaginato.
   ============================================================ */
.lc-contenuto{padding-block:8px 0}
.lc-contenuto > *{
  max-width:var(--lc-guscio);
  margin-inline:auto;
  padding-inline:24px;
}
.lc-contenuto > .alignfull{max-width:none;padding-inline:0}
.lc-contenuto > .alignwide{max-width:1280px}

.lc-contenuto p,
.lc-contenuto li{font-size:1.02rem;line-height:1.65;color:var(--lc-tenue);max-width:64ch}
.lc-contenuto h2,.lc-contenuto h3{color:var(--lc-inchiostro)}
.lc-contenuto > * + *{margin-top:22px}
.lc-contenuto > h2{margin-top:52px}
.lc-contenuto > h3{margin-top:38px}
.lc-contenuto a:not(.lc-bottone){color:var(--lc-blu-fondo);font-weight:600}
.lc-contenuto img{border-radius:24px}
.lc-contenuto figure{margin:0}
.lc-contenuto figcaption{
  font-size:13.4px;color:var(--lc-tenue);margin-top:9px;
}
.lc-contenuto ul,.lc-contenuto ol{padding-left:22px}
.lc-contenuto li + li{margin-top:9px}
.lc-contenuto blockquote{
  border-left:3px solid var(--lc-oro);padding-left:22px;margin:0;
  font-family:var(--lc-display);font-size:1.24rem;line-height:1.45;
  color:var(--lc-inchiostro);
}

/* ============================================================
   SEZIONI RICORRENTI (usate dai modelli pronti)
   ============================================================ */
.lc-sezione{padding-block:66px}
.lc-sezione-chiara{background:var(--lc-carta);border-block:1px solid rgba(13,30,47,.07)}
.lc-sezione-sabbia{background:var(--lc-sabbia)}
.lc-scuro{background:var(--lc-blu-fondo);color:var(--lc-crema)}
.lc-scuro h2,.lc-scuro h3{color:var(--lc-crema)}
.lc-scuro p,.lc-scuro li{color:rgba(244,242,233,.82)}

/* apertura con testo e foto */
.lc-apertura{display:grid;gap:42px;align-items:center;padding-block:52px 64px}
@media(min-width:900px){.lc-apertura{grid-template-columns:1fr 1.05fr;gap:56px}}
.lc-apertura-testo{display:flex;flex-direction:column;align-items:flex-start;gap:20px}
.lc-apertura-testo p{font-size:1.08rem;color:var(--lc-tenue);max-width:46ch}
.lc-azioni{display:flex;flex-wrap:wrap;gap:12px;margin-top:4px}
.lc-apertura > img,.lc-apertura > figure > img{
  width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 30%;
  border-radius:28px;background:var(--lc-sabbia);
}
@media(min-width:900px){.lc-apertura > img,.lc-apertura > figure > img{aspect-ratio:5/6}}
.lc-apertura-larga > img,.lc-apertura-larga > figure > img{aspect-ratio:3/2;object-position:50% 42%}

/* due colonne testo + foto */
.lc-duo{display:grid;gap:42px;align-items:center}
@media(min-width:900px){.lc-duo{grid-template-columns:.85fr 1fr;gap:54px}}
.lc-duo > img,.lc-duo > figure > img{
  width:100%;aspect-ratio:3/4;object-fit:cover;object-position:50% 26%;
  border-radius:28px;background:var(--lc-sabbia);
}
.lc-duo-testo{display:flex;flex-direction:column;gap:16px;align-items:flex-start}
.lc-duo-invertito{direction:rtl}
.lc-duo-invertito > *{direction:ltr}

/* schede dei due centri */
.lc-centri{display:grid;gap:24px;margin-top:32px}
@media(min-width:820px){.lc-centri{grid-template-columns:1fr 1fr}}
.lc-centro{
  background:var(--lc-carta);border:1px solid rgba(13,30,47,.09);
  border-radius:26px;padding:32px 28px;
  display:flex;flex-direction:column;gap:16px;
}
.lc-centro-ippico{border-top:4px solid var(--lc-blu)}
.lc-centro-cinofilo{border-top:4px solid var(--lc-oro)}
.lc-elenco{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:12px}
.lc-elenco li{display:flex;gap:12px;font-size:15.2px;color:var(--lc-tenue);
  line-height:1.5;max-width:none}
.lc-elenco li::before{
  content:"";flex:none;width:7px;height:7px;margin-top:8px;border-radius:2px;
  background:var(--lc-blu);transform:rotate(45deg);
}
.lc-elenco-oro li::before{background:var(--lc-oro)}
.lc-centro .lc-bottone{align-self:flex-start;margin-top:auto}

/* elenco a righe */
.lc-righe{margin-top:32px;border-top:1px solid rgba(13,30,47,.14)}
.lc-riga{
  padding:22px 0;border-bottom:1px solid rgba(13,30,47,.14);
  display:grid;gap:6px 30px;align-items:baseline;
}
@media(min-width:760px){.lc-riga{grid-template-columns:minmax(0,19rem) 1fr}}
.lc-riga strong{font-family:var(--lc-display);font-size:1.16rem;font-weight:600;
  letter-spacing:-.01em;color:var(--lc-inchiostro)}
.lc-riga span{color:var(--lc-tenue);font-size:15.2px;max-width:56ch}
.lc-scuro .lc-righe,.lc-scuro .lc-riga{border-color:rgba(244,242,233,.16)}
.lc-scuro .lc-riga strong{color:var(--lc-crema)}
.lc-scuro .lc-riga span{color:rgba(244,242,233,.76)}

/* firma */
.lc-firma{
  display:flex;align-items:center;gap:15px;margin-top:6px;padding-top:22px;
  border-top:1px solid rgba(13,30,47,.12);width:100%;
}
.lc-firma .lc-firma-marchio{
  width:118px;height:auto;flex:none;margin-right:4px;
  aspect-ratio:auto;object-fit:contain;border-radius:0;background:none;
}
.lc-firma strong{display:block;font-family:var(--lc-display);font-size:1.1rem;font-weight:600}
.lc-firma span{font-size:14px;color:var(--lc-tenue)}

/* richiamo finale */
.lc-richiamo{
  background:var(--lc-sabbia);border-radius:30px;padding:44px 30px;
  display:grid;gap:24px;align-items:center;
}
@media(min-width:820px){.lc-richiamo{grid-template-columns:1fr auto;padding:54px}}
.lc-richiamo-azioni{display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.lc-telefono{font-family:var(--lc-display);font-size:1.18rem;text-decoration:none;
  white-space:nowrap;color:var(--lc-inchiostro)}
.lc-telefono span{display:block;font-family:var(--lc-testo);font-size:12px;
  letter-spacing:.14em;text-transform:uppercase;color:var(--lc-tenue);margin-bottom:2px}

/* schede contatti */
.lc-schede{display:grid;gap:20px;margin-top:34px}
@media(min-width:760px){.lc-schede{grid-template-columns:repeat(3,1fr)}}
.lc-scheda{
  background:var(--lc-carta);border:1px solid rgba(13,30,47,.09);
  border-radius:22px;padding:28px 24px;
  display:flex;flex-direction:column;gap:12px;
}
.lc-scheda h3{
  font-family:var(--lc-testo);font-size:12px;font-weight:700;letter-spacing:.16em;
  text-transform:uppercase;color:var(--lc-oro);
}
.lc-scheda p{font-size:15px;color:var(--lc-tenue);line-height:1.7}
.lc-scheda a:not(.lc-bottone){font-weight:600;color:var(--lc-blu-fondo)}

/* ============================================================
   GALLERIA
   ============================================================ */
.lc-mosaico{columns:1;column-gap:18px}
@media(min-width:640px){.lc-mosaico{columns:2}}
@media(min-width:980px){.lc-mosaico{columns:3}}
.lc-mosaico .wp-block-image,
.lc-mosaico figure{break-inside:avoid;margin:0 0 18px}
.lc-mosaico img{width:100%;border-radius:18px;background:var(--lc-sabbia)}
.lc-mosaico figcaption{font-size:13.4px;color:var(--lc-tenue);margin-top:9px}

/* galleria a blocchi nativa di WordPress */
.lc-contenuto .wp-block-gallery.has-nested-images figure.wp-block-image img{
  border-radius:18px;
}

/* ============================================================
   SOCIAL
   ============================================================ */
.lc-social{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.lc-social a{
  display:grid;place-items:center;width:42px;height:42px;border-radius:999px;
  background:var(--lc-carta);border:1px solid rgba(13,30,47,.1);
  color:var(--lc-blu-fondo);
  transition:background .15s,color .15s,border-color .15s;
}
.lc-social a:hover{background:var(--lc-blu-fondo);color:var(--lc-crema);
  border-color:var(--lc-blu-fondo)}
.lc-social svg{width:19px;height:19px;fill:currentColor}
.lc-social-eti{font-size:12.5px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--lc-tenue);margin-right:6px}

/* ============================================================
   PIE DI PAGINA
   ============================================================ */
.lc-piede{background:var(--lc-inchiostro);color:rgba(244,242,233,.8);padding-block:50px 0}
.lc-piede-griglia{display:grid;gap:32px}
@media(min-width:760px){.lc-piede-griglia{grid-template-columns:1.4fr 1fr 1fr}}
.lc-piede img{width:196px;height:auto;margin-bottom:16px;
  filter:brightness(0) invert(1);opacity:.92}
.lc-piede h2{
  font-family:var(--lc-testo);font-size:12px;font-weight:700;letter-spacing:.16em;
  text-transform:uppercase;color:var(--lc-oro);margin-bottom:12px;
}
.lc-piede h2 + h2{margin-top:24px}
.lc-piede p,.lc-piede li{font-size:14.6px;line-height:1.75;max-width:34ch}
.lc-piede ul{margin:0;padding:0;list-style:none}
.lc-piede a{color:rgba(244,242,233,.8);text-decoration:none;
  border-bottom:1px solid rgba(244,242,233,.24)}
.lc-piede a:hover{color:#fff;border-color:var(--lc-oro)}
.lc-piede .lc-social a{
  background:rgba(244,242,233,.07);border-color:rgba(244,242,233,.18);
  color:rgba(244,242,233,.85);border-bottom-width:1px;
}
.lc-piede .lc-social a:hover{background:var(--lc-oro);color:var(--lc-inchiostro);
  border-color:var(--lc-oro)}
.lc-piede-coda{
  margin-top:34px;border-top:1px solid rgba(244,242,233,.14);
  padding-block:20px;display:flex;flex-wrap:wrap;gap:8px 24px;
  justify-content:space-between;font-size:12.5px;color:rgba(244,242,233,.55);
}

/* richiamo all'app: solo su schermo mobile */
.lc-fascia-app{display:none}
@media(max-width:759px){
  .lc-fascia-app{
    margin-top:40px;border-top:1px solid rgba(244,242,233,.14);
    padding-top:30px;display:flex;flex-wrap:wrap;gap:18px 24px;
    align-items:center;justify-content:space-between;
  }
}
.lc-fascia-app-testo{display:flex;align-items:center;gap:16px}
.lc-fascia-app svg{width:30px;height:30px;flex:none;stroke:var(--lc-oro);fill:none;
  stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.lc-fascia-app strong{display:block;font-family:var(--lc-display);font-size:1.16rem;
  font-weight:600;color:var(--lc-crema);letter-spacing:-.01em}
.lc-fascia-app small{font-size:13.4px;color:rgba(244,242,233,.6)}
.lc-bottone-app{
  display:inline-flex;align-items:center;gap:9px;border-radius:999px;
  padding:12px 24px;font-family:var(--lc-testo);font-weight:600;font-size:14.5px;
  border:1.5px solid var(--lc-oro);background:none;color:var(--lc-oro);cursor:pointer;
  text-decoration:none;transition:background .15s,color .15s;
}
.lc-bottone-app:hover{background:var(--lc-oro);color:var(--lc-inchiostro)}
.lc-bottone-app svg{width:17px;height:17px;stroke:currentColor}

/* ============================================================
   ARTICOLI E PAGINE DI SERVIZIO
   ============================================================ */
.lc-intestazione-pagina{padding-block:46px 30px;display:grid;gap:18px}
.lc-intestazione-pagina p{color:var(--lc-tenue);font-size:1.06rem;max-width:64ch}

.lc-elenco-articoli{display:grid;gap:26px;padding-block:20px 60px}
@media(min-width:760px){.lc-elenco-articoli{grid-template-columns:repeat(2,1fr)}}
.lc-articolo{
  background:var(--lc-carta);border:1px solid rgba(13,30,47,.09);
  border-radius:22px;padding:26px 24px;
}
.lc-articolo h2{font-size:1.4rem;margin-bottom:8px}
.lc-articolo a{text-decoration:none}
.lc-data{font-size:12.5px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--lc-oro);font-weight:700}

.lc-paginazione{display:flex;gap:10px;flex-wrap:wrap;padding-bottom:60px}
.lc-paginazione .page-numbers{
  display:grid;place-items:center;min-width:42px;height:42px;padding-inline:12px;
  border-radius:999px;border:1px solid rgba(13,30,47,.16);text-decoration:none;
  font-weight:600;font-size:14.5px;
}
.lc-paginazione .page-numbers.current{background:var(--lc-blu-fondo);color:var(--lc-crema);
  border-color:var(--lc-blu-fondo)}

/* modulo di contatto (Contact Form 7) */
.wpcf7-form p{display:flex;flex-direction:column;gap:7px;margin-bottom:18px}
.wpcf7-form label{font-weight:600;font-size:14.5px;color:var(--lc-inchiostro)}
.wpcf7-form input[type=text],
.wpcf7-form input[type=email],
.wpcf7-form input[type=tel],
.wpcf7-form textarea{
  font-family:var(--lc-testo);font-size:16px;padding:13px 16px;
  border:1px solid rgba(13,30,47,.2);border-radius:12px;
  background:var(--lc-carta);color:var(--lc-inchiostro);width:100%;
}
.wpcf7-form input:focus,.wpcf7-form textarea:focus{
  outline:2px solid var(--lc-blu);outline-offset:1px;border-color:transparent;
}
.wpcf7-form input[type=submit]{
  background:var(--lc-blu-fondo);color:var(--lc-crema);border:0;cursor:pointer;
  border-radius:999px;padding:14px 30px;font-family:var(--lc-testo);
  font-weight:600;font-size:15px;width:auto;
}
.wpcf7-form input[type=submit]:hover{background:var(--lc-inchiostro)}

@media(prefers-reduced-motion:reduce){
  *{transition-duration:.01ms!important;animation-duration:.01ms!important;
    scroll-behavior:auto!important}
}