/* Second Eye Website v1.21.1 — QA-113 mobile hero simplification */
/* Supersedes only the v1.21 hero composition. No portal or Supabase changes. */

.hero-art-v1211{
  width:100%;
  max-width:440px;
  justify-self:start;
}
.hero-record-v1211{
  position:relative;
  overflow:hidden;
  padding:22px;
  border:1px solid rgba(117,129,156,.18);
  border-radius:24px;
  background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(248,251,255,.9));
  box-shadow:0 20px 48px rgba(34,48,79,.08),inset 0 1px 0 rgba(255,255,255,.95);
}
.hero-record-v1211::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(56% 86% at 0% 0%,rgba(113,91,232,.08),transparent 72%),
    radial-gradient(55% 78% at 100% 100%,rgba(35,183,165,.09),transparent 72%);
}
.hero-record-head-v1211{
  position:relative;z-index:1;display:flex;align-items:center;gap:13px;
  padding-bottom:18px;border-bottom:1px solid var(--line-1);
}
.hero-record-icon-v1211{
  width:46px;height:46px;flex:0 0 46px;border-radius:15px;display:grid;place-items:center;
  color:var(--teal-700);background:linear-gradient(145deg,rgba(35,183,165,.10),rgba(113,91,232,.07));
  border:1px solid rgba(35,183,165,.13);
}
.hero-record-icon-v1211 .icon{width:23px;height:23px}
.hero-record-head-v1211>div{display:flex;flex-direction:column;gap:3px;min-width:0}
.hero-record-label-v1211{font-size:.72rem;font-weight:850;color:var(--teal-700)}
.hero-record-head-v1211 strong{font-size:1rem;color:var(--text);line-height:1.4}
.hero-record-status-v1211{
  position:relative;z-index:1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin-top:17px;
}
.hero-record-state-v1211{
  min-width:0;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:7px;
  padding:11px 10px;border:1px solid rgba(35,183,165,.13);border-radius:13px;background:rgba(250,254,253,.9);
}
.hero-record-state-icon-v1211{width:28px;height:28px;border-radius:9px;display:grid;place-items:center;color:var(--teal-700);background:#fff}
.hero-record-state-icon-v1211 .icon{width:16px;height:16px}
.hero-record-state-v1211 b{min-width:0;font-size:.69rem;line-height:1.35;color:var(--text-2)}
.hero-record-state-v1211 i{font-style:normal;font-size:.78rem;color:var(--teal-700);font-weight:950}

/* The approved hero has no in-hero CTA. The header remains the sole first-screen assessment action. */
.hero-v121 .hero-actions-v121{display:none!important}

html[dir="ltr"] body.lang-en .hero-art-v1211{justify-self:end}
html[dir="ltr"] body.lang-en .hero-record-state-v1211 b{font-size:.64rem;letter-spacing:-.01em}

@media(max-width:900px){
  /* Explicit source-order rendering: message first, visual second on phones/tablets. */
  .hero-in-v121,
  html[dir="ltr"] body.lang-en .hero-v121 .hero-in-v121{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    gap:24px!important;
    padding-block:34px 28px!important;
  }
  .hero-copy-v121{order:1!important;width:100%}
  .hero-art-v1211,
  html[dir="ltr"] body.lang-en .hero-art-v1211{
    order:2!important;
    width:100%;max-width:560px;margin-inline:auto;justify-self:auto;
  }
  .hero-trust-v121{order:3}
}

@media(max-width:700px){
  .hero-v121 .eyebrow{margin-bottom:12px!important}
  .hero-title-v121{
    margin-bottom:14px!important;
    font-size:clamp(1.9rem,8.7vw,2.45rem)!important;
    line-height:1.08!important;
    max-width:17ch!important;
  }
  .hero-lede-v121{font-size:.94rem!important;line-height:1.68!important;margin-bottom:0}
  .hero-services-grid-v121{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:7px!important;margin-top:17px!important;
  }
  .hero-service-v121{
    min-height:48px!important;padding:7px 9px!important;border-radius:12px!important;
    background:rgba(255,255,255,.68)!important;box-shadow:none!important;font-size:.71rem!important;
  }
  .hero-service-icon-v121{width:29px!important;height:29px!important;flex-basis:29px!important;border-radius:9px!important}
  .hero-service-icon-v121 .icon{width:17px!important;height:17px!important}
  .hero-services-grid-v121 .hero-service-v121:last-child{grid-column:1/-1;width:calc(50% - 3.5px);justify-self:center}

  .hero-art-v1211{max-width:none!important}
  .hero-record-v1211{padding:16px;border-radius:18px;box-shadow:0 13px 30px rgba(34,48,79,.065)}
  .hero-record-head-v1211{gap:10px;padding-bottom:13px}
  .hero-record-icon-v1211{width:38px;height:38px;flex-basis:38px;border-radius:12px}.hero-record-icon-v1211 .icon{width:20px;height:20px}
  .hero-record-label-v1211{font-size:.64rem}.hero-record-head-v1211 strong{font-size:.87rem}
  .hero-record-status-v1211{gap:6px;margin-top:12px}
  .hero-record-state-v1211{grid-template-columns:1fr auto;grid-template-areas:"label check";padding:9px 7px;gap:4px;text-align:center;justify-items:center}
  .hero-record-state-icon-v1211{display:none}
  .hero-record-state-v1211 b{grid-area:label;font-size:.61rem;line-height:1.3}
  .hero-record-state-v1211 i{grid-area:check;font-size:.72rem}

  html[dir="ltr"] body.lang-en .hero-v121 .hero-title-v121{
    font-size:clamp(1.72rem,7.8vw,2.05rem)!important;line-height:1.06!important;max-width:19ch!important;
  }
  html[dir="ltr"] body.lang-en .hero-service-v121{font-size:.65rem!important}
  html[dir="ltr"] body.lang-en .hero-record-state-v1211 b{font-size:.56rem}
}

@media(max-width:390px){
  .hero-in-v121,html[dir="ltr"] body.lang-en .hero-v121 .hero-in-v121{padding-block:28px 24px!important;gap:20px!important}
  .hero-title-v121{font-size:1.86rem!important}
  .hero-service-v121{font-size:.68rem!important;padding-inline:7px!important}
  .hero-record-v1211{padding:14px}
  .hero-record-state-v1211{padding:8px 5px}.hero-record-state-v1211 b{font-size:.56rem}
  html[dir="ltr"] body.lang-en .hero-v121 .hero-title-v121{font-size:1.68rem!important}
  html[dir="ltr"] body.lang-en .hero-record-state-v1211 b{font-size:.52rem}
}