:root {
  --qr-navy: #123444;
  --qr-navy-deep: #0a2432;
  --qr-blue: #347f9d;
  --qr-blue-dark: #295f78;
  --qr-cyan: #86cfdf;
  --qr-ice: #e5f3f7;
  --qr-cloud: #f3f8fa;
  --qr-white: #fff;
  --qr-ink: #204c62;
  --qr-muted: #577889;
  --qr-line: #d2e1e7;
  --qr-error: #b42318;
  --qr-success: #157a55;
  --qr-shadow: 0 26px 70px rgba(18, 52, 68, .16);
}

*, *::before, *::after { box-sizing: border-box; }
html { min-width: 320px; background: var(--qr-cloud); }
body.snowflake-scan-page {
  min-width: 320px;
  min-height: 100vh;
  margin: 0;
  background:
    radial-gradient(circle at 100% 0, rgba(134, 207, 223, .28), transparent 28rem),
    linear-gradient(180deg, var(--qr-navy-deep) 0 22rem, var(--qr-cloud) 22rem 100%);
  color: var(--qr-ink);
  font: 400 16px/1.55 Manrope, Aptos, "Segoe UI", Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}

body.snowflake-scan-page.admin-bar { min-height: calc(100vh - 32px); }
body.snowflake-scan-page img { max-width: 100%; height: auto; }
body.snowflake-scan-page a { color: inherit; }
body.snowflake-scan-page button,
body.snowflake-scan-page input,
body.snowflake-scan-page select,
body.snowflake-scan-page textarea { font: inherit; }

.sf-scan-skip {
  position: fixed;
  z-index: 10000;
  top: 8px;
  left: 8px;
  padding: 11px 16px;
  border-radius: 8px;
  background: #fff;
  color: var(--qr-navy-deep);
  transform: translateY(-150%);
}
.sf-scan-skip:focus { transform: none; }

.sf-scan-header {
  display: flex;
  width: min(100% - 32px, 1120px);
  min-height: 82px;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin: 0 auto;
}
.sf-scan-brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: #fff !important;
  font-weight: 800;
  line-height: 1;
  text-decoration: none;
}
.sf-scan-brand img { width: auto; max-width: 210px; max-height: 58px; filter: brightness(0) invert(1); }
.sf-scan-brand__mark { display: grid; width: 42px; height: 42px; place-items: center; border-radius: 13px; background: var(--qr-cyan); color: var(--qr-navy); font-size: 1.5rem; }
.sf-scan-brand small { display: block; margin-top: 4px; color: var(--qr-cyan); font-size: .62rem; letter-spacing: .12em; text-transform: uppercase; }
.sf-scan-header__home { color: rgba(255,255,255,.76) !important; font-size: .88rem; font-weight: 700; text-underline-offset: 4px; }
.sf-scan-header__home:hover,
.sf-scan-header__home:focus-visible { color: #fff !important; }

.sf-scan-main {
  display: grid;
  width: min(100% - 28px, 1120px);
  grid-template-columns: minmax(0, 1fr);
  gap: 30px;
  margin: 18px auto 0;
  padding-bottom: 56px;
}
.sf-scan-intro { color: rgba(255,255,255,.8); }
.sf-scan-eyebrow {
  margin: 0 0 14px;
  color: var(--qr-cyan);
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.sf-scan-intro h1,
.sf-scan-success h2 {
  margin: 0;
  font-family: "Arial Narrow", Aptos, "Segoe UI", sans-serif;
  font-weight: 800;
  letter-spacing: -.04em;
  line-height: 1.02;
}
.sf-scan-intro h1 { max-width: 720px; color: #fff; font-size: clamp(2.55rem, 11vw, 4.9rem); }
.sf-scan-intro > p:not(.sf-scan-eyebrow) { max-width: 620px; margin: 22px 0 0; font-size: clamp(1rem, 3.8vw, 1.18rem); }
.sf-scan-trust { display: flex; flex-wrap: wrap; gap: 9px 20px; margin-top: 25px; font-size: .9rem; font-weight: 650; }
.sf-scan-trust span { display: inline-flex; align-items: center; gap: 8px; }
.sf-scan-trust b { display: grid; width: 22px; height: 22px; place-items: center; border-radius: 50%; background: rgba(134,207,223,.17); color: var(--qr-cyan); font-size: .76rem; }

.sf-scan-card {
  overflow: hidden;
  padding: clamp(22px, 5vw, 42px);
  border: 1px solid rgba(210, 225, 231, .9);
  border-radius: 24px;
  background: rgba(255,255,255,.985);
  box-shadow: var(--qr-shadow);
}
.sf-scan-form { display: grid; gap: 20px; }
.sf-scan-grid { display: grid; grid-template-columns: 1fr; gap: 20px; }
.sf-scan-field { min-width: 0; }
.sf-scan-field label,
.sf-scan-channel legend {
  display: block;
  margin: 0 0 8px;
  color: var(--qr-navy);
  font-size: .83rem;
  font-weight: 800;
  letter-spacing: .025em;
}
.sf-scan-field label span,
.sf-scan-channel legend span { color: var(--qr-error); }
.sf-scan-field label small { float: right; color: #728b98; font-size: .75rem; font-weight: 600; }
.sf-scan-field input,
.sf-scan-field select,
.sf-scan-field textarea {
  display: block;
  width: 100%;
  min-height: 52px;
  padding: 13px 15px;
  border: 1px solid #bdced6;
  border-radius: 11px;
  outline: none;
  background: #fff;
  color: var(--qr-navy-deep);
  transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
.sf-scan-field textarea { min-height: 126px; resize: vertical; }
.sf-scan-field input::placeholder,
.sf-scan-field textarea::placeholder { color: #8399a4; }
.sf-scan-field input:focus,
.sf-scan-field select:focus,
.sf-scan-field textarea:focus { border-color: var(--qr-blue); box-shadow: 0 0 0 4px rgba(52,127,157,.14); }
.sf-scan-field.has-error input,
.sf-scan-field.has-error select,
.sf-scan-field.has-error textarea { border-color: var(--qr-error); background: #fff9f8; }
.sf-scan-error { min-height: 0; margin: 6px 0 0; color: var(--qr-error); font-size: .79rem; font-weight: 650; }
.sf-scan-error:empty { display: none; }
.sf-scan-counter { margin: 5px 2px 0; color: #718894; font-size: .74rem; text-align: right; }

.sf-scan-channel { min-width: 0; padding: 0; margin: 1px 0 0; border: 0; }
.sf-scan-channel__options { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.sf-scan-channel__option { position: relative; min-width: 0; cursor: pointer; }
.sf-scan-channel__option input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.sf-scan-channel__option > span {
  display: flex;
  min-height: 62px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  padding: 8px 4px;
  border: 1px solid #bdced6;
  border-radius: 12px;
  background: #fff;
  color: var(--qr-muted);
  font-size: clamp(.72rem, 3.5vw, .84rem);
  font-weight: 750;
  text-align: center;
  transition: .18s ease;
}
.sf-scan-channel__option b { color: var(--qr-blue-dark); font-size: 1.05rem; line-height: 1; }
.sf-scan-channel__option input:checked + span { border-color: var(--qr-blue); background: var(--qr-ice); color: var(--qr-navy); box-shadow: inset 0 0 0 1px var(--qr-blue); }
.sf-scan-channel__option input:checked + span::after { content: "Selected"; color: var(--qr-blue-dark); font-size: .6rem; font-weight: 850; letter-spacing: .05em; text-transform: uppercase; }
.sf-scan-channel__option input:focus-visible + span { outline: 3px solid rgba(52,127,157,.28); outline-offset: 2px; }

.sf-scan-consent { padding: 15px; border: 1px solid var(--qr-line); border-radius: 12px; background: var(--qr-cloud); }
.sf-scan-consent.has-error { border-color: var(--qr-error); background: #fff9f8; }
.sf-scan-consent label { display: grid; grid-template-columns: 22px 1fr; gap: 11px; align-items: start; color: var(--qr-ink); font-size: .86rem; cursor: pointer; }
.sf-scan-consent input { width: 20px; height: 20px; margin: 1px 0 0; accent-color: var(--qr-blue); }
.sf-scan-consent a { color: var(--qr-blue-dark); font-weight: 700; }

.sf-scan-button {
  display: inline-flex;
  width: 100%;
  min-height: 56px;
  align-items: center;
  justify-content: center;
  gap: 13px;
  padding: 14px 22px;
  border: 0;
  border-radius: 999px;
  background: linear-gradient(115deg, var(--qr-navy), var(--qr-blue));
  color: #fff !important;
  cursor: pointer;
  font-weight: 800;
  text-decoration: none;
  box-shadow: 0 14px 28px rgba(41,95,120,.22);
  transition: transform .18s ease, box-shadow .18s ease, opacity .18s ease;
}
.sf-scan-button:hover { transform: translateY(-2px); box-shadow: 0 18px 34px rgba(41,95,120,.3); }
.sf-scan-button:focus-visible { outline: 4px solid rgba(52,127,157,.28); outline-offset: 3px; }
.sf-scan-button:disabled { cursor: wait; opacity: .7; transform: none; }
.sf-scan-button--whatsapp { margin-top: 9px; background: linear-gradient(115deg, #08785c, #20b77b); }
.sf-scan-fineprint { margin: -7px 0 0; color: #718894; font-size: .74rem; text-align: center; }
.sf-scan-honeypot { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }

.sf-scan-notice { margin-bottom: 22px; padding: 13px 15px; border-radius: 10px; font-size: .88rem; font-weight: 650; }
.sf-scan-notice--error { border: 1px solid #f0b5af; background: #fff3f1; color: #8f2218; }
.sf-scan-success { padding: clamp(18px, 5vw, 42px) 0; text-align: center; }
.sf-scan-success__icon { display: grid; width: 72px; height: 72px; margin: 0 auto 24px; place-items: center; border-radius: 50%; background: #ddf5eb; color: var(--qr-success); font-size: 2rem; font-weight: 800; }
.sf-scan-success h2 { color: var(--qr-navy); font-size: clamp(2.25rem, 9vw, 3.5rem); }
.sf-scan-success > p:not(.sf-scan-eyebrow) { max-width: 460px; margin: 16px auto 0; color: var(--qr-muted); }
.sf-scan-success .sf-scan-button { max-width: 430px; margin-inline: auto; }
.sf-scan-return { display: inline-block; margin-top: 25px; color: var(--qr-blue-dark) !important; font-size: .88rem; font-weight: 750; text-underline-offset: 4px; }

.sf-scan-footer { display: flex; width: min(100% - 32px, 1120px); flex-wrap: wrap; justify-content: space-between; gap: 8px 20px; margin: 0 auto; padding: 0 0 28px; color: #6f8794; font-size: .78rem; }
.sf-scan-footer p { margin: 0; }

@media (min-width: 560px) {
  .sf-scan-main { width: min(100% - 48px, 1120px); }
  .sf-scan-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sf-scan-channel__options { gap: 12px; }
  .sf-scan-channel__option > span { min-height: 72px; font-size: .86rem; }
}

@media (min-width: 900px) {
  body.snowflake-scan-page { background: radial-gradient(circle at 18% 16%, rgba(134,207,223,.2), transparent 24rem), linear-gradient(100deg, var(--qr-navy-deep) 0 46%, var(--qr-cloud) 46% 100%); }
  .sf-scan-header { min-height: 96px; }
  .sf-scan-main { grid-template-columns: minmax(0, .82fr) minmax(560px, 1fr); gap: clamp(48px, 7vw, 100px); align-items: start; margin-top: 46px; }
  .sf-scan-intro { position: sticky; top: 60px; padding: 28px 0 60px; }
  .sf-scan-intro h1 { font-size: clamp(3.8rem, 6vw, 5.8rem); }
  .sf-scan-card { border-radius: 30px; }
  .sf-scan-footer { padding-top: 8px; }
}

@media (max-width: 782px) {
  body.admin-bar.snowflake-scan-page { padding-top: 46px; }
  body.admin-bar.snowflake-scan-page #wpadminbar { position: fixed; }
}

@media (max-width: 380px) {
  .sf-scan-header { width: calc(100% - 24px); }
  .sf-scan-brand img { max-width: 165px; }
  .sf-scan-header__home { font-size: .72rem; }
  .sf-scan-main { width: calc(100% - 20px); gap: 23px; }
  .sf-scan-card { padding: 19px 15px; border-radius: 18px; }
  .sf-scan-channel__option > span { padding-inline: 2px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; }
}
