/* Kamala Studio – newsletter sign-up and course inquiry (light site theme). */

.stk-nl, .stk-inq-box {
	--x-ink: var(--wp--preset--color--ink, #1c1318);
	--x-muted: var(--wp--preset--color--muted, #6b5e64);
	--x-line: var(--wp--preset--color--line, #e6dbd4);
	--x-sand: var(--wp--preset--color--sand, #f1e8e2);
	--x-rose-deep: var(--wp--preset--color--rose-deep, #8f4f3e);
	--x-serif: "STK Cormorant", "Cormorant Garamond", Georgia, serif;
	--x-sans: "STK Manrope", Manrope, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	box-sizing: border-box;
	font-family: var(--x-sans);
	color: var(--x-ink);
}
.stk-nl *, .stk-inq-box * { box-sizing: border-box; }
.stk-vh { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Newsletter */
.stk-nl { display: grid; gap: 20px; max-width: 640px; }
.stk-nl-msg, .stk-nl:not(.is-compact) .stk-nl-form { display: grid; gap: 12px; padding: clamp(20px, 4vw, 30px); border-radius: 24px; background: var(--x-sand); }
.stk-nl-msg.is-ok { background: #e8f3ec; }
.stk-nl-msg h2, .stk-nl-title { margin: 0; font-family: var(--x-serif); font-weight: 600; font-size: 2rem; line-height: 1.1; }
.stk-nl-msg p, .stk-nl-form p { margin: 0; }
.stk-nl-gift { font-weight: 600; }
.stk-nl-code { justify-self: start; padding: 10px 18px; border: 2px dashed var(--x-rose-deep); border-radius: 14px; background: #fff; font-size: 1.75rem !important; font-weight: 800; letter-spacing: .08em; }
.stk-nl-field { display: grid; gap: 6px; flex: 1; min-width: 0; font-weight: 700; font-size: .9375rem; }
.stk-nl-field small { font-weight: 500; color: var(--x-muted); }
.stk-nl-field input { width: 100%; min-height: 50px; padding: 0 14px; border: 1px solid var(--x-line); border-radius: 14px; background: #fff; color: var(--x-ink); font: inherit; font-weight: 400; font-size: 16px; }
.stk-nl-field input:focus { outline: 2px solid var(--x-ink); outline-offset: 1px; }
.stk-nl-row { display: flex; gap: 8px; align-items: flex-end; }
.stk-nl-btn { display: inline-flex; align-items: center; justify-content: center; flex: none; min-height: 50px; padding: 0 22px; border: 0; border-radius: 99px; background: var(--x-ink); color: #fff !important; font: inherit; font-weight: 700; text-decoration: none !important; cursor: pointer; }
.stk-nl-btn:hover { background: color-mix(in oklab, var(--x-ink) 85%, #fff); }
.stk-nl-btn:focus-visible { outline: 2px solid var(--x-rose-deep); outline-offset: 3px; }
.stk-nl-consent { display: flex; gap: 10px; align-items: flex-start; font-size: .8125rem; line-height: 1.45; color: var(--x-muted); cursor: pointer; }
.stk-nl-consent input { flex: none; width: 18px; height: 18px; margin: 1px 0 0; accent-color: var(--x-ink); }
.stk-nl-consent a { color: inherit; }
.stk-nl-hp, .stk-inq-hp { position: absolute !important; left: -9999px; }
@media (max-width: 480px) { .stk-nl:not(.is-compact) .stk-nl-row { flex-direction: column; align-items: stretch; } }

/* Compact variant (footer, dark background) */
.stk-nl.is-compact { color: inherit; max-width: 360px; }
.stk-nl.is-compact .stk-nl-form { display: grid; gap: 10px; }
.stk-nl-h { margin: 0; font-weight: 700; }
.stk-nl-sub { margin: 0; opacity: .8; font-size: .9375rem; }
.stk-nl.is-compact .stk-nl-field input { min-height: 46px; border-color: color-mix(in oklab, currentColor 25%, transparent); background: transparent; color: inherit; }
.stk-nl.is-compact .stk-nl-field input::placeholder { color: inherit; opacity: .55; }
.stk-nl.is-compact .stk-nl-field input:focus { outline-color: currentColor; }
.stk-nl.is-compact .stk-nl-btn { min-height: 46px; padding: 0 18px; background: var(--wp--preset--color--rose, #d9a38f); color: var(--x-ink) !important; }
.stk-nl.is-compact .stk-nl-consent { color: inherit; opacity: .75; }

/* Course inquiry */
.stk-inq-box { display: grid; gap: 16px; margin-top: 2rem; padding: clamp(20px, 4vw, 32px); border-radius: 24px; background: var(--x-sand); scroll-margin-top: 100px; }
.stk-inq-box.is-ok { background: #e8f3ec; }
.stk-inq-box h2 { margin: 0; font-family: var(--x-serif); font-weight: 600; font-size: 2rem; line-height: 1.1; }
.stk-inq-box p { margin: 0; }
.stk-inq-err { padding: 10px 14px; border-radius: 12px; background: #fbe6e0; color: #8a3b24; font-weight: 600; }
.stk-inq-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); gap: 14px; }
.stk-inq-field { display: grid; gap: 6px; font-weight: 700; font-size: .9375rem; }
.stk-inq-field small { font-weight: 500; color: var(--x-muted); }
.stk-inq-field input, .stk-inq-field textarea { width: 100%; min-height: 50px; padding: 12px 14px; border: 1px solid var(--x-line); border-radius: 14px; background: #fff; color: var(--x-ink); font: inherit; font-weight: 400; font-size: 16px; }
.stk-inq-field textarea { resize: vertical; line-height: 1.5; }
.stk-inq-field input:focus, .stk-inq-field textarea:focus { outline: 2px solid var(--x-ink); outline-offset: 1px; }
.stk-inq-level { display: grid; gap: 8px; margin: 0; padding: 0; border: 0; }
.stk-inq-level legend { margin-bottom: 6px; padding: 0; font-weight: 700; font-size: .9375rem; }
.stk-inq-level label { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border: 1px solid var(--x-line); border-radius: 14px; background: #fff; cursor: pointer; }
.stk-inq-level label:has(input:checked) { border-color: var(--x-ink); box-shadow: inset 0 0 0 1px var(--x-ink); }
.stk-inq-level input { width: 18px; height: 18px; margin: 0; accent-color: var(--x-ink); }
.stk-inq-consent { display: flex; gap: 10px; align-items: flex-start; font-size: .875rem; line-height: 1.45; color: var(--x-muted); cursor: pointer; }
.stk-inq-consent input { flex: none; width: 18px; height: 18px; margin: 1px 0 0; accent-color: var(--x-ink); }
.stk-inq-consent a { color: var(--x-ink); }
.stk-inq-btn { justify-self: start; min-height: 54px; padding: 0 28px; border: 0; border-radius: 99px; background: var(--x-ink); color: #fff; font: inherit; font-weight: 700; cursor: pointer; }
.stk-inq-btn:hover { background: color-mix(in oklab, var(--x-ink) 85%, #fff); }
.stk-inq-btn:focus-visible { outline: 2px solid var(--x-rose-deep); outline-offset: 3px; }

/* Course inquiry: participant / model switch */
.stk-inq-type { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: 10px; margin: 0; padding: 0; border: 0; }
.stk-inq-type label { display: flex; gap: 12px; align-items: flex-start; padding: 14px 16px; border: 1px solid var(--x-line); border-radius: 16px; background: #fff; cursor: pointer; }
.stk-inq-type label:has(input:checked) { border-color: var(--x-ink); box-shadow: inset 0 0 0 1px var(--x-ink); }
.stk-inq-type input { flex: none; width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--x-ink); }
.stk-inq-type span { display: grid; gap: 2px; }
.stk-inq-type b { font-size: .9688rem; line-height: 1.3; }
.stk-inq-type small { color: var(--x-muted); font-size: .8438rem; line-height: 1.4; }
.stk-inq-model-hint { display: none; padding: 10px 14px; border-radius: 12px; background: #fff; font-size: .9375rem; }
.stk-inq-form:has(input[name="type"][value="model"]:checked) .stk-inq-level { display: none; }
.stk-inq-form:has(input[name="type"][value="model"]:checked) .stk-inq-model-hint { display: block; }
.stk-inq-small { margin-top: -6px !important; font-size: .8438rem; color: var(--x-muted); }