/* Seven Seconds — riutilizzabile per Uncode / qualsiasi codebase
   Token: bg #FFFFFF · ink #0A0A0A · signal lime #B8EC2E · on-signal #0A0A0A
   Angoli: 2px ovunque (50% solo cerchi). Font: Bricolage Grotesque + Geist Mono. */

:root{
  --ground:#FFFFFF; --ink:#0A0A0A; --signal:#B8EC2E; --on-signal:#0A0A0A;
  --line:#0A0A0A; --muted:#0A0A0A; --faint:#0A0A0A;
}

.ss-mono{ font-family:'Geist Mono',ui-monospace,monospace; }

/* ---- News / Journal card: hover inverte a lime, freccia bianca ---- */
.ss-cell{ transition:background .28s ease, color .28s ease; }
.ss-cell:hover{ background:var(--signal); }
.ss-cell:hover .ss-mono:not(.ss-arrow){ color:var(--on-signal); }
.ss-arrow{ transition:transform .3s cubic-bezier(.2,.8,.2,1), background .25s, color .25s, border-color .25s; }
.ss-cell:hover .ss-arrow{ background:var(--on-signal); color:#FFFFFF; border-color:var(--on-signal); transform:translate(3px,-3px); }

/* ---- Hover-lift (card prodotto / moduli / pricing) ---- */
.ss-lift{ transition:transform .32s cubic-bezier(.2,.8,.2,1), box-shadow .32s ease; }
.ss-lift:hover{ transform:translateY(-4px); box-shadow:0 14px 34px rgba(10,10,10,.12); }

/* ---- CTA che scorre su hover della card ---- */
.ss-cta{ transition:transform .32s cubic-bezier(.2,.8,.2,1); }
.ss-lift:hover .ss-cta{ transform:translateX(8px); }

/* ---- Zoom immagine ---- */
.ss-zoom{ overflow:hidden; }
.ss-zoom img{ transition:transform .9s cubic-bezier(.2,.8,.2,1); }
.ss-zoom:hover img{ transform:scale(1.06); }

/* ---- Header: shrink + ombra + progress bar ---- */
.ss-head{ transition:box-shadow .3s ease; }
.ss-bar{ transition:height .32s cubic-bezier(.2,.8,.2,1); height:64px; }
.ss-scrolled .ss-bar{ height:52px; }
.ss-scrolled{ box-shadow:0 10px 30px rgba(10,10,10,.10); }
.ss-progress{ position:fixed; top:0; left:0; height:2px; background:var(--signal); width:0; z-index:60; transition:width .12s linear; }

/* ---- Reveal allo scroll (stato iniziale; .is-in da JS) ---- */
.ss-reveal{ opacity:0; transform:translateY(30px); transition:opacity .7s cubic-bezier(.2,.8,.2,1), transform .7s cubic-bezier(.2,.8,.2,1); }
.ss-reveal.is-in{ opacity:1; transform:none; }

/* ---- Accordion moduli (mobile) ---- */
.ss-mod-head{ display:flex; align-items:center; gap:12px; width:100%; background:none; border:none; text-align:left; color:#0A0A0A; padding:0; cursor:pointer; }
.ss-chev{ margin-left:auto; flex:none; transition:transform .25s ease; display:none; }
@media (min-width:861px){ .ss-mod-head{ cursor:default; pointer-events:none; } }

/* ---- Mobile (≤860px) ---- */
.ss-burger{ display:none; }
.ss-mobile-menu{ position:fixed; inset:0; z-index:70; background:var(--ground); display:flex; flex-direction:column;
  transform:translateX(100%); transition:transform .35s cubic-bezier(.2,.8,.2,1); visibility:hidden; }
.ss-mobile-menu.open{ transform:translateX(0); visibility:visible; }
@media (min-width:861px){ .ss-mobile-menu{ display:none; } }
@media (max-width:860px){
  .ss-desktop-nav{ display:none; }
  .ss-coords{ display:none; }
  .ss-burger{ display:flex; }
  /* margini laterali ridotti: piu' spazio ai blocchi */
  .ss-section, .ss-container{ padding-left:7px !important; padding-right:7px !important; }
  /* griglie multi-colonna in colonna singola */
  .ss-grid-2,.ss-grid-3,.ss-grid-4{ grid-template-columns:1fr !important; }
  /* accordion: header tappabile, corpo collassabile */
  .ss-mod-head{ cursor:pointer; }
  .ss-chev{ display:block; }
  .ss-mod-body{ display:none !important; }
  .ss-mod.open .ss-mod-body{ display:grid !important; grid-template-columns:1fr !important; }
  .ss-mod.open .ss-chev{ transform:rotate(180deg); }
}

/* =========================================================
   Classi usate negli shortcode Uncode (uncode-blocks/*.txt)
   ========================================================= */
.ss-mono{ font-family:'Geist Mono',ui-monospace,monospace; text-transform:uppercase; letter-spacing:.1em; font-size:11px; color:#0A0A0A; }
.ss-signal{ color:#0A0A0A; background:#B8EC2E; padding:2px 6px; }
.ss-soft{ color:rgba(255,255,255,.72) !important; }
.ss-white{ color:#fff !important; }

/* Titoli */
.ss-hero-h h1,.ss-hero-h{ font-family:'Bricolage Grotesque',sans-serif; font-weight:800; letter-spacing:-.045em; line-height:.94; font-size:clamp(44px,7vw,104px); }
.ss-h2 h2,.ss-h2{ font-family:'Bricolage Grotesque',sans-serif; font-weight:700; letter-spacing:-.035em; font-size:clamp(26px,3.2vw,46px); }
.ss-manifesto-h{ font-size:clamp(40px,6vw,92px) !important; }
.ss-lead{ font-size:18px; line-height:1.6; max-width:60ch; }
.ss-emo{ font-size:clamp(22px,2.7vw,36px); font-weight:500; letter-spacing:-.02em; line-height:1.2; }

/* Card generica + varianti */
.ss-card{ border:1px solid #0A0A0A; padding:30px; background:#fff; }
.ss-card h3,.ss-card h4{ font-family:'Bricolage Grotesque',sans-serif; letter-spacing:-.02em; margin:.4em 0; }
.ss-dark{ background:#0A0A0A; color:#fff; }
.ss-dark h3{ color:#fff; }
.ss-tag{ color:#0A0A0A; }
.ss-chip{ background:#B8EC2E; padding:4px 8px; }

/* Stat / pricing */
.ss-stat{ font-family:'Bricolage Grotesque',sans-serif; font-weight:700; letter-spacing:-.04em; font-size:clamp(30px,3.6vw,52px); display:block; }
.ss-plan{ border:1px solid #0A0A0A; padding:30px; background:#fff; }
.ss-plan-hi{ outline:3px solid #B8EC2E; }
.ss-badge{ background:#B8EC2E; padding:3px 8px; }
.ss-price{ font-family:'Bricolage Grotesque',sans-serif; font-weight:700; font-size:40px; letter-spacing:-.03em; }

/* Visualift moduli */
.ss-mark{ display:inline-grid; place-items:center; width:42px; height:42px; border-radius:2px; font-weight:800; }
.ss-dot{ display:inline-block; width:12px; height:12px; border-radius:50%; }

/* Bottoni */
.ss-btn-signal a,.ss-btn-signal{ background:#B8EC2E !important; color:#0A0A0A !important; border-radius:2px !important; font-weight:700; }
.ss-btn-dark a,.ss-btn-dark{ background:#0A0A0A !important; color:#fff !important; border-radius:2px !important; font-weight:700; }

/* Liste lavori / journal */
.ss-workrow{ display:block; border-bottom:1px solid #0A0A0A; padding:18px 0; color:#0A0A0A; text-decoration:none; transition:padding-left .25s; }
.ss-workrow:hover{ padding-left:10px; }
.ss-case img,.ss-post img,.ss-feat img,.ss-case-grid img{ width:100%; display:block; border:1px solid #0A0A0A; }
.ss-chips{ font-family:'Geist Mono',monospace; font-size:13px; line-height:2; }

/* Tutto squadrato */
.ss-card,.ss-plan,.ss-module,.ss-case,.ss-post,.ss-feat,.vc_btn3,.wpb_button,.ss-form-wrap input,.ss-form-wrap textarea{ border-radius:2px !important; }


/* =========================================================
   Form contatti (Contact Form 7 — form/contact-form-7.txt)
   ========================================================= */
.ss-form{ border:1px solid #0A0A0A; border-radius:2px; padding:32px; background:#fff; }
.ss-form-kicker{ margin:26px 0 10px; font-size:11px; }
.ss-form-kicker:first-child{ margin-top:0; }
.ss-form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:4px 14px; }
.ss-form label{ font-family:'Geist Mono',ui-monospace,monospace; font-size:10px; letter-spacing:.1em; text-transform:uppercase; color:#0A0A0A; }
.ss-form input[type="text"],.ss-form input[type="email"],.ss-form input[type="url"],.ss-form input[type="tel"],
.ss-form select,.ss-form textarea{
  width:100%; background:#fff; border:1px solid #0A0A0A; border-radius:2px;
  padding:12px 13px; font-family:'Bricolage Grotesque',sans-serif; font-size:15px; color:#0A0A0A; outline:none;
}
.ss-form input:focus,.ss-form select:focus,.ss-form textarea:focus{ outline:2px solid #B8EC2E; outline-offset:-1px; }
.ss-form .wpcf7-checkbox .wpcf7-list-item{ display:inline-block; margin:0 10px 8px 0; }
.ss-form .wpcf7-checkbox label{ display:inline-flex; align-items:center; gap:8px; border:1px solid #0A0A0A; border-radius:2px; padding:10px 14px; cursor:pointer; font-size:12px; }
.ss-form .wpcf7-checkbox input:checked + span{ background:#B8EC2E; }
.ss-form input.ss-btn-signal,.ss-form .wpcf7-submit{
  background:#B8EC2E; color:#0A0A0A; border:none; border-radius:2px; cursor:pointer;
  font-weight:700; font-size:15px; padding:15px 24px; font-family:'Bricolage Grotesque',sans-serif;
}
@media (max-width:860px){ .ss-form-grid{ grid-template-columns:1fr; } .ss-form{ padding:18px 14px; } }