/* Contact form (block inntek/contact-form). Rules from prototype/index.html lines 415-435. */

@layer inntek {
	.inntek-form-card{background:var(--inntek-bg);border:1px solid var(--inntek-line);border-radius:var(--inntek-r-xl);padding:clamp(24px,3.4vw,40px);box-shadow:var(--inntek-shadow)}
	form.inntek-form{display:grid;grid-template-columns:1fr 1fr;gap:18px}
	.inntek-field{display:grid;gap:6px;align-content:start}
	.inntek-field.inntek-field--full{grid-column:1/-1}
	/* Focused fields (first error, keyboard) stay clear of the sticky header, label included. */
	.inntek-field :is(input,select,textarea){scroll-margin-top:140px}
	.inntek-field label{font-size:14.5px;font-weight:600;color:var(--inntek-ink)}
	.inntek-field label .inntek-field__required{color:var(--inntek-err)}
	.inntek-field input,.inntek-field select,.inntek-field textarea{font:inherit;font-size:16px;color:var(--inntek-ink);background-color:var(--inntek-bg);border:1.5px solid var(--inntek-line-strong);border-radius:var(--inntek-r-sm);padding:12px 14px;transition:border-color .15s ease-out,box-shadow .15s ease-out;width:100%}
	.inntek-field textarea{min-height:110px;resize:vertical}
	.inntek-field input::placeholder,.inntek-field textarea::placeholder{color:var(--inntek-muted)}
	.inntek-field input:focus,.inntek-field select:focus,.inntek-field textarea:focus{outline:none;border-color:var(--inntek-brand);box-shadow:0 0 0 4px color-mix(in srgb, var(--inntek-brand) 16%, transparent)}
	.inntek-field .inntek-field__error{font-size:13.5px;color:var(--inntek-err)}
	.inntek-field input[aria-invalid="true"]{border-color:var(--inntek-err)}
	.inntek-form .inntek-form__help{font-size:13.5px;color:var(--inntek-muted)}
	.inntek-form .inntek-form__actions{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:16px}
	.inntek-form__success{display:grid;gap:10px;justify-items:start}
	.inntek-form__success .inntek-icon{font-size:40px;color:var(--inntek-ok);font-variation-settings:"FILL" 1,"wght" 400,"opsz" 40;max-width:none}
	.inntek-form__success h3{font-size:22px}
	@media (max-width:560px){form.inntek-form{grid-template-columns:1fr}}
	.inntek-field select[aria-invalid="true"],.inntek-field textarea[aria-invalid="true"]{border-color:var(--inntek-err)}
	.inntek-field .inntek-field__error:empty{display:none}
	.inntek-form button[type="submit"][aria-busy="true"]{opacity:.7;cursor:progress}
	/* Honeypot: off screen, not display:none, so simple bots still fill it. */
	.inntek-form__trap{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}
	.inntek-form__notice{grid-column:1/-1;margin:0;padding:12px 16px;border-radius:var(--inntek-r-sm);border:1px solid var(--inntek-err);color:var(--inntek-err);background:var(--inntek-bg);font-size:14.5px}
	.inntek-form__notice:empty{display:none}
	.inntek-form__help a{color:var(--inntek-brand-strong)}
	.inntek-form-card{position:relative}
	.inntek-form__success:focus{outline:none}
	.inntek-form__success:focus-visible{outline:2px solid var(--inntek-brand);outline-offset:4px}
	/* Contact layout next to a form (home #lien-he, product #dang-ky); prototype lines 408-415. */
	.inntek-contact{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px,5vw,80px);align-items:start}
	.inntek-contact .inntek-info{display:grid;gap:16px;align-content:start}
	.inntek-contact .inntek-info :is(ul,.inntek-info__list){list-style:none;padding:0;margin:12px 0 0;display:grid;gap:14px}
	.inntek-contact .inntek-info :is(li,.inntek-info__item){display:grid;grid-template-columns:24px 1fr;gap:12px;font-size:15.5px;color:var(--inntek-ink)}
	.inntek-contact .inntek-info .inntek-icon{color:var(--inntek-brand);font-size:22px}
	.inntek-contact .inntek-info :is(li,.inntek-info__item) a{color:inherit;text-decoration:none}
	.inntek-contact .inntek-info :is(li,.inntek-info__item) a:hover,.inntek-contact .inntek-info :is(li,.inntek-info__item) a:focus-visible{color:var(--inntek-brand);text-decoration:underline}
	.inntek-copy-btn{border:1px solid var(--inntek-line);background:var(--inntek-bg);color:var(--inntek-muted);border-radius:6px;padding:2px 8px;font-size:12.5px;margin-left:8px}
	.inntek-copy-btn:hover{border-color:var(--inntek-brand);color:var(--inntek-brand)}
	@media (max-width:960px){.inntek-contact{grid-template-columns:1fr}}
}