/* Itzú opt-in page (Websites → Itzú · Yoga y deidades, user 4): her sketchbook look — cream paper, charcoal drawings, Fraunces */
@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,500;0,9..144,700;1,9..144,600&family=Inter:wght@400;500;600&display=swap');
body:has(.iz) { background: #f3ede0 !important; margin: 0; }
body:has(.iz) .prodby-public-wrap, body:has(.iz) .grapesjs-render, body:has(.iz) .prodby-visual-html { background: transparent !important; padding: 0 !important; margin: 0 !important; max-width: none !important; color: inherit; }
.iz { --paper: #f3ede0; --ink: #2b2622; --mut: #6b5f55; --acc: #8a5a2a; --line: rgba(43,38,34,.16);
  min-height: 100vh; color: var(--ink); line-height: 1.5; -webkit-font-smoothing: antialiased; font-family: 'Inter', system-ui, sans-serif;
  background: radial-gradient(ellipse at 50% 30%, rgba(230,190,150,.28), transparent 60%), radial-gradient(ellipse at 50% 120%, rgba(120,95,60,.18), transparent 60%), var(--paper); }
.iz *, .iz *::before, .iz *::after { box-sizing: border-box; }
.iz-wrap { width: min(560px, 100% - 32px); margin: 0 auto; padding: 48px 0 64px; text-align: center; }
.iz-kick { margin: 0 0 10px; font-size: 13px; letter-spacing: .38em; text-transform: uppercase; font-weight: 600; color: var(--mut); }
.iz h1 { margin: 0; font-family: 'Fraunces', serif; font-weight: 700; font-size: clamp(34px, 8vw, 52px); line-height: 1.08; letter-spacing: -.01em; }
.iz h1 em { color: var(--acc); font-style: italic; font-weight: 600; }
.iz-hero { display: block; width: min(210px, 52%); height: auto; margin: 14px auto 2px; mix-blend-mode: multiply; }
.iz-lead { margin: 0 auto 22px; font-family: 'Fraunces', serif; font-size: 20px; line-height: 1.45; max-width: 30em; }
.iz-list { list-style: none; margin: 0 0 26px; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.iz-list li { display: flex; flex-direction: column; align-items: center; gap: 6px; font-size: 14px; color: var(--mut); line-height: 1.35; }
.iz-list img { width: 84px; height: 84px; object-fit: contain; mix-blend-mode: multiply; }
.iz-form { display: grid; gap: 10px; text-align: left; background: rgba(255,253,248,.7); border: 1px solid var(--line); border-radius: 18px; padding: 18px; }
.iz-form label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.iz-form input[type="text"], .iz-form input[type="email"] { width: 100%; font: inherit; font-size: 17px; padding: 14px 16px; border-radius: 12px; border: 1px solid var(--line); background: #fffdf8; color: var(--ink); }
.iz-form input:focus-visible { outline: 2px solid var(--acc); outline-offset: 1px; }
.iz-form button { font: inherit; font-size: 18px; font-weight: 600; padding: 15px 18px; border: 0; border-radius: 12px; background: var(--ink); color: #fffdf8; cursor: pointer; }
.iz-form button:hover { background: #3d342e; }
.iz-form button:focus-visible { outline: 2px solid var(--acc); outline-offset: 2px; }
.iz-hp { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.iz-note { display: none; margin: 14px 0 0; padding: 12px 14px; border-radius: 12px; background: rgba(120,160,110,.18); font-weight: 500; }
.iz-note--err { background: rgba(190,90,70,.16); }
.iz-note:target { display: block; }
.iz-fine { margin: 14px 0 0; font-size: 13px; color: var(--mut); }
@media (max-width: 420px) { .iz-list { gap: 6px; } .iz-list img { width: 68px; height: 68px; } .iz-list li { font-size: 13px; } }