/*
Theme Name:   Forte dei Marmi — Monti e Mare
Theme URI:    https://www.fortedeimarmiversilia.it/
Description:  Tema figlio di Kadence per Forte dei Marmi Versilia. Palette chiara "Monti e Mare", tipografia editoriale Newsreader + Inter, blocchi ottimizzati per SEO, AEO e GEO (risposta diretta, FAQ con schema, tabelle dati).
Author:       Redazione Forte dei Marmi Versilia
Version:      1.2.0
Template:     kadence
Text Domain:  fdm-riviera
Tags:         blog, one-column, custom-colors, custom-menu, editor-style
*/

/* =========================================================
   1. PALETTE E VARIABILI
   Sovrascrive la palette globale di Kadence: cambiando queste
   variabili si ricolora l'intero sito, blocchi inclusi.
   ========================================================= */
:root,
body.wp-site-blocks,
.wp-site-blocks{
  --fdm-paper:#FFFFFF;
  --fdm-sand:#FAF6EF;
  --fdm-sky:#EDF4F8;
  --fdm-sky-line:#CFE0E9;
  --fdm-sea:#2E7093;
  --fdm-deep:#123B52;
  --fdm-ink:#1B2B33;
  --fdm-body:#4A5C66;
  --fdm-brass:#BD9155;
  --fdm-stone:#8B979E;
  --fdm-line:#E7E9EA;

  --fdm-serif:'Newsreader',Georgia,'Times New Roman',serif;
  --fdm-sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;

  /* --- mappatura sulla palette Kadence --- */
  --global-palette1:#2E7093;
  --global-palette2:#123B52;
  --global-palette3:#1B2B33;
  --global-palette4:#4A5C66;
  --global-palette5:#8B979E;
  --global-palette6:#E7E9EA;
  --global-palette7:#EDF4F8;
  --global-palette8:#FAF6EF;
  --global-palette9:#FFFFFF;
  --global-palette-highlight:#BD9155;
  --global-palette-highlight-alt:#FFFFFF;
  --global-palette-highlight-alt2:#123B52;
  --global-palette-btn:#FFFFFF;
  --global-palette-btn-bg:#2E7093;
  --global-palette-btn-hover:#FFFFFF;
  --global-palette-btn-bg-hover:#123B52;

  --global-content-width:1260px;
  --global-content-narrow-width:820px;
}

/* =========================================================
   2. TIPOGRAFIA
   ========================================================= */
body,
.entry-content{
  font-family:var(--fdm-sans);
  color:var(--fdm-body);
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,
.entry-title,
.site-title{
  font-family:var(--fdm-serif);
  color:var(--fdm-ink);
  letter-spacing:-.015em;
}
h1,.entry-title{font-weight:200;line-height:1.02}
h2{font-weight:300;line-height:1.08}
h3{font-weight:400;line-height:1.2}
h2 em,h1 em,h3 em{font-style:italic;color:var(--fdm-sea);font-weight:300}

.entry-content h2{font-size:clamp(30px,3.6vw,46px);margin:2.4em 0 .7em}
.entry-content h3{font-size:clamp(22px,2.2vw,29px);margin:2em 0 .5em}
.entry-content p{font-size:17px;margin-bottom:1.35em}
.entry-content a:not(.wp-block-button__link){
  color:var(--fdm-sea);text-decoration:none;
  border-bottom:1px solid rgba(189,145,85,.55);transition:.2s;
}
.entry-content a:not(.wp-block-button__link):hover{border-bottom-color:var(--fdm-sea)}
.entry-content strong{color:var(--fdm-ink);font-weight:600}

/* occhiello */
.fdm-eyebrow{
  font-family:var(--fdm-sans);font-size:11px;letter-spacing:.24em;
  text-transform:uppercase;font-weight:600;color:var(--fdm-brass);margin-bottom:.6em;
}

/* =========================================================
   3. HEADER E NAVIGAZIONE
   ========================================================= */
#main-header{border-bottom:1px solid var(--fdm-line)}
.site-header-row{background:rgba(255,255,255,.92);backdrop-filter:blur(16px)}
.site-title,
.site-branding a.brand{font-family:var(--fdm-serif)!important;font-weight:400!important;
  letter-spacing:.15em!important;text-transform:uppercase!important;color:var(--fdm-ink)!important}
.header-navigation .menu-container>ul>li>a{
  font-family:var(--fdm-sans);font-size:14px;font-weight:500;color:#3E5560;
  border-bottom:1.5px solid transparent;transition:.2s;
}
.header-navigation .menu-container>ul>li>a:hover,
.header-navigation .menu-container>ul>li.current-menu-item>a{
  color:var(--fdm-sea);border-bottom-color:var(--fdm-brass);
}

/* barra informativa in cima (mercato del mercoledì) */
.fdm-topbar{
  background:var(--fdm-sky);color:var(--fdm-deep);
  border-bottom:1px solid #DFE9EF;font-size:13.5px;
}
.fdm-topbar .fdm-topbar-inner{
  max-width:var(--global-content-width);margin:0 auto;padding:0 30px;
  height:44px;display:flex;align-items:center;justify-content:center;
  gap:14px;text-align:center;flex-wrap:wrap;
}
.fdm-topbar b{font-weight:600}
.fdm-topbar .sep{width:4px;height:4px;border-radius:50%;background:var(--fdm-brass);flex:none}
@media(max-width:640px){.fdm-topbar{font-size:12px}.fdm-topbar .fdm-topbar-inner{height:auto;padding:9px 16px;gap:9px}}

/* =========================================================
   4. HERO
   ========================================================= */
.fdm-hero{position:relative;min-height:74vh;display:flex;align-items:flex-end;overflow:hidden}
.fdm-hero>img,.fdm-hero .fdm-hero-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.fdm-hero::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(18,59,82,.24) 0%,rgba(18,59,82,0) 40%,rgba(18,59,82,.55) 100%)}
.fdm-hero-inner{position:relative;z-index:2;max-width:var(--global-content-width);
  margin:0 auto;padding:130px 30px 70px;color:#fff;width:100%}
.fdm-hero h1{color:#fff;font-size:clamp(46px,7.4vw,100px);max-width:15ch;
  text-shadow:0 2px 34px rgba(10,40,58,.34)}
.fdm-hero h1 em{color:#FBE7C8}
.fdm-hero .fdm-eyebrow{color:#F1E3CB}
.fdm-hero p{margin-top:20px;font-size:19px;font-weight:300;max-width:52ch;color:#F1F5F7;
  text-shadow:0 1px 16px rgba(10,40,58,.4)}

/* =========================================================
   5. BLOCCO RISPOSTA DIRETTA  (chiave per AEO/GEO)
   Il primo blocco di testo della pagina: 40-60 parole che
   rispondono alla domanda. È ciò che gli AI estraggono.
   ========================================================= */
.fdm-answer{
  background:#fff;border:1px solid var(--fdm-line);border-top:3px solid var(--fdm-brass);
  padding:34px 40px;margin:0 0 2.6em;box-shadow:0 30px 70px -46px rgba(18,59,82,.30);
}
.fdm-hero + .fdm-answer,
.fdm-answer.is-overlap{margin-top:-62px;position:relative;z-index:5}
.fdm-answer h2,.fdm-answer h3{font-size:21px;font-weight:500;margin:0 0 12px}
.fdm-answer p{font-size:18px;font-weight:300;color:#3C4E58;margin-bottom:0}
.fdm-answer .fdm-answer-meta{
  margin-top:20px;padding-top:16px;border-top:1px solid var(--fdm-line);
  font-size:12.5px;color:var(--fdm-stone);display:flex;gap:22px;flex-wrap:wrap;
}
@media(max-width:782px){
  .fdm-answer{padding:26px 24px}
  .fdm-hero + .fdm-answer,.fdm-answer.is-overlap{margin-top:-34px}
}

/* =========================================================
   6. FATTI CHIAVE (griglia numerica)
   ========================================================= */
.fdm-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:1px;background:var(--fdm-sky-line);border:1px solid var(--fdm-sky-line);margin:2em 0}
.fdm-facts>div{background:var(--fdm-sky);padding:22px 18px}
.fdm-facts .k{font-family:var(--fdm-serif);font-size:30px;font-weight:300;
  color:var(--fdm-deep);line-height:1}
.fdm-facts .l{font-size:10.5px;letter-spacing:.17em;text-transform:uppercase;
  color:#7C939F;margin-top:7px}

/* =========================================================
   7. LISTA NUMERATA EDITORIALE
   ========================================================= */
.fdm-list{border-top:1px solid var(--fdm-line);margin:2em 0}
.fdm-list .fdm-item{
  display:grid;grid-template-columns:80px 1fr 200px;gap:34px;align-items:center;
  padding:30px 0;border-bottom:1px solid var(--fdm-line);transition:.25s;
}
.fdm-list .fdm-item:hover{background:#fff;padding-left:16px;padding-right:16px;
  box-shadow:0 14px 34px -30px rgba(18,59,82,.5)}
.fdm-list .num{font-family:var(--fdm-serif);font-size:44px;font-weight:200;
  color:var(--fdm-brass);line-height:1}
.fdm-list h3{font-size:26px;font-weight:400;margin:0 0 5px}
.fdm-list p{font-size:14.5px;margin:0;max-width:62ch}
.fdm-list .side{text-align:right;font-size:13px;color:var(--fdm-stone)}
@media(max-width:900px){
  .fdm-list .fdm-item{grid-template-columns:52px 1fr;gap:20px}
  .fdm-list .side{display:none}
}

/* =========================================================
   8. TABELLE DATI (formato che le AI estraggono meglio)
   ========================================================= */
.entry-content table,
.fdm-table{width:100%;border-collapse:collapse;margin:2em 0;font-size:15px}
.entry-content th,.fdm-table th{
  text-align:left;font-family:var(--fdm-sans);font-size:10.5px;letter-spacing:.17em;
  text-transform:uppercase;color:var(--fdm-stone);font-weight:600;
  padding:0 16px 15px;border-bottom:1px solid var(--fdm-line);background:none;
}
.entry-content td,.fdm-table td{padding:18px 16px;border-bottom:1px solid var(--fdm-line)}
.entry-content tbody tr:hover td,.fdm-table tbody tr:hover td{background:var(--fdm-sky)}
.entry-content td:first-child,.fdm-table td:first-child{
  font-family:var(--fdm-serif);font-size:19px;color:var(--fdm-ink)}
.fdm-pill{display:inline-block;font-size:11px;letter-spacing:.09em;text-transform:uppercase;
  font-weight:600;padding:4px 12px}
.fdm-pill.alta{background:#FAEBD6;color:#8E6524}
.fdm-pill.media{background:#E3EFE7;color:#3D6B4E}
.fdm-pill.bassa{background:#E6EEF3;color:#3C6076}

/* =========================================================
   9. FAQ  (presentazione + base per lo schema)
   ========================================================= */
.fdm-faq{border-top:1px solid var(--fdm-line);margin:2.4em 0}
.fdm-faq details{border-bottom:1px solid var(--fdm-line)}
.fdm-faq summary{
  list-style:none;cursor:pointer;padding:26px 0;display:flex;justify-content:space-between;
  gap:26px;font-family:var(--fdm-serif);font-size:21px;font-weight:400;
  color:var(--fdm-ink);transition:.2s;
}
.fdm-faq summary::-webkit-details-marker{display:none}
.fdm-faq summary:hover{color:var(--fdm-sea)}
.fdm-faq .ico{flex:none;width:28px;height:28px;border:1px solid var(--fdm-line);
  border-radius:50%;display:grid;place-items:center;font-size:18px;
  color:var(--fdm-brass);transition:.28s}
.fdm-faq details[open] .ico{transform:rotate(45deg);background:var(--fdm-brass);
  color:#fff;border-color:var(--fdm-brass)}
.fdm-faq .fdm-a{padding:0 0 28px;max-width:76ch;font-size:16px}
.fdm-faq .fdm-a p:last-child{margin-bottom:0}

/* =========================================================
   10. CARD GUIDE (griglia pillar)
   ========================================================= */
.fdm-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:30px;margin:2em 0}
.fdm-card{overflow:hidden;background:#fff;border:1px solid var(--fdm-line);
  display:block;transition:.3s;text-decoration:none!important;border-bottom:1px solid var(--fdm-line)!important}
.fdm-card:hover{box-shadow:0 24px 50px -34px rgba(18,59,82,.4);transform:translateY(-3px)}
.fdm-card .ph{height:262px;overflow:hidden}
.fdm-card .ph img{width:100%;height:100%;object-fit:cover;
  transition:transform .75s cubic-bezier(.2,.7,.3,1)}
.fdm-card:hover .ph img{transform:scale(1.06)}
.fdm-card .body{padding:26px 28px 30px}
.fdm-card h3{font-size:24px;margin:9px 0 8px}
.fdm-card p{font-size:14.5px;margin:0;color:var(--fdm-body)}
.fdm-card .vol{font-size:11px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--fdm-brass);font-weight:600}

/* =========================================================
   11. PULSANTI E RICHIAMI
   ========================================================= */
.wp-block-button__link,.button,.kb-button{
  font-family:var(--fdm-sans);font-weight:600;font-size:14px;letter-spacing:.05em;
  border-radius:0!important;padding:16px 32px;transition:.25s;
}
.wp-block-button__link:hover,.button:hover{
  transform:translateY(-2px);box-shadow:0 12px 26px -16px rgba(18,59,82,.6);
}
.fdm-note{margin:1.8em 0;font-size:13.5px;color:var(--fdm-stone);
  border-left:2px solid var(--fdm-brass);padding-left:18px}

/* =========================================================
   12. CONTENITORI E SEZIONI
   ========================================================= */
.fdm-wrap{
  max-width:var(--global-content-width);
  margin-left:auto;margin-right:auto;
  padding-left:30px;padding-right:30px;
}
.fdm-narrow{max-width:1000px}
.fdm-section{padding:96px 0}
.fdm-section>.fdm-wrap>h2{margin-top:14px;margin-bottom:.55em}
.fdm-lead{font-size:17px;max-width:48ch;margin-bottom:0}
.fdm-bg-sky{background:var(--fdm-sky)}
.fdm-bg-sand{background:var(--fdm-sand)}

/* le sezioni escono dal contenitore per andare a tutta larghezza */
.entry-content>.fdm-hero,
.entry-content>.fdm-section{
  margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);
  width:100vw;max-width:100vw;
}
.entry-content>.fdm-wrap{margin-top:0}
.fdm-hero-inner,.fdm-answer{max-width:var(--global-content-width)}
.fdm-answer{margin-left:auto;margin-right:auto}

@media(max-width:782px){
  .fdm-section{padding:60px 0}
  .fdm-wrap{padding-left:20px;padding-right:20px}
}

/* =========================================================
   13. FOOTER
   ========================================================= */
.site-footer{background:var(--fdm-deep);color:#A9C2CE}
.site-footer a{color:#A9C2CE}
.site-footer a:hover{color:var(--fdm-brass)}
.site-footer h2,.site-footer h3,.site-footer h4,
.site-footer .widget-title{color:#fff;font-family:var(--fdm-sans);font-size:10.5px;
  letter-spacing:.21em;text-transform:uppercase;font-weight:600}

/* =========================================================
   14. ACCESSIBILITÀ E STAMPA
   ========================================================= */
a:focus-visible,button:focus-visible,summary:focus-visible{
  outline:2px solid var(--fdm-brass);outline-offset:3px}
@media print{
  .fdm-topbar,#main-header,.site-footer{display:none}
  .fdm-faq details{border:none}
  .fdm-faq details[open] .fdm-a{display:block}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
}