/* =====================================================================
   ORAPARTO.IT - DESIGN SYSTEM v2
   Tutte le classi sono prefissate op- per non collidere con GeneratePress,
   WooCommerce o i blocchi di Gutenberg.
   ================================================================== */
:root{
  --op-ink:#0E2233; --op-ink-2:#3A5163; --op-ink-3:#6B8095;
  --op-brand:#1B5E8C; --op-brand-700:#154B71;
  --op-accent:#38A3D1; --op-accent-200:#B9DEF0;
  --op-sky:#E8F4FB; --op-sky-2:#F5FAFD;
  --op-cta:#F2994A; --op-cta-700:#DC7F31;
  --op-line:#DCE6EE; --op-line-2:#EDF3F8; --op-white:#fff;
  --op-display:"Fraunces",Georgia,"Times New Roman",serif;
  --op-body:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --op-wrap:1200px; --op-measure:68ch;
  --op-r-sm:8px; --op-r:12px; --op-r-lg:18px; --op-header-h:60px;
  --op-shadow-sm:0 1px 2px rgba(14,34,51,.06),0 1px 3px rgba(14,34,51,.05);
  --op-shadow:0 4px 16px rgba(14,34,51,.08);
  --op-shadow-lg:0 12px 40px rgba(14,34,51,.14);
}

/* --- Neutralizza i contenitori GeneratePress sulle pagine che ridisegniamo --- */
body.op-fullwidth #page,
body.op-fullwidth .site-content{max-width:none;width:auto;margin:0;padding:0;display:block;background:none;box-shadow:none}
body.op-fullwidth .site-content{overflow:visible}

html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--op-header-h) + 16px)}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation-duration:.01ms!important;transition-duration:.01ms!important}}
body.op-skin{
  margin:0;background:var(--op-white);color:var(--op-ink);
  font-family:var(--op-body);font-size:17px;line-height:1.72;
  overflow-x:clip;-webkit-font-smoothing:antialiased;
}
body.op-skin img,body.op-skin svg{max-width:100%;display:block} /* niente height qui: batterebbe .op-brand img per specificita */
body.op-skin :focus-visible{outline:3px solid var(--op-accent);outline-offset:2px;border-radius:4px}

.op-wrap{width:100%;max-width:var(--op-wrap);margin-inline:auto;padding-inline:20px;box-sizing:border-box}
.op-wrap--wide{max-width:1440px}
.op-wrap *,.op-header *,.op-footer *{box-sizing:border-box}
.op-skip{position:absolute;left:-9999px}
.op-skip:focus{left:12px;top:12px;z-index:999;background:var(--op-white);padding:10px 16px;border-radius:var(--op-r-sm);box-shadow:var(--op-shadow-lg)}
.op-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* 1. Barra di avanzamento lettura */
.op-progress{position:fixed;top:0;left:0;height:3px;width:100%;z-index:120;pointer-events:none}
.op-progress__bar{height:100%;width:0;background:linear-gradient(90deg,var(--op-brand),var(--op-accent));transition:width .1s linear}

/* 2. Header compatto */
.op-header{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.94);backdrop-filter:saturate(180%) blur(12px);border-bottom:1px solid var(--op-line);font-family:var(--op-body)}
.op-header__inner{display:flex;align-items:center;gap:24px;height:var(--op-header-h)}
.op-brand{display:flex;align-items:center;flex:0 0 auto;text-decoration:none}
.op-brand img{height:34px;width:auto;font-family:var(--op-display);font-weight:700;font-size:19px;color:var(--op-brand)}
@media(max-width:600px){.op-brand img{height:29px}}
.op-nav{margin-left:auto;display:none}
@media(min-width:1000px){.op-nav{display:block}}
.op-nav__list{display:flex;align-items:center;gap:2px;list-style:none;margin:0;padding:0}
.op-nav__link{display:flex;align-items:center;gap:5px;padding:8px 12px;border-radius:var(--op-r-sm);font-size:15px;font-weight:600;letter-spacing:-.01em;color:var(--op-ink);text-decoration:none;background:none;border:0;cursor:pointer;transition:background .15s,color .15s;font-family:inherit}
.op-nav__link:hover,.op-nav__link[aria-expanded="true"]{background:var(--op-sky);color:var(--op-brand)}
.op-nav__link svg{width:11px;height:11px;transition:transform .2s}
.op-nav__link[aria-expanded="true"] svg{transform:rotate(180deg)}
.op-nav__cta{margin-left:8px;padding:8px 16px;border-radius:999px;background:var(--op-brand);color:#fff!important;font-size:15px;font-weight:600;text-decoration:none;transition:background .15s;white-space:nowrap}
.op-nav__social{display:flex;align-items:center;justify-content:center;width:34px;height:34px;margin-left:2px;border-radius:50%;color:var(--op-ink);transition:background .15s,color .15s}
.op-nav__social:hover{background:var(--op-sky);color:var(--op-brand)}
.op-nav__social svg{width:18px;height:18px}
.op-nav__cta:hover{background:var(--op-brand-700)}

.op-mega{display:none}
@media(min-width:1000px){.op-mega{display:block}}
.op-mega{position:absolute;left:0;right:0;top:100%;background:var(--op-white);border-bottom:1px solid var(--op-line);box-shadow:var(--op-shadow-lg);opacity:0;visibility:hidden;transform:translateY(-8px);transition:opacity .18s ease,transform .18s ease,visibility .18s}
.op-mega[data-open="true"]{opacity:1;visibility:visible;transform:translateY(0)}
.op-mega__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:32px;padding:28px 20px 32px;align-items:start}
.op-mega__grid--promo{grid-template-columns:repeat(4,1fr) 300px}
@media(max-width:1180px){.op-mega__grid--promo{grid-template-columns:repeat(3,1fr) 280px}}
.op-mega__label{font-family:var(--op-body);font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--op-ink-3);margin:0 0 12px;padding-bottom:8px;border-bottom:1px solid var(--op-line-2)}
.op-mega__col ul{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.op-mega__col a{display:block;padding:5px 8px;margin-left:-8px;border-radius:6px;font-size:14.5px;color:var(--op-ink-2);text-decoration:none;line-height:1.45}
.op-mega__col a:hover{background:var(--op-sky);color:var(--op-brand)}
.op-mega__promo{background:linear-gradient(160deg,var(--op-brand) 0%,#0E2233 100%);border-radius:var(--op-r);padding:20px;color:#fff;display:flex;flex-direction:column;gap:8px}
.op-mega__promo strong{font-family:var(--op-display);font-size:19px;line-height:1.25}
.op-mega__promo p{margin:0;font-size:13.5px;color:#C6DEEE;line-height:1.55}
.op-mega__promo a{margin-top:auto;align-self:flex-start;background:var(--op-cta);color:#3A2408!important;font-weight:700;font-size:14px;padding:9px 16px;border-radius:999px;text-decoration:none}
.op-mega__promo a:hover{background:var(--op-cta-700)}
.op-mega__latest{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:4px}
@media(max-width:1180px){.op-mega__latest{grid-template-columns:repeat(2,1fr)}}
.op-mega__latest .op-mega__promo{padding:12px 14px;gap:4px}
.op-mega__latest .op-mega__promo strong{font-size:14px;line-height:1.25}
.op-mega__latest .op-mega__promo p{font-size:12px;line-height:1.4}
.op-mega__latest .op-mega__promo a{font-size:12.5px;padding:6px 12px}

.op-burger{display:flex;align-items:center;justify-content:center;margin-left:auto;width:40px;height:40px;border:1px solid var(--op-line);border-radius:var(--op-r-sm);background:var(--op-white);cursor:pointer;padding:0}
@media(min-width:1000px){.op-burger{display:none}}
.op-burger span{display:block;width:18px;height:2px;background:var(--op-ink);border-radius:2px;position:relative;transition:.2s}
.op-burger span::before,.op-burger span::after{content:"";position:absolute;left:0;width:18px;height:2px;background:var(--op-ink);border-radius:2px;transition:.2s}
.op-burger span::before{top:-6px}.op-burger span::after{top:6px}
.op-burger[aria-expanded="true"] span{background:transparent}
.op-burger[aria-expanded="true"] span::before{top:0;transform:rotate(45deg)}
.op-burger[aria-expanded="true"] span::after{top:0;transform:rotate(-45deg)}

.op-drawer{position:fixed;inset:var(--op-header-h) 0 0;z-index:99;background:var(--op-white);overflow-y:auto;overscroll-behavior:contain;transform:translateX(100%);transition:transform .25s ease;visibility:hidden}
.op-drawer[data-open="true"]{transform:translateX(0);visibility:visible}
@media(min-width:1000px){.op-drawer{display:none}}
.op-drawer__inner{padding:8px 20px 48px}
.op-drawer details{border-bottom:1px solid var(--op-line-2)}
.op-drawer summary{display:flex;align-items:center;justify-content:space-between;padding:16px 0;font-size:17px;font-weight:600;cursor:pointer;list-style:none}
.op-drawer summary::-webkit-details-marker{display:none}
.op-drawer summary::after{content:"";width:9px;height:9px;border-right:2px solid var(--op-ink-3);border-bottom:2px solid var(--op-ink-3);transform:rotate(45deg);transition:transform .2s;margin-right:4px}
.op-drawer details[open] summary::after{transform:rotate(-135deg)}
.op-drawer details ul{list-style:none;margin:0 0 14px;padding:0;display:grid;gap:1px}
.op-drawer details ul a{display:block;padding:9px 12px;border-radius:var(--op-r-sm);background:var(--op-sky-2);color:var(--op-ink-2);font-size:15px;text-decoration:none}
.op-drawer__flat{display:block;padding:16px 0;font-size:17px;font-weight:600;color:var(--op-ink);text-decoration:none;border-bottom:1px solid var(--op-line-2)}
.op-drawer__social{display:flex!important;align-items:center;gap:10px}
.op-drawer__social svg{width:20px;height:20px;flex:0 0 auto}
.op-drawer__cta{display:block;margin-top:20px;text-align:center;background:var(--op-cta);color:#3A2408!important;font-weight:700;padding:14px;border-radius:999px;text-decoration:none}
.op-backdrop{position:fixed;inset:0;background:rgba(14,34,51,.35);z-index:98;opacity:0;visibility:hidden;transition:.2s}
.op-backdrop[data-open="true"]{opacity:1;visibility:visible}
body[data-op-locked="true"]{overflow:hidden}

/* 3. Hero articolo */
.op-hero{padding-block:16px 0}
.op-hero > .op-breadcrumb,.op-hero > .op-standfirst{max-width:860px}
.op-hero > h1{max-width:1040px}
.op-breadcrumb{font-size:13px;color:var(--op-ink-3);margin:0 0 22px;line-height:1.6}
.op-breadcrumb ol{list-style:none;display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:0;padding:0}
.op-breadcrumb a{color:var(--op-ink-3);text-decoration:none}
.op-breadcrumb a:hover{color:var(--op-brand);text-decoration:underline}
.op-breadcrumb li[aria-current]{color:var(--op-ink-2);font-weight:500}
.op-breadcrumb .op-sep{color:var(--op-accent-200)}
.op-skin h1{font-family:var(--op-display);font-optical-sizing:auto;font-size:clamp(1.8rem,1.15rem + 2.1vw,2.65rem);font-weight:700;line-height:1.14;letter-spacing:-.024em;margin:0 0 12px;color:var(--op-ink);text-wrap:balance}
.op-standfirst{font-size:clamp(1.02rem,.98rem + .3vw,1.18rem);line-height:1.55;color:var(--op-ink-2);max-width:62ch;margin:0 0 16px}
.op-byline{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;padding:11px 0;border-top:1px solid var(--op-line);border-bottom:1px solid var(--op-line);font-size:14px;color:var(--op-ink-3)}
.op-byline__author{display:flex;align-items:center;gap:10px}
.op-byline__avatar{width:38px;height:38px;border-radius:50%;flex:0 0 38px;background:linear-gradient(150deg,var(--op-brand),var(--op-accent));display:grid;place-items:center;color:#fff;font-weight:700;font-size:13px;overflow:hidden}
.op-byline__avatar img{width:100%;height:100%;object-fit:cover;border-radius:50%}
.op-byline__author a{color:var(--op-ink);font-weight:600;text-decoration:none}
.op-byline__author a:hover{color:var(--op-brand);text-decoration:underline}
.op-byline__author span{display:block;font-size:12.5px;color:var(--op-ink-3);font-weight:400}
.op-byline__author .op-badge{display:flex;width:fit-content;margin:5px 0 0 0}
.op-byline__item{display:flex;align-items:center;gap:6px}
.op-byline__item svg{width:15px;height:15px;flex:0 0 15px}
.op-badge{display:inline-flex;align-items:center;gap:6px;margin:0 0 0 auto;background:var(--op-sky);color:var(--op-brand);border:1px solid var(--op-accent-200);padding:5px 12px;border-radius:999px;font-size:12.5px;font-weight:600}
.op-badge svg{width:14px;height:14px}
@media(max-width:700px){.op-badge{margin-left:0}}
.op-cover{margin:24px 0 0;border-radius:var(--op-r-lg);overflow:hidden;background:var(--op-sky-2);position:relative}
.op-cover img{display:block;width:auto;max-width:100%;height:auto;max-height:76vh;margin-inline:auto}
@media(max-width:700px){.op-cover img{max-height:70vh}}
.op-cover figcaption{font-size:12.5px;color:var(--op-ink-3);padding:10px 2px 0;line-height:1.5}

/* 4. Layout */
.op-layout{display:grid;grid-template-columns:minmax(0,1fr);gap:48px;padding-block:40px 0;align-items:start}
@media(min-width:1080px){
  .op-layout{grid-template-columns:minmax(0,700px) 316px;justify-content:space-between;gap:48px}
  .op-prose{max-width:none}
  .op-layout--wide{grid-template-columns:minmax(0,1fr) 316px}
  .op-layout--wide .op-prose{max-width:none}
}

/* 5. Corpo del testo (output Gutenberg) */
.op-prose{max-width:var(--op-measure);font-size:17.5px}
.op-prose > p{margin:0 0 1.4em}
.op-prose > p:first-of-type::first-letter{float:left;font-family:var(--op-display);font-weight:700;font-size:3.6em;line-height:.82;padding:.06em .1em 0 0;color:var(--op-brand)}
.op-prose h2{font-family:var(--op-display);font-size:clamp(1.45rem,1.2rem + .9vw,1.85rem);font-weight:700;line-height:1.2;letter-spacing:-.017em;margin:2.4em 0 .7em;scroll-margin-top:calc(var(--op-header-h) + 20px);position:relative;padding-top:20px}
.op-prose > h2:first-of-type{margin-top:.6em}
.op-prose h2::before{content:"";position:absolute;top:0;left:0;width:34px;height:3px;background:var(--op-accent);border-radius:3px}
.op-prose h3{font-family:var(--op-body);font-size:1.16rem;font-weight:700;letter-spacing:-.01em;margin:2em 0 .5em;color:var(--op-ink);scroll-margin-top:calc(var(--op-header-h) + 20px)}
.op-prose strong{font-weight:650;color:var(--op-ink)}
.op-prose ul,.op-prose ol{margin:0 0 1.4em;padding-left:1.3em}
.op-prose li{margin-bottom:.5em}
.op-prose ul li::marker{color:var(--op-accent)}
.op-prose a{color:var(--op-brand);font-weight:500;text-decoration:underline;text-decoration-color:var(--op-accent-200);text-decoration-thickness:2px;text-underline-offset:3px}
.op-prose a:hover{text-decoration-color:var(--op-accent);background:var(--op-sky)}
.op-prose a.op-btn,.op-prose a.op-inline-read,.op-prose a.op-chip,.op-prose a.op-card{text-decoration:none;font-weight:inherit}
.op-prose a.op-btn:hover,.op-prose a.op-card:hover{text-decoration:none;background:inherit}
.op-prose a.op-inline-read:hover,.op-prose a.op-chip:hover{text-decoration:none;background:var(--op-sky)}
.op-prose blockquote{margin:2em 0;padding:4px 0 4px 24px;border-left:3px solid var(--op-accent);font-family:var(--op-display);font-size:1.22em;line-height:1.45;color:var(--op-ink);font-weight:600}
.op-prose blockquote cite{display:block;margin-top:10px;font-family:var(--op-body);font-size:.72em;font-weight:500;font-style:normal;color:var(--op-ink-3)}
.op-prose figure{margin:2em 0}
.op-prose figure img{display:block;width:auto;max-width:100%;height:auto;max-height:70vh;margin-inline:auto;border-radius:var(--op-r)}
.op-prose figure figcaption{font-size:13.5px;color:var(--op-ink-3);line-height:1.55;margin-top:10px;text-align:center}
.op-prose figcaption{font-size:13px;color:var(--op-ink-3);padding-top:8px;line-height:1.5}
.op-prose hr,.op-prose .wp-block-separator{border:0;height:14px;margin:2.6em 0;background-image:radial-gradient(circle,var(--op-accent-200) 1.6px,transparent 1.7px);background-size:14px 14px;background-position:center;background-repeat:repeat-x;max-width:180px}
.op-prose table{width:100%;border-collapse:collapse;font-size:15px;margin:2em 0}
.op-prose th,.op-prose td{border:1px solid var(--op-line);padding:9px 12px;text-align:left}
.op-prose th{background:var(--op-sky-2);font-weight:700}
.op-table-scroll{overflow-x:auto}

/* 6. CTA nel testo */
.op-inline-read{display:flex;align-items:center;gap:14px;margin:2.2em 0;padding:14px 18px;background:var(--op-sky-2);border:1px solid var(--op-line);border-left:3px solid var(--op-accent);border-radius:0 var(--op-r) var(--op-r) 0;text-decoration:none;transition:background .15s,transform .15s}
.op-inline-read:hover{background:var(--op-sky);transform:translateX(3px)}
.op-inline-read__kicker{font-size:11px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--op-ink-3);display:block;margin-bottom:3px}
.op-inline-read__title{font-weight:650;color:var(--op-ink);line-height:1.35;font-size:16px;display:block}
.op-inline-read__arrow{margin-left:auto;flex:0 0 auto;color:var(--op-accent);width:20px;height:20px}

.op-product{margin:2.6em 0;border:1px solid var(--op-line);border-radius:var(--op-r-lg);overflow:hidden;background:var(--op-white);box-shadow:var(--op-shadow-sm)}
.op-product__head{display:flex;align-items:center;gap:10px;padding:10px 20px;margin:0;background:linear-gradient(100deg,var(--op-brand),#2A7BAE);color:#fff;font-size:11.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.op-product__head svg{width:15px;height:15px}
.op-product__body{display:flex;flex-wrap:wrap;gap:22px;padding:22px}
.op-product__main{flex:1 1 260px;min-width:0}
.op-product h4{font-family:var(--op-display);font-size:1.28rem;font-weight:700;line-height:1.25;margin:0 0 8px}
.op-product__main p{margin:0 0 12px;font-size:15px;color:var(--op-ink-2);line-height:1.6}
.op-product__main ul{list-style:none;margin:0;padding:0;display:grid;gap:6px;font-size:14.5px;color:var(--op-ink-2)}
.op-product__main ul li{display:flex;gap:9px;align-items:flex-start;margin:0}
.op-product__main ul li::before{content:"";flex:0 0 16px;height:16px;margin-top:3px;background:var(--op-sky);border-radius:50%;box-shadow:inset 0 0 0 1.5px var(--op-accent)}
.op-product__buy{flex:0 0 222px;display:flex;flex-direction:column;justify-content:center;gap:12px;padding:18px;background:var(--op-sky-2);border:1px solid var(--op-line-2);border-radius:var(--op-r);text-align:center}
.op-product__price{font-family:var(--op-display);font-size:2.05rem;font-weight:700;line-height:1;color:var(--op-ink);margin:0}
.op-product__price small{display:block;font-family:var(--op-body);font-size:12px;font-weight:500;color:var(--op-ink-3);margin-top:6px;letter-spacing:0}
@media(max-width:640px){.op-product__buy{flex:1 1 100%}}
.op-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 20px;border-radius:999px;font-weight:700;font-size:15.5px;line-height:1.2;white-space:nowrap;text-decoration:none;border:0;cursor:pointer;transition:background .15s,transform .1s;max-width:100%}
/* Mobile-first: un bottone con testo dinamico lungo (citta'+nazione) non deve mai poter
   uscire dallo schermo. white-space resta nowrap sui bottoni corti (il caso comune), ma
   sotto i 480px lasciamo che il testo vada a capo invece di essere tagliato dal
   overflow-x:clip del body. */
@media(max-width:768px){
  .op-btn{white-space:normal;text-align:center}
}
.op-btn--buy{background:var(--op-cta);color:#3A2408!important}
.op-btn--buy:hover{background:var(--op-cta-700);transform:translateY(-1px)}
.op-btn--solid{background:var(--op-brand);color:#fff!important}
.op-btn--solid:hover{background:var(--op-brand-700)}

.op-callout{margin:2.2em 0;padding:18px 20px 18px 54px;position:relative;background:var(--op-sky);border-radius:var(--op-r);font-size:15.5px;line-height:1.6;color:var(--op-ink-2)}
.op-callout::before{content:"";position:absolute;left:18px;top:19px;width:22px;height:22px;border-radius:50%;background:var(--op-accent);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M12 16v-5M12 8h.01'/%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M12 16v-5M12 8h.01'/%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3C/svg%3E") center/contain no-repeat}
.op-callout strong{color:var(--op-ink)}

.op-nearby{margin:2.4em 0;padding:20px;border:1px dashed var(--op-line);border-radius:var(--op-r);background:var(--op-sky-2)}
.op-nearby h4{font-size:12px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--op-ink-3);margin:0 0 12px}
.op-chips{display:flex;flex-wrap:wrap;gap:8px}
.op-chip{display:inline-flex;align-items:center;gap:7px;padding:7px 14px;border-radius:999px;background:var(--op-white);border:1px solid var(--op-line);color:var(--op-ink-2);font-size:14px;font-weight:500;text-decoration:none;transition:.15s}
.op-chip:hover{border-color:var(--op-accent);background:var(--op-sky);color:var(--op-brand)}
.op-chip::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--op-accent)}

/* 7. Sidebar */
.op-sidebar{display:none}
@media(min-width:1080px){.op-sidebar{display:block;position:sticky;top:calc(var(--op-header-h) + 24px);max-height:calc(100vh - var(--op-header-h) - 48px);overflow-y:auto;scrollbar-width:thin}}
.op-toc{border-left:2px solid var(--op-line)}
.op-toc__label{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--op-ink-3);margin:0 0 14px;padding-left:18px}
.op-toc ol{list-style:none;margin:0;padding:0}
.op-toc a{display:block;padding:7px 8px 7px 18px;margin-left:-2px;border-left:2px solid transparent;font-size:14.5px;line-height:1.4;color:var(--op-ink-3);text-decoration:none;transition:.15s}
.op-toc a:hover{color:var(--op-brand)}
.op-toc a[aria-current="true"]{color:var(--op-ink);font-weight:600;border-left-color:var(--op-accent)}
.op-toc .op-toc__sub{list-style:none;margin:0;padding:0}
.op-toc .op-toc__sub a{padding-left:32px;font-size:13.5px}

.op-toc-mobile{margin:0 0 32px;border:1px solid var(--op-line);border-radius:var(--op-r);background:var(--op-sky-2);overflow:hidden}
@media(min-width:1080px){.op-toc-mobile{display:none}}
.op-toc-mobile summary{display:flex;align-items:center;gap:10px;padding:14px 18px;cursor:pointer;list-style:none;font-size:14.5px;font-weight:700;color:var(--op-ink)}
.op-toc-mobile summary::-webkit-details-marker{display:none}
.op-toc-mobile summary::after{content:"";margin-left:auto;width:8px;height:8px;border-right:2px solid var(--op-ink-3);border-bottom:2px solid var(--op-ink-3);transform:rotate(45deg);transition:transform .2s}
.op-toc-mobile[open] summary::after{transform:rotate(-135deg)}
.op-toc-mobile summary svg{width:17px;height:17px;color:var(--op-accent)}
.op-toc-mobile ol{margin:0;padding:0 18px 18px 36px;font-size:15px;display:grid;gap:9px}
.op-toc-mobile a{color:var(--op-ink-2);text-decoration:none}
.op-toc-mobile a:hover{color:var(--op-brand);text-decoration:underline}

.op-widget{margin-top:32px;border:1px solid var(--op-line);border-radius:var(--op-r);padding:18px;background:var(--op-white)}
.op-widget:first-child{margin-top:0}
.op-widget__label{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--op-ink-3);margin:0 0 12px}
.op-widget--product{background:linear-gradient(165deg,#0E2233,var(--op-brand));border:0;color:#fff}
.op-widget--product .op-widget__label{color:var(--op-accent-200)}
.op-widget--product h4{font-family:var(--op-display);font-size:1.12rem;line-height:1.3;margin:0 0 8px;color:#fff}
.op-widget--product p{font-size:13.5px;line-height:1.55;color:#BCD8E9;margin:0 0 14px}
.op-widget--product .op-price{font-family:var(--op-display);font-size:1.6rem;font-weight:700;margin-bottom:12px;display:block}
.op-widget--product .op-btn{width:100%}
.op-widget__links{list-style:none;margin:0;padding:0;display:grid;gap:1px}
.op-widget__links a{display:block;padding:9px 10px;margin-inline:-10px;border-radius:var(--op-r-sm);font-size:14.5px;line-height:1.4;color:var(--op-ink-2);text-decoration:none}
.op-widget__links a:hover{background:var(--op-sky);color:var(--op-brand)}

/* 8. E-E-A-T */
.op-eeat{margin:56px 0 0;max-width:var(--op-measure)}
@media(min-width:1080px){.op-eeat{max-width:none}}
.op-method{border:1px solid var(--op-line);border-radius:var(--op-r-lg);padding:24px;background:var(--op-sky-2)}
.op-method h2{font-family:var(--op-display);font-size:1.15rem;margin:0 0 14px;padding-top:0;display:flex;align-items:center;gap:9px}
.op-method h2::before{content:none}
.op-method h2 svg{width:19px;height:19px;color:var(--op-accent)}
.op-method dl{margin:0;display:grid;gap:12px;font-size:14.5px;line-height:1.6}
.op-method dt{font-weight:700;color:var(--op-ink);font-size:13px}
.op-method dd{margin:2px 0 0;color:var(--op-ink-2)}
.op-authorbox{display:flex;gap:20px;align-items:flex-start;margin:28px 0 0;padding:24px;border:1px solid var(--op-line);border-radius:var(--op-r-lg);background:var(--op-white)}
.op-authorbox__avatar{width:64px;height:64px;flex:0 0 64px;border-radius:50%;background:linear-gradient(150deg,var(--op-brand),var(--op-accent));display:grid;place-items:center;color:#fff;font-family:var(--op-display);font-weight:700;font-size:22px;overflow:hidden}
.op-authorbox__avatar img{width:100%;height:100%;object-fit:cover;border-radius:50%}
.op-authorbox h3{font-family:var(--op-display);font-size:1.18rem;margin:0 0 3px}
.op-authorbox h3 a{color:var(--op-ink);text-decoration:none}
.op-authorbox h3 a:hover{color:var(--op-brand)}
.op-authorbox .op-role{font-size:12.5px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--op-accent);margin:0 0 10px}
.op-authorbox p{margin:0 0 12px;font-size:14.5px;line-height:1.65;color:var(--op-ink-2)}
.op-authorbox__links{display:flex;flex-wrap:wrap;gap:8px 18px;font-size:14px}
@media(max-width:600px){.op-authorbox{flex-direction:column;gap:14px}}

/* 9. Correlati */
.op-related{background:var(--op-sky-2);border-top:1px solid var(--op-line);margin-top:64px;padding:56px 0}
.op-related__head{margin-bottom:32px}
.op-related__head h2{font-family:var(--op-display);font-size:clamp(1.5rem,1.3rem + .8vw,2rem);margin:0 0 6px;letter-spacing:-.02em}
.op-related__head p{margin:0;color:var(--op-ink-3);font-size:15.5px}
.op-cluster{margin-bottom:40px}
.op-cluster:last-child{margin-bottom:0}
.op-cluster__label{display:flex;align-items:center;gap:12px;margin:0 0 16px;font-size:11.5px;font-weight:700;letter-spacing:.11em;text-transform:uppercase;color:var(--op-brand)}
.op-cluster__label::after{content:"";flex:1;height:1px;background:var(--op-line)}
.op-cards{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(266px,1fr))}
.op-card{display:flex;flex-direction:column;gap:7px;padding:18px;background:var(--op-white);border:1px solid var(--op-line);border-radius:var(--op-r);text-decoration:none;transition:border-color .15s,box-shadow .15s,transform .15s}
.op-card:hover{border-color:var(--op-accent-200);box-shadow:var(--op-shadow);transform:translateY(-2px)}
.op-card__meta{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--op-ink-3)}
.op-card__title{font-family:var(--op-display);font-size:1.02rem;font-weight:600;line-height:1.32;color:var(--op-ink);letter-spacing:-.01em}
.op-card:hover .op-card__title{color:var(--op-brand)}
.op-card__desc{font-size:13.5px;line-height:1.55;color:var(--op-ink-3);margin:0}
.op-card__time{margin-top:auto;padding-top:8px;font-size:12px;color:var(--op-ink-3)}

/* 10. Footer */
.op-footer{background:var(--op-ink);color:#B8CCDB;padding:56px 0 28px;font-size:14.5px;font-family:var(--op-body)}
.op-footer__grid{display:grid;gap:36px;grid-template-columns:1.4fr repeat(3,1fr)}
@media(max-width:860px){.op-footer__grid{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.op-footer__grid{grid-template-columns:1fr}}
.op-footer__brand img{height:32px;width:auto;filter:brightness(0) invert(1);opacity:.95;margin-bottom:14px}
.op-footer__brand p{margin:0 0 16px;line-height:1.65;color:#8FA9BC;max-width:34ch;font-size:14px}
.op-footer h3{font-family:var(--op-body);font-size:11.5px;font-weight:700;letter-spacing:.11em;text-transform:uppercase;color:#fff;margin:0 0 14px}
.op-footer ul{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.op-footer a{color:#B8CCDB;text-decoration:none}
.op-footer a:hover{color:#fff;text-decoration:underline}
.op-footer__disclosure{margin-top:20px;padding:14px 18px;background:rgba(255,255,255,.05);border-radius:var(--op-r);font-size:12.5px;line-height:1.6;color:#8FA9BC}
.op-footer__bottom{margin-top:44px;padding-top:22px;border-top:1px solid rgba(255,255,255,.12);display:flex;flex-wrap:wrap;gap:12px 24px;align-items:center;font-size:13px;color:#8FA9BC}
.op-footer__legal{display:flex;flex-wrap:wrap;gap:8px 18px;margin-left:auto}
.op-footer__social{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;color:#8FA9BC;transition:color .15s}
.op-footer__social:hover{color:#fff}
.op-footer__social svg{width:17px;height:17px}

/* 11. Pagina autore */
.op-author-hero{display:flex;gap:28px;align-items:flex-start;padding:8px 0 28px;border-bottom:1px solid var(--op-line)}
.op-author-hero__avatar{width:104px;height:104px;flex:0 0 104px;border-radius:50%;background:linear-gradient(150deg,var(--op-brand),var(--op-accent));display:grid;place-items:center;color:#fff;font-family:var(--op-display);font-weight:700;font-size:34px;box-shadow:var(--op-shadow);overflow:hidden}
.op-author-hero__avatar img{width:100%;height:100%;object-fit:cover;border-radius:50%}
.op-author-hero__text{min-width:0;max-width:760px}
.op-author-hero h1{font-size:clamp(1.9rem,1.4rem + 2vw,2.7rem);max-width:none;margin-bottom:6px}
.op-author-hero__role{margin:0 0 16px;font-size:15px;font-weight:600;color:var(--op-brand)}
.op-author-hero__stats{display:flex;flex-wrap:wrap;gap:10px 32px;margin-top:22px}
.op-author-hero__stats div{display:flex;flex-direction:column}
.op-author-hero__stats strong{font-family:var(--op-display);font-size:1.7rem;line-height:1;color:var(--op-ink)}
.op-author-hero__stats span{font-size:12.5px;color:var(--op-ink-3);margin-top:4px}
@media(max-width:700px){.op-author-hero{flex-direction:column;gap:18px}.op-author-hero__avatar{width:76px;height:76px;flex:0 0 76px;font-size:26px}}
.op-author-page .op-prose > p:first-of-type::first-letter{float:none;font-family:inherit;font-size:inherit;line-height:inherit;padding:0;color:inherit}
.op-author-page .op-prose > .op-chips,.op-author-page .op-prose > .op-cards{margin:0 0 2em}

/* --- Staff duo: foto + firma, richiamo a Chi Siamo (pagina autore) --- */
.op-staff-duo{display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px;margin:0 0 32px;padding:24px;background:var(--op-sky-2);border:1px solid var(--op-line);border-radius:var(--op-r-lg)}
.op-staff-duo__photos{display:flex;gap:12px}
.op-staff-duo__photos img{width:132px;height:172px;object-fit:cover;border-radius:var(--op-r);box-shadow:var(--op-shadow)}
.op-staff-duo__names{font-family:var(--op-display);color:var(--op-ink);font-size:1.08rem;margin:0}
.op-staff-duo__link{margin:0}
.op-staff-duo__link a{color:var(--op-cta-700);font-weight:600;text-decoration:none}
.op-staff-duo__link a:hover{text-decoration:underline}
@media(max-width:480px){.op-staff-duo__photos img{width:108px;height:140px}}

/* =====================================================================
   12. Dove dormire: mappa, tabella comparativa, CTA
   ================================================================== */
.op-sezione-titolo{font-family:var(--op-display);font-size:clamp(1.35rem,1.15rem + .8vw,1.7rem);font-weight:700;letter-spacing:-.017em;margin:40px 0 16px;position:relative;padding-top:18px}
.op-sezione-titolo::before{content:"";position:absolute;top:0;left:0;width:34px;height:3px;background:var(--op-accent);border-radius:3px}

.op-mappa{height:420px;border-radius:var(--op-r-lg);overflow:hidden;border:1px solid var(--op-line);background:var(--op-sky);z-index:0}
@media(max-width:700px){.op-mappa{height:330px}}
.op-mappa__nota{font-size:13px;color:var(--op-ink-3);margin:10px 0 0}
.op-mappa__legenda{display:flex;flex-wrap:wrap;gap:14px;margin:10px 0 0;padding:0;list-style:none;font-size:13px;color:var(--op-ink-2)}
.op-mappa__legenda li{display:flex;align-items:center;gap:6px}
.op-mappa__legenda-swatch{display:inline-block;width:12px;height:12px;border-radius:50%;flex:none}
.op-mappa__legenda-swatch--centro{background:rgba(27,94,140,.2);border:2px solid var(--op-brand)}
.op-mappa__legenda-swatch--zona{background:rgba(242,153,74,.25);border:2px solid var(--op-cta)}
.op-zona-consigliata{background:var(--op-sky);border:1px solid var(--op-accent-200);border-radius:var(--op-r-lg);padding:20px 24px;margin:24px 0}
.op-zona-consigliata__label{display:inline-block;background:var(--op-accent);color:#fff;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;padding:3px 10px;border-radius:999px;margin:0 0 10px}
.op-zona-consigliata__titolo{font-family:var(--op-display);font-size:19px;font-weight:600;color:var(--op-ink);margin:0 0 8px;line-height:1.3}
.op-zona-consigliata__testo{margin:0;color:var(--op-ink-2);font-size:15.5px;line-height:1.6}
.op-zona-consigliata__testo strong{color:var(--op-ink)}
.op-zona-consigliata__hotel-titolo{font-family:var(--op-display);font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:var(--op-ink-2);margin:16px 0 8px}
.op-zona-consigliata__hotel-lista{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.op-zona-consigliata__hotel-lista li{display:flex;align-items:baseline;justify-content:space-between;gap:12px;background:#fff;border:1px solid var(--op-accent-200);border-radius:10px;padding:9px 12px}
.op-zona-consigliata__hotel-nome{font-size:14.5px;font-weight:600;color:var(--op-ink)}
.op-zona-consigliata__hotel-meta{font-size:13px;color:var(--op-ink-3);white-space:nowrap}
.op-zona-consigliata__hotel-link{color:inherit;text-decoration:none}
.op-zona-consigliata__hotel-link:hover{text-decoration:underline;color:var(--op-accent)}
.op-mappa .leaflet-popup-content{margin:12px 14px;font-family:var(--op-body);line-height:1.5}
.op-mappa__nome{display:block;font-family:var(--op-display);font-size:15px;color:var(--op-ink);margin-bottom:2px}
.op-mappa__voto{display:block;font-size:12.5px;color:var(--op-ink-3);margin-bottom:8px}
.op-mappa__cta{display:inline-block;font-weight:700;font-size:13.5px;color:var(--op-brand);text-decoration:none}
.op-mappa__cta:hover{text-decoration:underline}

.op-tabella-scroll{overflow-x:auto;border-radius:var(--op-r-lg);border:1px solid var(--op-line);-webkit-overflow-scrolling:touch}
.op-hotel{width:100%;border-collapse:collapse;font-size:15px;min-width:640px;background:var(--op-white)}
.op-hotel thead th{background:var(--op-ink);color:#fff;text-align:left;font-size:12.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:14px 18px;white-space:nowrap}
.op-hotel tbody tr{border-top:1px solid var(--op-line-2)}
.op-hotel tbody tr:hover{background:var(--op-sky-2)}
.op-hotel th,.op-hotel td{padding:16px 18px;vertical-align:middle;text-align:left}
.op-hotel tbody th{font-weight:400}
.op-hotel__nome{display:block;font-weight:700;color:var(--op-ink);line-height:1.3}
.op-hotel__zona{display:block;font-size:13px;color:var(--op-ink-3);margin-top:3px}
.op-hotel__voto{display:block;font-weight:700;color:var(--op-brand);white-space:nowrap}
.op-hotel__rec{display:block;font-size:12.5px;color:var(--op-ink-3);margin-top:3px}
.op-hotel__tag{display:inline-block;background:var(--op-sky);color:var(--op-brand);border:1px solid var(--op-accent-200);border-radius:999px;padding:5px 12px;font-size:12.5px;font-weight:600;line-height:1.35}
.op-hotel__cta{font-size:14.5px;padding:11px 18px;white-space:nowrap}
.op-hotel td:last-child{text-align:right}
.op-hotel__stars{display:inline-block;margin-left:8px;padding:2px 8px;border-radius:999px;background:var(--op-sky);color:var(--op-brand);font-size:11px;font-weight:700;white-space:nowrap;vertical-align:middle}
.op-hotel__voto--mobile{display:none}
.op-hotel__rec--mobile{display:none}
@media(max-width:600px){
  .op-hotel{min-width:0;width:100%;table-layout:fixed}
  .op-hotel thead th:nth-child(2),.op-hotel thead th:nth-child(3),
  .op-hotel tbody td:nth-child(2),.op-hotel tbody td:nth-child(3){display:none}
  .op-hotel thead th:nth-child(1),.op-hotel tbody th:nth-child(1),
  .op-hotel thead th:nth-child(4),.op-hotel tbody td:nth-child(4){width:50%}
  .op-hotel td:last-child{text-align:left}
  .op-hotel__voto--mobile{display:block;margin-bottom:8px}
  .op-hotel__rec--mobile{display:block;margin-top:8px}
}

.op-disclosure{font-size:13px;line-height:1.6;color:var(--op-ink-3);background:var(--op-sky-2);border:1px solid var(--op-line-2);border-radius:var(--op-r);padding:14px 18px;margin:16px 0 0}
.op-disclosure a{color:var(--op-brand)}
.op-cerca-tutti{text-align:center;margin:26px 0 0}

/* CTA fissa in fondo, solo su mobile: e' la barra che converte */
.op-sticky-cta{display:none}
@media(max-width:768px){
  .op-sticky-cta{display:block;position:fixed;left:0;right:0;bottom:0;z-index:97;background:var(--op-brand);padding:11px 14px;box-shadow:0 -2px 14px rgba(14,34,51,.28)}
  .op-sticky-cta a{display:block;text-align:center;color:#fff;font-weight:700;text-decoration:none;font-size:16px}
  body.op-alloggi,body.op-cta-voli{padding-bottom:64px}
}

/* Pop-up di engagement: propone la guida piu' scaricata della nazione */
.op-popup-guida{position:fixed;z-index:97;right:20px;bottom:84px;width:300px;max-width:calc(100vw - 40px);background:var(--op-white);border-radius:var(--op-r-lg);box-shadow:var(--op-shadow-lg);overflow:hidden;opacity:0;transform:translateY(16px);transition:opacity .3s ease,transform .3s ease;pointer-events:none}
.op-popup-guida.op-popup-guida--visible{opacity:1;transform:translateY(0);pointer-events:auto}
.op-popup-guida__close{position:absolute;top:6px;right:6px;width:26px;height:26px;border:0;border-radius:50%;background:rgba(255,255,255,.92);color:var(--op-ink);font-size:20px;line-height:1;cursor:pointer;z-index:2;display:flex;align-items:center;justify-content:center}
.op-popup-guida__close:hover{background:#fff}
.op-popup-guida__link{display:flex;flex-direction:column;text-decoration:none;color:inherit}
.op-popup-guida__img{width:100%;height:140px;object-fit:cover;display:block;background:var(--op-sky-2)}
.op-popup-guida__body{padding:12px 14px 14px;display:block}
.op-popup-guida__eyebrow{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--op-brand);font-weight:700;margin-bottom:4px}
.op-popup-guida__title{display:block;font-weight:700;font-size:14.5px;line-height:1.3;color:var(--op-ink);margin-bottom:10px}
.op-popup-guida__cta{display:inline-block;font-size:13.5px;font-weight:700;color:#3A2408;background:var(--op-cta);padding:6px 12px;border-radius:var(--op-r-sm)}
.op-popup-guida__link:hover .op-popup-guida__cta{background:var(--op-cta-700)}
@media(max-width:768px){
  .op-popup-guida{left:12px;right:12px;width:auto;bottom:12px}
  body.op-cta-voli .op-popup-guida,body.op-alloggi .op-popup-guida{bottom:76px}
  .op-popup-guida__img{height:110px}
  /* Le due card fisse in basso a destra si sovrapporrebbero: nascondi "torna su"
     mentre il pop-up guida e' aperto (l'utente ha gia' la sua X per chiuderlo). */
  body.op-popup-aperto .op-su{opacity:0;visibility:hidden;pointer-events:none}
}
@media(prefers-reduced-motion:reduce){
  .op-popup-guida{transition:opacity .01s}
}
.op-anteprima{background:#FFF7E6;border:1px solid #FFE0A3;color:#7A5200;border-radius:var(--op-r);padding:14px 18px;margin:32px 0 0;font-size:14.5px;line-height:1.6}
.op-anteprima a{color:#7A5200;font-weight:700;white-space:nowrap}

/* ==========================================================================
   13. Dove dormire: blocco compatto, mappa sopra la piega
   Il lettore arriva qui per vedere DOVE sono le strutture: la mappa deve
   entrare nella prima schermata, quindi tutto cio' che la precede si stringe.
   ========================================================================== */
body.op-alloggi .op-hero{padding-block:12px 0}
body.op-alloggi .op-skin h1,body.op-alloggi h1{font-size:clamp(1.62rem,1.1rem + 1.7vw,2.3rem);margin:0 0 8px;line-height:1.16}
body.op-alloggi .op-standfirst{font-size:clamp(.99rem,.96rem + .2vw,1.08rem);line-height:1.5;margin:0 0 12px;max-width:76ch}
body.op-alloggi .op-byline{padding:9px 0;gap:6px 14px;font-size:13.5px}
body.op-alloggi .op-byline__avatar{width:32px;height:32px;flex:0 0 32px;font-size:12px}
body.op-alloggi .op-anteprima{margin:12px 0 0;padding:10px 14px;font-size:13px;line-height:1.5}
body.op-alloggi .op-sezione-titolo{margin:18px 0 10px;padding-top:13px}
body.op-alloggi .op-sezione-titolo::before{width:28px}
/* La mappa prende quello che resta della prima schermata, entro limiti sani. */
body.op-alloggi .op-mappa{height:clamp(300px,52vh,460px)}

/* Sotto la piega il ritmo torna normale: da qui in giu' si legge, non si scorre. */
body.op-alloggi .op-mappa__nota + * .op-sezione-titolo,
body.op-alloggi .op-tabella-scroll{margin-top:0}

@media(max-width:700px){
	/* Su telefono la piega e' corta: breadcrumb su una riga sola che scorre... */
	body.op-alloggi .op-breadcrumb{margin:0 0 12px}
	body.op-alloggi .op-breadcrumb ol{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none}
	body.op-alloggi .op-breadcrumb ol::-webkit-scrollbar{display:none}
	body.op-alloggi .op-breadcrumb li{white-space:nowrap}
	/* ...e firma ridotta all'essenziale: il ruolo si legge sulla pagina autore. */
	body.op-alloggi .op-byline{padding:8px 0;gap:6px 12px;font-size:13px}
	body.op-alloggi .op-byline__author span{display:none}
	body.op-alloggi .op-byline__avatar{width:28px;height:28px;flex:0 0 28px;font-size:11px}
	body.op-alloggi .op-standfirst{margin:0 0 10px}
	body.op-alloggi .op-sezione-titolo{margin:14px 0 8px}
	body.op-alloggi .op-mappa{height:clamp(280px,46vh,400px)}
}

/* ==========================================================================
   14. Torna su
   Cerchio in basso a destra, compare dopo la prima schermata. Nessuna
   scritta: la freccia dice tutto e non va tradotta.
   ========================================================================== */
.op-su{position:fixed;right:20px;bottom:20px;z-index:96;width:48px;height:48px;padding:0;border:0;border-radius:50%;background:var(--op-brand);color:#fff;display:grid;place-items:center;cursor:pointer;box-shadow:0 6px 20px rgba(14,34,51,.3);opacity:0;visibility:hidden;transform:translateY(12px);transition:opacity .2s ease,transform .2s ease,visibility .2s,background-color .2s ease;-webkit-tap-highlight-color:transparent}
.op-su.is-on{opacity:1;visibility:visible;transform:none}
.op-su:hover{background:var(--op-ink)}
.op-su:focus-visible{outline:3px solid var(--op-accent);outline-offset:3px}
.op-su svg{width:22px;height:22px;fill:none;stroke:#fff;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}

@media(max-width:700px){
	.op-su{right:14px;bottom:14px;width:44px;height:44px}
	.op-su svg{width:20px;height:20px}
	/* Sopra la barra fissa "Cerca hotel"/"Cerca voli", non sotto. */
	body.op-alloggi .op-su,body.op-cta-voli .op-su{bottom:70px}
}

@media(prefers-reduced-motion:reduce){
	.op-su{transition:opacity .01s,visibility .01s}
}


/* 12. CTA box a 3 prodotti (fine articoli lunghi, 82%) + mini-widget sidebar */
.op-product-trio{margin:2.6em 0;border:1px solid var(--op-line);border-radius:var(--op-r-lg);overflow:hidden;background:var(--op-white);box-shadow:var(--op-shadow-sm)}
.op-product-trio__head{display:flex;align-items:center;gap:10px;padding:10px 20px;margin:0;background:linear-gradient(100deg,var(--op-brand),#2A7BAE);color:#fff;font-size:11.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.op-product-trio__head svg{width:15px;height:15px}
.op-product-trio__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--op-line)}
.op-product-trio__item{display:flex;flex-direction:column;gap:6px;padding:18px 16px;background:var(--op-white);text-decoration:none;color:inherit;transition:background .15s}
.op-product-trio__item:hover{background:var(--op-sky-2)}
.op-product-trio__kind{font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--op-ink-3)}
.op-product-trio__item h5{font-family:var(--op-display);font-size:1rem;font-weight:700;line-height:1.3;margin:0;color:var(--op-ink)}
.op-product-trio__price{font-family:var(--op-display);font-size:1.15rem;font-weight:700;color:var(--op-brand);margin-top:auto}
@media(max-width:760px){.op-product-trio__grid{grid-template-columns:1fr}}

.op-widget__links--guide a{display:flex;justify-content:space-between;align-items:center;gap:8px}
.op-widget__price{font-family:var(--op-display);font-weight:700;font-size:13px;color:var(--op-brand);white-space:nowrap}

/* Sottomenu nazione->citta nel mega Destinazioni + pannello Ultimi articoli (02/09/2026) */
.op-mega__tree > li > a{display:block;padding:5px 8px;margin-left:-8px;border-radius:6px;font-size:14.5px;color:var(--op-ink-2);text-decoration:none;line-height:1.45}
.op-mega__tree > li > a:hover{background:var(--op-sky);color:var(--op-brand)}
.op-mega__nation{border:0}
.op-mega__nation summary{display:flex;align-items:center;justify-content:space-between;gap:6px;padding:5px 8px;margin-left:-8px;border-radius:6px;font-size:14.5px;font-weight:600;color:var(--op-ink-2);cursor:pointer;list-style:none}
.op-mega__nation summary::-webkit-details-marker{display:none}
.op-mega__nation summary:hover{background:var(--op-sky);color:var(--op-brand)}
.op-mega__nation summary svg{width:9px;height:9px;transition:transform .2s;flex-shrink:0}
.op-mega__nation[open] summary svg{transform:rotate(180deg)}
.op-mega__subtree{list-style:none;margin:2px 0 6px;padding:2px 0 2px 14px;display:grid;gap:1px;border-left:1px solid var(--op-line-2)}
.op-mega__subtree a{display:block;padding:4px 8px;border-radius:6px;font-size:13.5px;color:var(--op-ink-3);text-decoration:none}
.op-mega__subtree a:hover{background:var(--op-sky);color:var(--op-brand)}

/* --- Hub tema generica: /dove-dormire/, /cosa-vedere/... (aggregatore multi-nazione) --- */
.op-section-title{font-family:var(--op-display);font-size:1.3rem;font-weight:600;color:var(--op-ink);margin:0 0 18px;letter-spacing:-.01em}
.op-tema-search{display:flex;align-items:center;gap:10px;max-width:560px;margin:22px 0 4px;padding:6px 6px 6px 16px;background:var(--op-white);border:1px solid var(--op-line);border-radius:999px;box-shadow:var(--op-shadow-sm)}
.op-tema-search svg{width:18px;height:18px;flex:0 0 18px;color:var(--op-ink-3)}
.op-tema-search input[type=search]{flex:1;border:0;background:transparent;font:inherit;font-size:15px;color:var(--op-ink);min-width:0}
.op-tema-search input[type=search]:focus{outline:0}
.op-tema-search .op-btn{padding:10px 20px;font-size:14px}
.op-nation-grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));margin:8px 0 40px}
.op-nation-card{display:flex;flex-direction:column;align-items:center;gap:6px;padding:24px 16px;background:var(--op-white);border:1px solid var(--op-line);border-radius:var(--op-r-lg);text-decoration:none;text-align:center;transition:border-color .15s,box-shadow .15s,transform .15s}
.op-nation-card:hover{border-color:var(--op-accent-200);box-shadow:var(--op-shadow);transform:translateY(-2px)}
.op-nation-card__flag{font-size:2.4rem;line-height:1}
.op-nation-card__name{font-family:var(--op-display);font-size:1.05rem;font-weight:600;color:var(--op-ink)}
.op-nation-card__count{font-size:12.5px;color:var(--op-ink-3)}


/* Card prodotto nei listing (/guide/, /audioguide/, ...): immagine + badge nazione, dimensioni uniformi. */
.op-card--product{padding:0;overflow:hidden}
.op-card--product .op-card__meta,
.op-card--product .op-card__title,
.op-card--product .op-card__desc,
.op-card--product .op-card__time{padding-inline:16px}
.op-card--product .op-card__meta{margin-top:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.op-card--product .op-card__title{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.64em}
.op-card--product .op-card__desc{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:3.1em}
.op-card--product .op-card__time{padding-bottom:14px;white-space:nowrap}

/* Card generica con immagine (articoli su archivi/categorie): stesso trattamento visivo dei prodotti. */
.op-card--media{padding:0;overflow:hidden}
.op-card--media .op-card__meta,
.op-card--media .op-card__title,
.op-card--media .op-card__desc,
.op-card--media .op-card__time{padding-inline:16px}
.op-card--media .op-card__meta{margin-top:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.op-card--media .op-card__title{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.64em}
.op-card--media .op-card__desc{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:3.1em}
.op-card--media .op-card__time{padding-bottom:14px;white-space:nowrap}
.op-card__media{position:relative;display:block;width:100%;aspect-ratio:3/2;background:var(--op-sky-2);overflow:hidden}
.op-card__img{width:100%;height:100%;object-fit:cover;display:block}
/* Il vecchio style.css del tema porta una regola .op-card img{height:160px} (0,1,1) che
   batte per specificita' .op-card__img (0,1,0), schiacciando l'immagine e lasciando uno
   spazio vuoto color sfondo sotto la foto. Override mirato, piu' specifico, per farla
   tornare a riempire tutto il box .op-card__media. */
.op-card__media .op-card__img{height:100%}
.op-card__img--placeholder{display:flex;align-items:center;justify-content:center;color:var(--op-accent-200)}
.op-card__img--placeholder svg{width:36px;height:36px}
.op-card__badge-nazione{position:absolute;top:10px;left:10px;margin:0;background:var(--op-white);box-shadow:var(--op-shadow-sm)}

/* Bottone "Vedi tutte le disponibilita' a {citta}" (single-dove-dormire.php): la parte
   citta'/nazione e' in uno <span> a se' cosi' possiamo accorciare la CTA sui telefoni
   piccoli invece di lasciarla andare a capo su piu' righe. */
@media(max-width:480px){
  .op-cerca-tutti .op-btn__extra{display:none}
}


/* Hub tema generica: sezioni per nazione + paginazione JS (hub-tema-generico.php).
   Ogni nazione e' un blocco a se' con intestazione ben visibile (bandiera + nome +
   conteggio), separata dalle altre da un bordo; la paginazione mostra/nasconde blocchi
   di pagina gia' presenti nel markup, senza mai ricaricare o cambiare l'URL. */
.op-hub-nation{margin-bottom:36px}
.op-hub-nation:last-child{margin-bottom:0}
.op-hub-nation__title{display:flex;align-items:center;flex-wrap:wrap;gap:10px;font-family:var(--op-display);font-size:1.05rem;font-weight:700;color:var(--op-ink);margin:0 0 16px;padding-bottom:10px;border-bottom:2px solid var(--op-accent-200)}
.op-hub-nation__flag{font-size:1.4rem;line-height:1}
.op-hub-nation__count{margin-left:auto;font-size:.8rem;font-weight:500;color:var(--op-ink-3)}

.op-hub-pager{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:32px;flex-wrap:wrap}
.op-hub-pager__btn{display:inline-flex;align-items:center;gap:6px;padding:9px 16px;background:var(--op-white);border:1px solid var(--op-line);border-radius:999px;font-size:14px;font-weight:600;color:var(--op-ink-2);cursor:pointer;transition:border-color .15s,color .15s}
.op-hub-pager__btn svg{width:11px;height:11px;flex:0 0 auto}
.op-hub-pager__btn--prev svg{transform:rotate(90deg)}
.op-hub-pager__btn--next svg{transform:rotate(-90deg)}
.op-hub-pager__btn:hover:not(:disabled){border-color:var(--op-accent-200);color:var(--op-brand)}
.op-hub-pager__btn:disabled{opacity:.35;cursor:default}
.op-hub-pager__pages{display:flex;gap:6px;flex-wrap:wrap;justify-content:center}
.op-hub-pager__page{width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;background:var(--op-white);border:1px solid var(--op-line);border-radius:50%;font-size:14px;font-weight:600;color:var(--op-ink-2);cursor:pointer;transition:border-color .15s,background-color .15s,color .15s}
.op-hub-pager__page:hover{border-color:var(--op-accent-200)}
.op-hub-pager__page.is-active{background:var(--op-ink);border-color:var(--op-ink);color:var(--op-white)}