/* "Opti-mized Insiders" signup (template-parts/site/insiders-signup.php). Light = mockup A; .ois--dark = navy (mockup B styling, A layout). */
@font-face { font-family:'Averta CY Web'; src:url('../fonts/om/AvertaCY-Regular.woff2') format('woff2'); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:'Averta CY Web'; src:url('../fonts/om/AvertaCY-Semibold.woff2') format('woff2'); font-weight:600; font-style:normal; font-display:swap; }

.ois { --ink:#1D1D1B; --body:#4a505c; --muted:#5b6270; --line:#edf0f5; --tile:#fff; --card:#fff; --blue:#4DAAE8; --green:#98C355; --yellow:#F7CA50; --red:#DB4B46;
  position:relative; overflow:hidden; padding:clamp(56px,8vh,88px) 0; color:var(--ink);
  background:radial-gradient(700px 400px at 85% 20%,rgba(77,170,232,.12),transparent 70%),#f7f9fc;
  font-family:'Averta CY Web','Averta CY',system-ui,-apple-system,'Segoe UI',sans-serif; -webkit-font-smoothing:antialiased; transition:background .35s,color .35s; }
.ois *, .ois *::before, .ois *::after { box-sizing:border-box; }
.ois h2, .ois h3, .ois p, .ois ul { margin:0; padding:0; font-family:inherit; text-transform:none; }
.ois ul { list-style:none; }
.ois__wrap { max-width:1200px; margin:0 auto; padding:0 24px; display:grid; grid-template-columns:1.05fr .95fr; gap:56px; align-items:center; }

.ois-badge { display:inline-flex; align-items:center; gap:8px; background:var(--ink); color:#fff; border-radius:999px; padding:7px 14px 7px 8px; font-size:13px; font-weight:600; letter-spacing:.04em; line-height:1.2; }
.ois-badge b { background:var(--yellow); color:var(--ink); border-radius:999px; padding:3px 9px; font-size:12px; font-weight:600; }
.ois-badge--glass { background:rgba(255,255,255,.12); }
.ois .ois__title { font-weight:600; font-size:46px; line-height:1.1; letter-spacing:-.02em; margin:18px 0 14px; color:var(--ink); }
.ois .ois__title em { font-style:normal; color:var(--blue); }
.ois .ois__lead { font-size:18px; line-height:1.55; color:var(--body); max-width:540px; margin-bottom:26px; font-weight:400; }

.ois-tiles { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.ois-tile { display:flex; gap:12px; align-items:center; padding:12px; border-radius:16px; font-size:15px; line-height:1.3; background:var(--tile); border:1px solid var(--line); box-shadow:0 10px 24px -20px rgba(29,29,27,.3); transition:background .35s,border-color .35s; }
.ois-tile b { display:block; font-weight:600; color:var(--ink); }
.ois-tile small { display:block; font-size:13px; color:var(--muted); margin-top:2px; }
.ois-ic { flex:0 0 40px; width:40px; height:40px; border-radius:12px; display:grid; place-items:center; color:#fff; }
.ois-ic svg { width:20px; height:20px; display:block; }
.ois-ic--b { background:linear-gradient(145deg,#6cbcf0,#4DAAE8); box-shadow:0 8px 18px -8px #4DAAE8; }
.ois-ic--g { background:linear-gradient(145deg,#aed173,#98C355); box-shadow:0 8px 18px -8px #98C355; }
.ois-ic--y { background:linear-gradient(145deg,#ffd86f,#F7CA50); box-shadow:0 8px 18px -8px #F7CA50; color:#1D1D1B; }
.ois-ic--r { background:linear-gradient(145deg,#e86d68,#DB4B46); box-shadow:0 8px 18px -8px #DB4B46; }
.ois-ph { background:#FFF3CC; color:#7a5a00; border:1px dashed #F7CA50; border-radius:6px; padding:0 6px; font-weight:600; font-size:.85em; white-space:nowrap; }
.ois-conf { display:inline-block; white-space:nowrap; font-size:10.5px; font-weight:600; letter-spacing:.04em; color:#7a5a00; background:#FFF3CC; border:1px dashed #F7CA50; border-radius:5px; padding:0 5px; margin-top:4px; }

.ois__side { position:relative; }
.ois-pass { position:relative; z-index:2; width:78%; margin:0 auto -64px; transform:rotate(-3deg); aspect-ratio:1.7; border-radius:22px; padding:22px 24px; color:#fff; overflow:hidden; display:flex; flex-direction:column; justify-content:space-between;
  background:radial-gradient(260px 180px at 100% 0%,rgba(77,170,232,.55),transparent 70%),radial-gradient(240px 160px at 0% 100%,rgba(152,195,85,.35),transparent 70%),linear-gradient(135deg,#1b2a5c,#0E1424);
  box-shadow:0 30px 60px -30px rgba(14,20,36,.7),inset 0 1px 0 rgba(255,255,255,.18); transition:transform .5s,box-shadow .35s; }
.ois-pass::after { content:""; position:absolute; inset:0; background:linear-gradient(115deg,transparent 40%,rgba(255,255,255,.10) 50%,transparent 60%); pointer-events:none; }
.ois__side:hover .ois-pass { transform:rotate(-1.5deg) translateY(-4px); }
.ois-pass__top, .ois-pass__row { display:flex; justify-content:space-between; align-items:center; }
.ois-pass__row { align-items:flex-end; }
.ois-pass__chip { display:block; width:42px; height:32px; border-radius:7px; background:linear-gradient(135deg,#ffe08a,#F7CA50 55%,#d9a92c); box-shadow:inset 0 0 0 1px rgba(0,0,0,.15); }
.ois-pass__lab { display:block; font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:#aab6d8; font-weight:600; margin-bottom:4px; }
.ois-pass__nm { display:block; font-size:26px; font-weight:600; letter-spacing:-.01em; line-height:1.15; }
.ois-dots { display:inline-flex; gap:6px; }
.ois-dots i { width:10px; height:10px; border-radius:50%; display:block; }
.ois-dots .b { background:#4DAAE8; } .ois-dots .g { background:#98C355; } .ois-dots .y { background:#F7CA50; } .ois-dots .r { background:#DB4B46; }

.ois-card { background:var(--card); border-radius:24px; padding:88px 30px 26px; box-shadow:0 24px 60px -34px rgba(29,29,27,.35); border:1px solid var(--line); transition:background .35s,border-color .35s; }
.ois .ois-card__title { margin:0 0 6px; font-size:22px; font-weight:600; color:var(--ink); line-height:1.25; }
.ois .ois-card__text { color:var(--body); font-size:15px; line-height:1.5; margin-bottom:18px; }
.ois-form { display:flex; gap:8px; background:#fff; border:1px solid #e3e7ef; border-radius:999px; padding:6px; margin:0; }
.ois-form input[type=email] { flex:1; min-width:0; height:auto; border:0; outline:0; box-shadow:none; font:inherit; font-size:16px; padding:0 18px; background:transparent; color:#1D1D1B; margin:0; }
.ois-form button { border:0; border-radius:999px; background:#1D1D1B; color:#fff; font:inherit; font-weight:600; font-size:15px; padding:14px 22px; white-space:nowrap; cursor:pointer; transition:transform .15s,box-shadow .2s; margin:0; line-height:1.2; }
.ois-form button:hover { transform:translateY(-1px); box-shadow:0 8px 20px -10px rgba(29,29,27,.6); }
.ois-form:focus-within { box-shadow:0 0 0 3px rgba(77,170,232,.35); }
.ois .ois-fine { font-size:13px; color:#7a808c; margin-top:12px; line-height:1.5; }
.ois-fine a { color:inherit; text-decoration:underline; }

/* Test toggle */
.ois-toggle { position:absolute; top:16px; right:16px; z-index:5; display:inline-flex; align-items:center; gap:4px; padding:4px; border-radius:999px; border:1px dashed #b9c2d3; background:rgba(255,255,255,.85); cursor:pointer; font:600 10px/1 'Averta CY Web',system-ui,sans-serif; color:#5b6270; box-shadow:0 6px 16px -10px rgba(29,29,27,.4); }
.ois-toggle__tag { padding:0 6px; letter-spacing:.12em; text-transform:uppercase; }
.ois-toggle__opt { width:28px; height:28px; border-radius:50%; display:grid; place-items:center; color:#8a91a0; transition:background .25s,color .25s; }
.ois-toggle__opt svg { width:16px; height:16px; display:block; }
.ois-toggle[aria-pressed=false] .ois-toggle__sun { background:#F7CA50; color:#1D1D1B; }
.ois-toggle[aria-pressed=true] .ois-toggle__moon { background:#4DAAE8; color:#0E1424; }
.ois-toggle:focus-visible { outline:2px solid #4DAAE8; outline-offset:2px; }

/* Dark (navy) */
.ois--dark { --ink:#fff; --body:#aab6d8; --muted:#aab6d8; --line:rgba(255,255,255,.09); --tile:rgba(255,255,255,.05); --card:rgba(255,255,255,.04);
  background:radial-gradient(700px 420px at 15% 0%,#1f3170 0,transparent 70%),radial-gradient(500px 360px at 100% 100%,rgba(77,170,232,.18),transparent 70%),#0E1424; }
.ois--dark .ois-badge { background:rgba(255,255,255,.1); }
.ois--dark .ois-tile { box-shadow:none; }
.ois--dark .ois-card { box-shadow:0 30px 60px -30px #000; }
.ois--dark .ois-pass { background:radial-gradient(240px 160px at 100% 0%,rgba(247,202,80,.35),transparent 70%),radial-gradient(240px 160px at 0% 100%,rgba(77,170,232,.45),transparent 70%),linear-gradient(135deg,#25386e,#121a33); border:1px solid rgba(255,255,255,.14); box-shadow:0 0 60px -10px rgba(77,170,232,.45),0 30px 60px -30px #000; }
.ois--dark .ois-form { border:0; box-shadow:0 0 0 4px rgba(77,170,232,.18); }
.ois--dark .ois-form button { background:#4DAAE8; color:#0E1424; }
.ois--dark .ois-fine { color:#8e9ac0; }
.ois--dark .ois-toggle { background:rgba(14,20,36,.7); border-color:rgba(255,255,255,.25); color:#aab6d8; }

@media (max-width:900px) {
  .ois { padding:56px 0 40px; }
  .ois__wrap { grid-template-columns:1fr; gap:28px; padding:0 16px; }
  .ois .ois__title { font-size:32px; }
  .ois .ois__lead { font-size:16px; }
  .ois-tiles { gap:8px; }
  .ois-tile { font-size:14px; padding:10px; gap:10px; }
  .ois-tile small { font-size:12px; }
  .ois-conf { font-size:9.5px; }
  .ois-ic { flex-basis:34px; width:34px; height:34px; border-radius:10px; }
  .ois-ic svg { width:17px; height:17px; }
  .ois-pass { width:72%; padding:16px 18px; border-radius:18px; margin-bottom:-48px; }
  .ois-pass__nm { font-size:20px; }
  .ois-pass__chip { width:32px; height:24px; }
  .ois-card { padding:68px 20px 22px; }
}
@media (max-width:600px) {
  .ois-form { flex-direction:column; border-radius:18px; }
  .ois-form input[type=email] { padding:14px; }
  .ois-form button { width:100%; }
}
@media (prefers-reduced-motion:reduce) { .ois, .ois * { transition:none !important; } }