:root{
  --op-max: 1100px;

  /* Palette “C” (brand green + tanto bianco) */
  --op-bg: #f6f7f4;
  --op-surface: #ffffff;
  --op-surface-2: #f0f3ee;
  --op-text: #0f1b14;
  --op-muted: rgba(15,27,20,.72);
  --op-line: rgba(15,27,20,.10);

  --op-hero: #0f3a2a;
  --op-hero-2: #0c2f22;
  --op-hero-text: rgba(255,255,255,.92);
  --op-hero-muted: rgba(255,255,255,.72);
}

/* base */
body{ background: var(--op-bg); color: var(--op-text); }
main{ background: transparent; }

/* wrappers */
.op-wrap{ max-width: var(--op-max); margin: 0 auto; padding: 0 16px; }

/* top bar */
.op-top{ position: sticky; top: 0; z-index: 50; backdrop-filter: blur(10px); background: rgba(246,247,244,.78); border-bottom: 1px solid var(--op-line); }
.op-top .op-wrap{ display:flex; align-items:center; gap:16px; padding: 12px 16px; }
.op-brand{ display:flex; align-items:baseline; gap:10px; text-decoration:none; color: inherit; }
.op-logo{ font-weight: 700; letter-spacing:.5px; }
.op-sub{ opacity:.75; font-size: 12px; }
.op-nav{ display:flex; gap:14px; margin-left:auto; }
.op-nav a{ color: inherit; text-decoration:none; opacity:.82; font-size: 14px; }
.op-nav a:hover{ opacity:1; }
.op-cta{ display:flex; gap:10px; }

.op-btn{ display:inline-flex; align-items:center; justify-content:center; gap:8px; padding: 10px 14px; border-radius: 999px; text-decoration:none; font-weight:600; font-size:14px; }
.op-btn-solid{ background: var(--accent, #18d26e); color: var(--accentText, #07140d); }
.op-btn-ghost{ border: 1px solid var(--op-line); color: inherit; background: rgba(255,255,255,.55); }

.op-burger{ display:none; margin-left:auto; width:44px; height:38px; border-radius: 10px; border: 1px solid var(--op-line); background: rgba(255,255,255,.55); }
.op-burger span{ display:block; height:2px; margin: 6px 10px; background: currentColor; opacity:.9; }

.op-mobile{ display:none; padding: 12px 16px 16px; border-top: 1px solid var(--op-line); background: rgba(246,247,244,.92); }
.op-mobile a{ display:block; padding: 10px 10px; border-radius: 10px; text-decoration:none; color: inherit; opacity:.9; }
.op-mobile a:hover{ background: rgba(0,0,0,.04); opacity:1; }
.op-mobile-cta{ display:flex; gap:10px; padding-top: 8px; flex-wrap:wrap; }

body.op-menu .op-mobile{ display:block; }

/* hero */
.op-hero{
  padding: 54px 0 26px;
  background: radial-gradient(1200px 500px at 15% 10%, rgba(255,255,255,.10), transparent 60%),
              linear-gradient(135deg, var(--op-hero), var(--op-hero-2));
  color: var(--op-hero-text);
}
.op-hero-grid{ display:grid; grid-template-columns: 1.05fr .95fr; gap: 22px; align-items: start; }
.op-kicker{ display:inline-flex; padding: 6px 10px; border-radius: 999px; border: 1px solid rgba(255,255,255,.18); background: rgba(255,255,255,.06); font-size: 12px; color: var(--op-hero-text); }
.op-hero h1{ margin: 12px 0 10px; font-size: clamp(28px, 3.2vw, 44px); line-height: 1.12; }
.op-accent{ color: var(--accent, #18d26e); }
.op-lead{ color: var(--op-hero-muted); line-height: 1.62; font-size: 15px; }
.op-actions{ display:flex; gap: 12px; margin: 18px 0 12px; flex-wrap: wrap; }
.op-hero .op-btn-ghost{ border-color: rgba(255,255,255,.22); background: rgba(255,255,255,.08); color: rgba(255,255,255,.92); }
.op-badges{ display:flex; gap: 10px; flex-wrap: wrap; padding-top: 8px; }
.op-badge{ font-size: 12px; padding: 6px 10px; border-radius: 999px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.14); color: rgba(255,255,255,.88); }

.op-hero-card{ border-radius: var(--radius, 18px); background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.14); box-shadow: var(--shadow, 0 16px 50px rgba(0,0,0,.30)); overflow:hidden; }
.op-mock-top{ display:flex; align-items:center; gap:8px; padding: 12px 12px; border-bottom: 1px solid rgba(255,255,255,.10); }
.op-dot{ width:10px; height:10px; border-radius:999px; background: rgba(255,255,255,.20); }
.op-mock-title{ margin-left:auto; font-size: 12px; opacity:.78; }
.op-mock-body{ display:grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; padding: 12px; }
.op-mock-col{ border-radius: 14px; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.10); padding: 10px; }
.op-chip{ display:inline-flex; font-weight:700; letter-spacing:.4px; font-size: 11px; padding: 5px 8px; border-radius: 999px; background: rgba(24,210,110,.14); border: 1px solid rgba(24,210,110,.30); color: var(--accent, #18d26e); }
.op-line{ height: 1px; background: rgba(255,255,255,.12); margin: 10px 0; }
.op-item{ display:flex; flex-direction: column; gap: 2px; padding: 8px 0; border-bottom: 1px dashed rgba(255,255,255,.12); }
.op-item:last-child{ border-bottom: 0; }
.op-item b{ font-size: 12px; }
.op-item span{ font-size: 12px; opacity:.80; }

.op-mini{ padding: 12px; border-top: 1px solid rgba(255,255,255,.10); display:grid; gap: 8px; }
.op-mini-row{ display:flex; justify-content: space-between; gap: 10px; font-size: 12px; color: rgba(255,255,255,.86); }
.op-mini-row span{ opacity:.72; }

/* strip */
.op-strip{ padding: 18px 0; background: var(--op-surface); border-bottom: 1px solid var(--op-line); }
.op-strip-grid{ display:grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.op-strip-item{ border-radius: 16px; padding: 14px; background: var(--op-surface-2); border: 1px solid var(--op-line); }
.op-strip-item b{ display:block; }
.op-strip-item span{ color: var(--op-muted); font-size: 13px; }

/* sections */
.op-sec{ padding: 52px 0; }
.op-alt{ background: var(--op-surface); border-top: 1px solid var(--op-line); border-bottom: 1px solid var(--op-line); }
.op-sec-head{ max-width: 720px; }
.op-sec-head h2{ margin: 0 0 10px; font-size: 28px; }
.op-sec-head p{ margin: 0 0 18px; color: var(--op-muted); line-height: 1.65; }

.op-steps{ display:grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.op-step{ border-radius: var(--radius, 18px); background: var(--op-surface); border: 1px solid var(--op-line); padding: 16px; }
.op-step-n{ width:34px; height:34px; border-radius: 12px; display:flex; align-items:center; justify-content:center; background: rgba(24,210,110,.12); border: 1px solid rgba(24,210,110,.25); color: var(--accent, #18d26e); font-weight: 800; }
.op-step h3{ margin: 10px 0 6px; }
.op-step p{ margin: 0; color: var(--op-muted); line-height: 1.6; }

.op-callout{ margin-top: 18px; display:flex; align-items:center; justify-content: space-between; gap: 14px; padding: 18px; border-radius: var(--radius, 18px); background: rgba(24,210,110,.10); border: 1px solid rgba(24,210,110,.20); }
.op-callout h3{ margin: 0 0 4px; }
.op-callout p{ margin: 0; color: rgba(15,27,20,.78); }
.op-callout-cta{ display:flex; gap: 10px; flex-wrap: wrap; }

.op-cards{ display:grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.op-card{ border-radius: var(--radius, 18px); background: var(--op-surface); border: 1px solid var(--op-line); padding: 16px; }
.op-card h3{ margin: 0 0 8px; }
.op-card p{ margin: 0; color: var(--op-muted); line-height: 1.6; }

.op-modules{ display:grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.op-module{ border-radius: 16px; padding: 14px; background: var(--op-surface); border: 1px solid var(--op-line); }
.op-module b{ display:block; }
.op-module span{ display:block; color: var(--op-muted); font-size: 13px; line-height: 1.45; padding-top: 2px; }
.op-note{ margin-top: 14px; color: var(--op-muted); padding: 12px 14px; border-radius: 14px; border: 1px dashed var(--op-line); background: rgba(255,255,255,.65); }

/* faq */
.op-faq details{ border-radius: 16px; background: var(--op-surface); border: 1px solid var(--op-line); padding: 12px 14px; margin-bottom: 10px; }
.op-faq summary{ cursor:pointer; font-weight: 650; }
.op-faq-body{ padding-top: 10px; color: var(--op-muted); line-height: 1.6; }

/* contact */
.op-contact-grid{ display:grid; grid-template-columns: 1fr 1fr; gap: 18px; align-items:start; }
.op-contact-list{ display:grid; gap: 10px; padding-top: 8px; }
.op-contact{ display:flex; justify-content: space-between; align-items: baseline; gap: 10px; text-decoration:none; color: inherit; padding: 12px 14px; border-radius: 16px; background: var(--op-surface); border: 1px solid var(--op-line); }
.op-contact span{ opacity:.75; font-size: 12px; }
.op-contact b{ font-size: 14px; }

.op-form{ border-radius: var(--radius, 18px); background: var(--op-surface); border: 1px solid var(--op-line); padding: 16px; }
.op-label{ display:block; font-size: 12px; opacity: .8; padding: 8px 2px 6px; }
.op-form .ricercaprodotti{ width: 100% !important; max-width: 100% !important; margin: 0 !important; box-sizing: border-box; }
.op-form textarea.ricercaprodotti{ resize: vertical; min-height: 110px; }
.op-form .frm-submit{ width: 100% !important; max-width: 100% !important; margin: 12px 0 0 !important; box-sizing: border-box; }
.op-privacy{ margin: 10px 2px 0; font-size: 12px; opacity: .7; }

/* footer */
.op-foot{ padding: 22px 0; border-top: 1px solid var(--op-line); background: rgba(255,255,255,.65); }
.op-foot-grid{ display:flex; align-items:center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.op-foot-sub{ color: var(--op-muted); font-size: 12px; padding-top: 2px; }
.op-foot-links{ display:flex; gap: 12px; }
.op-foot-links a{ color: inherit; opacity:.78; text-decoration:none; font-size: 13px; }
.op-foot-links a:hover{ opacity:1; }
.op-foot-copy{ color: var(--op-muted); font-size: 12px; }

/* responsive */
@media (max-width: 980px){
  .op-hero-grid{ grid-template-columns: 1fr; }
  .op-strip-grid{ grid-template-columns: 1fr; }
  .op-steps{ grid-template-columns: 1fr; }
  .op-cards{ grid-template-columns: 1fr; }
  .op-modules{ grid-template-columns: 1fr 1fr; }
  .op-contact-grid{ grid-template-columns: 1fr; }
  .op-mock-body{ grid-template-columns: 1fr; }
  .op-nav, .op-cta{ display:none; }
  .op-burger{ display:block; }
  body.op-menu .op-burger{ background: rgba(255,255,255,.75); }
}
.section-light{
  background:#ffffff;
  padding:80px 0;
}

.patent-card{
  max-width:900px;
  margin:0 auto;
  background:#ffffff;
  border:1px solid #e6e6e6;
  border-radius:14px;
  padding:40px;
  text-align:center;
  box-shadow:0 10px 30px rgba(0,0,0,0.04);
}

.patent-card h2{
  margin-bottom:20px;
  font-size:28px;
  font-weight:600;
  color:#111;
}

.patent-card p{
  font-size:17px;
  line-height:1.6;
  color:#444;
}
.patent-icon{
  font-size:32px;
  margin-bottom:15px;
  opacity:0.8;
}