/* ==========================================================================
   iSpazio Theme — Base
   Design tokens, reset, typography, utility classes.
   ========================================================================== */

/* --- Design Tokens --- */
:root{
--isp-bg:#f4f6fa;
--isp-surface:#fff;
--isp-border:#e4e9f2;
--isp-border-soft:#e4e8ee;
--isp-ink:#0f1d36;
--isp-ink2:#3a4a68;
--isp-mute:#57667d;
--isp-brand:#1e63d4;
--isp-brand-dark:#174ea8;
--isp-brand-soft:#e8efff;
--isp-accent:#d4572c;
--isp-accent-soft:#fbe8dd;
--isp-success:#2d7a6f;
--isp-live:#c22;
--isp-font:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",system-ui,Roboto,"Helvetica Neue",Arial,sans-serif;
--isp-font-mono:"SF Mono","Fira Code",Consolas,monospace;
--isp-sp-xs:4px;
--isp-sp-sm:8px;
--isp-sp-md:16px;
--isp-sp-lg:24px;
--isp-sp-xl:32px;
--isp-sp-2xl:48px;
--isp-max-w:1280px;
--isp-sidebar-w:320px;
--isp-radius:12px;
--isp-radius-sm:8px;
--isp-radius-lg:16px;
--isp-shadow-sm:0 1px 3px rgba(15,29,54,.06);
--isp-shadow-md:0 4px 12px rgba(15,29,54,.08);
--isp-shadow-lg:0 8px 24px rgba(15,29,54,.1);
--isp-body-size:16px;
--isp-body-lh:1.6;
--isp-article-size:18px;
--isp-article-lh:1.75;
--isp-article-title-size:38px;
--isp-h1-size:40px;
--isp-h2-size:28px;
--isp-h3-size:22px;
--isp-h4-size:18px;
--isp-card-title-size:16px;
--isp-card-title-size-3col:15px;
--isp-card-title-size-4col:14px;
--isp-deal-name-size:15px;
--isp-single-title-size:32px;
--isp-single-title-ls:-0.03em;
--isp-card-excerpt-size:13px;
--isp-meta-size:12px;
/* La descrizione categoria eredita la dimensione del testo articolo: cambiando
   "Testo articolo" dalle Impostazioni Tema, anche le descrizioni categoria si
   adattano automaticamente. L'opzione typo_category_desc_size, se valorizzata,
   sovrascrive comunque tramite il blocco :root iniettato da class-assets.php. */
--isp-cat-desc-size:var(--isp-article-size)
}
/* Mobile: contenuto pagina/articolo a 16px (≈ 18px desktop) */
@media(max-width:640px){:root{--isp-article-size:16px}}
@media(max-width:1024px){:root{--isp-single-title-size:28px}}
@media(max-width:640px){:root{--isp-single-title-size:22px;--isp-single-title-ls:-.5px}}

/* --- Reset --- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth;overflow-x:hidden}
body{font-family:var(--isp-font);font-size:var(--isp-body-size);line-height:var(--isp-body-lh);color:var(--isp-ink);background:var(--isp-bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}
img,picture,video,svg{display:block;max-width:100%;height:auto}
img{border:0}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit;border:0;background:none}
button{cursor:pointer}
ul,ol{list-style:none}
table{border-collapse:collapse;border-spacing:0}
[hidden]{display:none!important}

/* --- Typography Scale --- */
h1,h2,h3,h4,h5,h6{font-weight:700;line-height:1.2;letter-spacing:-.02em}
h1{font-size:clamp(28px,4vw,var(--isp-h1-size))}
h2{font-size:clamp(22px,3vw,var(--isp-h2-size))}
h3{font-size:clamp(18px,2.5vw,var(--isp-h3-size))}
h4{font-size:var(--isp-h4-size)}
h5{font-size:16px}
h6{font-size:14px}

p{margin-bottom:1em}
p:last-child{margin-bottom:0}

strong,b{font-weight:600}

/* --- Focus visible --- */
:focus-visible{outline:2px solid var(--isp-brand);outline-offset:2px;border-radius:4px}

/* --- Selection --- */
::selection{background:var(--isp-brand-soft);color:var(--isp-ink)}

/* --- SVG icons --- */
.isp-icon{display:inline-block;vertical-align:middle;flex-shrink:0}

/* --- Tabs UI (used by Elementor compat AND custom page templates) --- */
.isp-tabs{margin:1.6em 0}
.isp-tabs__nav{display:inline-flex;flex-wrap:wrap;gap:6px;padding:6px;background:var(--isp-bg);border-radius:14px;margin-bottom:18px}
.isp-tabs__btn{display:inline-flex;align-items:center;justify-content:center;padding:10px 22px;border:0;background:transparent;color:var(--isp-mute);font-size:15px;font-weight:600;line-height:1;border-radius:10px;cursor:pointer;transition:background .15s,color .15s;font-family:inherit}
.isp-tabs__btn:hover{background:rgba(30,99,212,.08);color:var(--isp-ink)}
.isp-tabs__btn--active,.isp-tabs__btn--active:hover{background:var(--isp-brand);color:#fff;box-shadow:0 2px 8px rgba(15,29,54,.08)}
.isp-tabs__panel{display:none;animation:isp-tabs-fade .25s ease}
.isp-tabs__panel--active{display:block}
@keyframes isp-tabs-fade{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.isp-tabs__panel{animation:none}}

/* --- Screen reader only --- */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.isp-skip-link{position:absolute;top:-100%;left:16px;z-index:9999;padding:12px 24px;background:var(--isp-brand);color:#fff;font-size:14px;font-weight:600;border-radius:0 0 8px 8px;text-decoration:none;transition:top .2s}
.isp-skip-link:focus{top:0}

/* --- Image placeholder --- */
.isp-img{display:block;width:100%;height:auto;object-fit:cover}
.isp-img-placeholder{display:flex;align-items:center;justify-content:center}

/* --- Shared keyframes (consolidated; previously duplicated in deals.css/sidebar.css) --- */
@keyframes isp-pulse{0%,100%{opacity:1}50%{opacity:.4}}
@keyframes isp-pulse-soft{0%,100%{opacity:.5}50%{opacity:1}}
@keyframes isp-spin{to{transform:rotate(360deg)}}

/* --- Performance: containment + lazy section reveal --- */
.isp-card,.isp-widget{contain:layout style paint}
@supports (content-visibility:auto){
  .isp-lazy,.isp-lazy-section{content-visibility:auto;contain-intrinsic-size:auto 600px}
}

/* --- Respect user motion preference --- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
}

/* --- Responsive visibility utilities --- */
@media(min-width:641px){.isp-hide-desktop{display:none!important}}
@media(max-width:640px){.isp-hide-mobile{display:none!important}}

/* --- WP aligncenter / alignright (global, applied also on pages) --- */
img.aligncenter,.aligncenter img{display:block;margin-left:auto !important;margin-right:auto !important}
figure.aligncenter,.wp-block-image.aligncenter,p.aligncenter{display:block;margin-left:auto;margin-right:auto;text-align:center}
a:has(> img.aligncenter){display:block;text-align:center}
p:has(img.aligncenter),h1:has(img.aligncenter),h2:has(img.aligncenter),h3:has(img.aligncenter),h4:has(img.aligncenter),h5:has(img.aligncenter),h6:has(img.aligncenter){text-align:center}
img.alignright{display:block;margin-left:auto;margin-right:0}

/* --- Lightbox auto-aperto su click immagini con link interno (single+page) --- */
html.isp-lightbox-lock,html.isp-lightbox-lock body{overflow:hidden}
.isp-lightbox{position:fixed;inset:0;z-index:99999;display:none;align-items:center;justify-content:center;padding:24px;contain:layout paint}
.isp-lightbox--open,.isp-lightbox--closing{display:flex}
.isp-lightbox__backdrop{position:absolute;inset:0;background:rgba(0,0,0,.78);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);opacity:0;animation:isp-lb-fade-in .25s ease forwards}
.isp-lightbox--closing .isp-lightbox__backdrop{animation:isp-lb-fade-out .25s ease forwards}
.isp-lightbox__close{position:absolute;top:16px;right:16px;width:42px;height:42px;display:inline-flex;align-items:center;justify-content:center;background:rgba(255,255,255,.12);color:#fff;border:0;border-radius:50%;cursor:pointer;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:background .2s,transform .2s;z-index:2}
.isp-lightbox__close:hover{background:rgba(255,255,255,.22);transform:scale(1.05)}
.isp-lightbox__img{position:relative;max-width:min(96vw,1400px);max-height:90vh;width:auto;height:auto;display:block;border-radius:14px;box-shadow:0 30px 80px rgba(0,0,0,.55);transform-origin:center center;animation:isp-lb-pop .35s cubic-bezier(.34,1.56,.64,1) forwards;cursor:zoom-out;background:#0e1422}
.isp-lightbox--closing .isp-lightbox__img{animation:isp-lb-shrink .25s ease forwards}
@keyframes isp-lb-fade-in{from{opacity:0}to{opacity:1}}
@keyframes isp-lb-fade-out{from{opacity:1}to{opacity:0}}
@keyframes isp-lb-pop{from{opacity:0;transform:scale(.18)}60%{opacity:1}to{opacity:1;transform:scale(1)}}
@keyframes isp-lb-shrink{from{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.2)}}
@media (prefers-reduced-motion:reduce){.isp-lightbox__backdrop,.isp-lightbox__img{animation-duration:.01ms}}
@media(max-width:640px){.isp-lightbox{padding:14px}.isp-lightbox__close{top:10px;right:10px;width:38px;height:38px}}


/* --- Pill filters (shared: home article-grid + [tabnav] shortcode + admin filters) --- */
.isp-grid-filters{display:flex;gap:8px;align-items:center}
.isp-grid-filter{display:inline-flex;align-items:center;gap:6px;padding:9px 18px;font-size:14px;line-height:1.2;font-weight:600;color:var(--isp-mute);background:#fff;border:1.5px solid var(--isp-border);border-radius:10px;cursor:pointer;white-space:nowrap;text-decoration:none;transition:background .15s,color .15s,border-color .15s;box-shadow:none}
.isp-grid-filter:hover{background:#fff;color:var(--isp-brand);border-color:var(--isp-brand)}
.isp-grid-filter--active,.isp-grid-filter--active:hover{background:var(--isp-brand);color:#fff;border-color:var(--isp-brand)}
@media(max-width:640px){
.isp-grid-filters{overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.isp-grid-filters::-webkit-scrollbar{display:none}
}