:root { --brand:#1F5F66; --brand2:#17494F; --accent:#E76F51; --ax:#3D5A98; --k:#E39A2D; --l:#2A9D8F; --bg:#F7F4EE; --card:#fff; --line:#E5DACB; --muted:#5b6670; }
* { box-sizing: border-box; }
body { margin:0; font-family: Inter, "Noto Sans", Arial, sans-serif; background: var(--bg); color:#1f2933; font-size:15px; }
a { color: var(--brand); }
.topbar { display:flex; justify-content:space-between; align-items:center; padding:10px 22px; background: linear-gradient(90deg, var(--brand2), var(--brand)); color:#fff; }
.brand { font-weight:700; font-size:18px; letter-spacing:.2px; }
.logo { color:#FFD8C9; }
.proto[hidden] { display: none !important; }
.proto { font-size:10px; background: var(--accent); color:#fff; border-radius:8px; padding:2px 7px; margin-left:6px; vertical-align:2px; }
nav a { color:#fff; margin-left:16px; text-decoration:none; font-weight:600; font-size:14px; opacity:.9; }
nav a.active, nav a:hover { opacity:1; border-bottom:2px solid #FFD8C9; }
nav .who { font-size:12px; opacity:.8; margin-left:16px; }
.demo { background:#B03A2E; color:#fff; text-align:center; font-size:13.5px; padding:7px 10px; border-bottom:3px solid #7d241c; }
.waitbox { max-width:640px; margin:30px auto; text-align:center; } .waitbox .big { font-size:46px; } .waitbox h1 { margin-top:4px; }
main { max-width:1180px; margin:22px auto; padding:0 18px; min-height:70vh; }
.card { background:var(--card); border:1px solid var(--line); border-radius:14px; padding:18px 20px; margin-bottom:16px; box-shadow:0 1px 2px rgba(0,0,0,.03); }
h1 { color: var(--brand2); font-size:24px; margin:4px 0 12px; }
h2 { font-size:16px; color: var(--brand2); margin:0 0 10px; border-left:5px solid var(--accent); padding-left:8px; }
h3 { font-size:14px; margin:6px 0 8px; color:#8A3A1F; }
.muted { color: var(--muted); font-size:13px; }
.grid { display:grid; gap:10px 14px; }
.g2 { grid-template-columns: repeat(2, 1fr); } .g3 { grid-template-columns: repeat(3, 1fr); } .g4 { grid-template-columns: repeat(4, 1fr); } .g6 { grid-template-columns: repeat(6, 1fr); }
label { display:block; font-size:12px; font-weight:600; color:#3d4852; }
label .u { font-weight:400; color: var(--muted); }
input, select { width:100%; padding:7px 9px; border:1px solid #cfc6b8; border-radius:8px; font-size:14px; background:#fff; margin-top:3px; }
input:focus, select:focus { outline:2px solid #9fd1cb; border-color: var(--brand); }
input.err { border-color:#c0392b; background:#fff5f4; }
.btn { display:inline-block; background: var(--brand); color:#fff; border:0; border-radius:10px; padding:10px 18px; font-weight:700; font-size:14px; cursor:pointer; text-decoration:none; }
.btn:hover { background: var(--brand2); }
.btn.alt { background:#fff; color: var(--brand); border:1.5px solid var(--brand); }
.btn.warn { background:#B03A2E; } .btn.small { padding:5px 10px; font-size:12px; border-radius:8px; }
.btn:disabled { opacity:.5; cursor:not-allowed; }
.row { display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.eyes { display:grid; grid-template-columns: 1fr 1fr; gap:16px; }
.eyebox { border:1px solid var(--line); border-radius:12px; padding:12px 14px; background:#FFFCF8; }
.eyebox.off { opacity:.45; }
.eyebox h3 { display:flex; justify-content:space-between; align-items:center; }
.eyebox h3 label { font-size:12px; display:flex; align-items:center; gap:6px; color:#3d4852; }
.eyebox h3 input { width:auto; margin:0; }
.sub { font-size:11px; font-weight:700; color: var(--brand); text-transform:uppercase; letter-spacing:.5px; margin:10px 0 4px; }
.local { border:2px dashed #C98A00; background:#FFFBEF; border-radius:12px; padding:12px 14px; }
.local b.tag { background:#C98A00; color:#fff; padding:1px 7px; border-radius:8px; font-size:11px; }
.anon { border-left:5px solid var(--l); background:#EEF8F6; padding:10px 14px; border-radius:10px; font-size:13px; margin-bottom:14px; }
.msg { padding:10px 14px; border-radius:10px; margin:10px 0; font-size:14px; }
.msg.ok { background:#E3F4E8; color:#23743D; } .msg.err { background:#FBE1DE; color:#B03A2E; } .msg.info { background:#E8EEFB; color:#2F5AA8; }
.pill { display:inline-block; padding:2px 9px; border-radius:10px; font-size:12px; font-weight:700; }
.pill.ax { background:#DCE3F3; color: var(--ax); } .pill.k { background:#FCEBCF; color:#8a5a0f; } .pill.l { background:#D5EFEC; color:#1d6e64; } .pill.none { background:#eee; color:#555; }
.pill.active { background:#E3F4E8; color:#23743D; } .pill.disabled { background:#FBE1DE; color:#B03A2E; }
.stack { height:14px; display:flex; border-radius:7px; overflow:hidden; border:1px solid #ccc; margin:6px 0; }
.stack span { display:block; height:100%; }
.tiles { display:grid; grid-template-columns: repeat(5, 1fr); gap:12px; margin-bottom:16px; }
.tile { background:#fff; border:1px solid var(--line); border-radius:12px; padding:12px 14px; border-top:4px solid var(--brand); }
.tile .n { font-size:26px; font-weight:800; color: var(--brand2); } .tile .t { font-size:12px; color: var(--muted); }
table.t { width:100%; border-collapse:collapse; font-size:13px; }
table.t th { text-align:left; background:#F1F8F7; color: var(--brand2); border-bottom:2px solid var(--brand); padding:6px 8px; }
table.t td { border-bottom:1px solid #eee5d8; padding:6px 8px; vertical-align:middle; }
.summary { display:grid; grid-template-columns: 1fr 1fr; gap:16px; }
.reportwrap { background:#fff; border:1px solid var(--line); border-radius:12px; padding:14mm 12mm; margin-top:12px; box-shadow: 0 4px 20px rgba(0,0,0,.06); }
.terms { max-width:820px; line-height:1.55; font-size:14px; }
.legal { background:#FBE1DE; color:#8a2a20; font-weight:700; padding:6px 10px; border-radius:8px; display:inline-block; }
.sitefoot { text-align:center; font-size:12px; color: var(--muted); padding:18px; }
.chk { display:flex; gap:10px; align-items:flex-start; font-weight:400; font-size:13px; } .chk input { width:auto; margin-top:3px; }
.demolink { word-break:break-all; font-family: monospace; font-size:12px; background:#fff; padding:8px; border-radius:8px; border:1px solid #ddd; }
@media print {
  @page { size: A4; margin: 9mm 11mm 8mm 11mm; }
  body { background:#fff; }
  .no-print, .topbar, .sitefoot, .demo, main > *:not(#printRoot) { display:none !important; }
  main { margin:0; padding:0; max-width:none; }
  #printRoot { display:block !important; }
  #printRoot .reportwrap { border:0; padding:0; margin:0; box-shadow:none; }
}

/* v2 result screen */
.reprow { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin:8px 0; }
.reprow b { min-width:140px; }
.fu { margin-top:8px; padding-top:6px; border-top:1px dashed var(--line); }
.fu .grade { font-weight:700; }
.fu .early { font-weight:700; color:#8A5A00; white-space:nowrap; }   /* 31 Oct 2026: graded period under 6 months */
.anon { margin:10px 0; }
.sitefoot .copyright { margin-top:4px; font-size:11px; color:#6b7280; }

/* parent voice note */
.vtext { white-space:pre-wrap; font-family: "Noto Sans", Inter, Arial, sans-serif; font-size:13.5px; line-height:1.55; background:#FFFCF8; border:1px solid var(--line); border-radius:10px; padding:10px 12px; max-height:340px; overflow:auto; }
#vTx .chk { margin:0; }

/* 30 Oct 2026: on-screen colour bar with hover / tap pop-ups, and reference pop-ups */
.cbar { position:relative; margin:10px 0 6px; padding-top:2px; }
.cbsub { font-size:13px; font-weight:700; color:var(--brand2); margin-bottom:4px; }
.cbsub .cbhint { display:block; font-size:11.5px; font-weight:400; margin-top:1px; }   /* fix2: hint on its own line */
.cbmrow { position:relative; height:17px; margin-bottom:3px; }                          /* fix2: own row for the "this eye" label */
.cbtrack { position:relative; height:16px; border:1px solid #b9b9b9; border-radius:5px; overflow:visible; background:#eee; }
.cbtrack .seg { position:absolute; top:0; bottom:0; cursor:pointer; outline:none; }
.cbtrack .seg:hover, .cbtrack .seg:focus { box-shadow: inset 0 0 0 2px rgba(31,95,102,.55); }
.cbtrack .cbp50 { position:absolute; top:-2px; bottom:-5px; border-left:1.5px dashed #4b5563; pointer-events:none; }
.cbtrack .cbeye { position:absolute; top:-4px; bottom:-2px; border-left:3px solid var(--ax); margin-left:-1.5px; pointer-events:none; }
.cbmark { position:absolute; top:0; font-size:12px; line-height:17px; font-weight:700; color:var(--ax); white-space:nowrap; pointer-events:none; }
.cbaxis { position:relative; display:flex; justify-content:space-between; font-size:11.5px; color:#4b5563; margin-top:3px; height:16px; }
.cbaxis .u { position:absolute; transform:translateX(-50%); font-weight:700; white-space:nowrap; }
.cbkey { display:flex; flex-wrap:wrap; justify-content:center; gap:4px 12px; font-size:11.5px; color:#4b5563; margin-top:4px; }
.cbkey span { display:flex; flex-direction:column; align-items:center; line-height:1.3; }
.cbkey em { font-style:normal; } .cbkey b { color:#1f2933; } .cbkey small { font-size:10.5px; }
i.sw { display:inline-block; width:12px; height:9px; border:1px solid #9aa0a6; border-radius:2px; margin-right:4px; vertical-align:-1px; }
.refv { border-bottom:1px dotted #8aa; cursor:help; outline:none; }
.refv:focus { background:#EEF8F6; }
sup.rn { font-size:9px; color:var(--brand); margin-left:1px; }
.tip { position:absolute; z-index:1000; max-width:360px; background:#17494F; color:#fff; border-radius:10px; padding:9px 12px; font-size:12.5px; line-height:1.45; box-shadow:0 6px 18px rgba(0,0,0,.22); }
.tip .ttitle { font-weight:700; margin-bottom:3px; } .tip .muted { color:#cfe3e1; font-size:11.5px; }
.tip .tref { margin-top:3px; border-top:1px solid rgba(255,255,255,.15); padding-top:3px; }
.tip i.sw { border-color:#fff; }
.outl { margin-top:8px; font-size:13px; color:#3d4852; background:#F6F1FA; border-radius:8px; padding:6px 9px; }
/* 30 Oct 2026: long-term eye-health table */
#riskCard { overflow-x:auto; } #riskCard table.rk { table-layout:fixed; }
#riskCard table.rk th:first-child { width:24%; } #riskCard table.rk th:nth-child(2), #riskCard table.rk th:nth-child(3) { width:19%; }
#riskCard table.rk td, #riskCard table.rk th { overflow-wrap:anywhere; }
#riskCard table.rk td:nth-child(2), #riskCard table.rk td:nth-child(3) { color:#1D5B3C; }
#riskCard table.rk tr.ql td { font-style:italic; color:#374151; } #riskCard table.rk tr.ql td:first-child { font-style:normal; }
#riskCard table.rk td.muted { font-size:12px; }
@media (max-width: 760px) { #riskCard table.rk td.muted, #riskCard table.rk th:last-child { display:none; } #riskCard table.rk th:first-child { width:40%; } #riskCard table.rk th:nth-child(2), #riskCard table.rk th:nth-child(3) { width:30%; } }
/* 30 Oct 2026: upload a report (PDF / photo) to fill the form; review highlights, preview, confirm gate */
#rptCard .rpnote { background:#EEF6F4; border:1px solid #BFDCD6; border-radius:10px; padding:8px 12px; font-size:13px; margin:6px 0 10px; }
.vh { position:absolute !important; width:1px; height:1px; opacity:0; overflow:hidden; clip:rect(0 0 0 0); }
#rptCard label.btn { margin:0; }
.camonly { display:none !important; }
@media (pointer: coarse) { .camonly { display:inline-block !important; } }
.rpflags { margin:8px 0; padding-left:20px; font-size:13px; } .rpflags li { margin:3px 0; } .rpflags li.err { color:#B03A2E; font-weight:700; } .rpflags li.warn { color:#8A5A00; } .rpflags li.info { color:var(--muted); }
input.fromrpt, select.fromrpt { background:#FFF4B8 !important; border-color:#E0B800 !important; box-shadow:0 0 0 2px #FFE36E66; }
input.fromrpt.rflag { background:#FFE0D9 !important; border-color:#D9534F !important; }
input.rmiss, select.rmiss { border:2px dashed #D9534F !important; }
.rtag { display:inline-block; margin-top:3px; font-size:10.5px; font-weight:700; color:#6B5600; background:#FFF4B8; border:1px solid #E0B800; border-radius:8px; padding:1px 6px; white-space:nowrap; cursor:help; }
.rtag.bad { color:#8E2B22; background:#FFE0D9; border-color:#D9534F; } .rtag.miss { color:#8E2B22; background:#fff; border:1px dashed #D9534F; }
.rtag-demo { background:#FFF4B8; border:1px solid #E0B800; border-radius:4px; padding:0 4px; }
.cdot { display:inline-block; width:8px; height:8px; border-radius:50%; margin:0 3px 0 4px; vertical-align:baseline; }
.cdot.high { background:#2A9D8F; } .cdot.medium { background:#E39A2D; } .cdot.low { background:#D9534F; }
.rpgate { border:2px solid #E0B800; background:#FFFCEB; } .rpgate.done { border-color:#2A9D8F; background:#F1FAF8; }
.fwrap.with-preview { display:grid; grid-template-columns:minmax(0,1fr) 440px; gap:16px; align-items:start; }
main:has(.fwrap.with-preview) { max-width:1560px; }
.rpview { position:sticky; top:8px; max-height:calc(100vh - 16px); overflow:auto; background:#fff; border:1px solid var(--line); border-radius:14px; padding:10px; }
.rpview .rphead { display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-bottom:6px; font-size:13px; }
.rpview .rphead button { margin-left:auto; }
.rppage { margin:0 0 10px; } .rppage figcaption { font-size:12px; color:var(--muted); margin-bottom:3px; display:flex; gap:6px; align-items:center; flex-wrap:wrap; }
.rppage canvas, .rppage img { display:block; width:100%; height:auto; border:1px solid #ddd; }
.rpview.zoom .rppage canvas, .rpview.zoom .rppage img { width:200%; max-width:none; }
@media (max-width: 1199px) {
  .fwrap.with-preview { display:flex; flex-direction:column; gap:0; }
  .fwrap.with-preview .rpview { order:-1; top:0; z-index:5; max-height:42vh; margin-bottom:12px; box-shadow:0 4px 12px #0002; }
  .fwrap.with-preview .fmain { width:100%; }
}
.fwrap .grid > label, .fwrap .eyes > .eyebox { min-width:0; }
.fwrap .grid > label input, .fwrap .grid > label select { max-width:100%; }
.rtag { white-space:normal; max-width:100%; }
#rptGateMsg .rxneed { color:#B03A2E; }   /* fix2: refraction missing */
/* 31 Oct 2026: typed case ID with suggestions; several treatments per visit (checkboxes); case search on 'My cases' */
.casefield { position:relative; min-width:0; }
.casefield > label { margin:0; }
#caseId, #caseFilter { text-transform:uppercase; font-family:ui-monospace, Menlo, Consolas, monospace; letter-spacing:.5px; }
#caseId::placeholder, #caseFilter::placeholder { text-transform:none; font-family:inherit; letter-spacing:0; }
#caseId.err { border-color:#c0392b; background:#fff5f4; }
.casesug { position:absolute; left:0; right:0; z-index:20; background:#fff; border:1px solid #cfc6b8; border-radius:8px; box-shadow:0 6px 18px rgba(0,0,0,.12); max-height:260px; overflow:auto; margin-top:2px; }
.casesug .sugitem { padding:7px 10px; font-size:13px; cursor:pointer; border-bottom:1px solid #f0ebe3; }
.casesug .sugitem:last-child { border-bottom:0; }
.casesug .sugitem b { font-family:ui-monospace, Menlo, Consolas, monospace; margin-right:6px; }
.casesug .sugitem:hover, .casesug .sugitem.act { background:#E7F3F1; }
.casesug .sugnone { padding:7px 10px; }
.caseinfo { font-size:12px; margin-top:3px; min-height:16px; }
.caseinfo.good { color:#23743D; } .caseinfo.bad { color:#B03A2E; }
.txset { border:1px solid var(--line); border-radius:10px; padding:6px 12px 8px; margin:0; min-width:0; }
.txset.err { border-color:#c0392b; background:#fff5f4; }
.txset legend { font-size:12px; font-weight:600; color:#3d4852; padding:0 4px; }
.txgrid { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:4px 14px; }
.txgrid .chk { margin:2px 0; font-size:13px; }
.txnote { font-size:12px; min-height:15px; margin-top:2px; color:#5E4590; }
.casefilter { max-width:420px; margin-bottom:6px; }
@media (max-width: 900px) { .txgrid { grid-template-columns:repeat(2, minmax(0, 1fr)); } }
/* 31 Oct 2026: 'Add earlier visits' (several old visits at once) */
.bnote { margin:-6px 0 14px; font-size:13px; color:var(--muted); }
.brow { padding:14px 16px; }
.brow.berr { border:2px solid #c0392b; background:#fffafa; }
.browhead { display:flex; justify-content:space-between; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:8px; }
.browhead h3 { margin:0; font-size:15px; color:var(--brand2); }
.browhead .row { display:flex; gap:8px; align-items:center; }
.browhead label.btn { margin:0; }
.bsorted { font-weight:400; font-size:12px; }
.bgrid { grid-template-columns: minmax(150px,1.7fr) repeat(3, minmax(64px,.8fr)) minmax(100px,1.1fr) minmax(150px,1.9fr); }
.bgrid > label { min-width:0; }
.btxset { margin-top:8px; }
.btwrap { overflow-x:auto; margin-top:8px; -webkit-overflow-scrolling:touch; }
table.btable { border-collapse:collapse; width:100%; min-width:940px; table-layout:fixed; font-size:12px; }
table.btable th { font-weight:600; color:var(--brand2); background:#F1F8F7; padding:4px 3px; text-align:center; line-height:1.15; border-bottom:2px solid var(--brand); }
table.btable thead th:first-child, table.btable tbody th { width:52px; }
table.btable tbody th { background:#FFFCF8; font-size:11.5px; border-bottom:1px solid #eee5d8; }
table.btable td { padding:3px 2px; border-bottom:1px solid #eee5d8; }
table.btable td input, table.btable td select { margin:0; padding:5px 4px; font-size:13px; text-align:right; min-width:0; }
table.btable td select { text-align:left; padding:5px 2px; }
table.btable input::-webkit-outer-spin-button, table.btable input::-webkit-inner-spin-button { -webkit-appearance:none; margin:0; }
table.btable input[type=number] { -moz-appearance:textfield; }
.bmsg .msg { margin:8px 0 0; font-size:13px; }
.brbar { display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin:4px 0 16px; }
table.brev { min-width:860px; } table.brev td { font-size:12.5px; } table.brev tr.berr td { background:#FBE1DE; } table.brev tr.bexist td { color:var(--muted); background:#FAF8F4; }
.bbad { color:#B03A2E; } .bok { color:#23743D; font-weight:700; }
.bfirst, .blatest { display:inline-block; font-size:10.5px; font-weight:700; border-radius:6px; padding:0 5px; margin-left:4px; background:#E3F4E8; color:#23743D; white-space:nowrap; }
.blatest { background:#E8EEFB; color:#2F5AA8; }
@media (max-width: 900px) { .bgrid { grid-template-columns: repeat(3, minmax(0,1fr)); } }
.bhint { margin:4px 0 0; font-size:12px; }
table.brev { table-layout:fixed; } table.brev th:nth-child(1) { width:7%; } table.brev th:nth-child(2) { width:10%; } table.brev th:nth-child(3) { width:8%; }
table.brev th:nth-child(4) { width:13%; } table.brev th:nth-child(5), table.brev th:nth-child(6) { width:13%; } table.brev td { overflow-wrap:anywhere; vertical-align:top; }
table.brev td:nth-child(2), table.brev td:nth-child(3) { white-space:nowrap; overflow-wrap:normal; }
/* 1 Nov 2026: 'Add earlier visits' rows use the one-visit form's report tags, side preview (Zoom) and confirmation */
.bwrap.with-preview { grid-template-columns:minmax(0,1fr) 360px; gap:14px; }
@media (max-width: 1199px) { .bwrap.with-preview { display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:12px; } .bwrap.with-preview .rpview { order:0; top:8px; max-height:calc(100vh - 16px); margin:0; box-shadow:none; } }
@media (max-width: 900px) { .bwrap.with-preview { display:flex; flex-direction:column; } .bwrap.with-preview .rpview { order:-1; max-height:42vh; } }
.bwrap.with-preview table.btable { min-width:780px; }
.brow.bactive { box-shadow:0 0 0 2px #E0B800; }
.bgate { margin-top:8px; padding:8px 12px; border-radius:10px; font-size:13px; } .bgate .row { display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin-top:6px; } .bgate .chk { margin:0; }
.bgate .rxneed { color:#B03A2E; }
table.btable td { vertical-align:top; } table.btable td .rtag { display:block; margin-top:2px; padding:1px 3px; font-size:9.5px; line-height:1.15; text-align:left; white-space:normal; overflow-wrap:anywhere; }
table.btable td .rtag .cdot { margin:0 2px 0 0; width:7px; height:7px; }
.bgrid > label .rtag { display:block; }
/* 1 Nov 2026: visit dates typed as dd/mm/yyyy (text box + calendar button; the browser's date box would follow the computer's language) */
.dmy { position:relative; display:flex; align-items:center; gap:4px; margin-top:3px; }
.dmy .dmyin { flex:1 1 auto; min-width:0; margin-top:0; font-variant-numeric:tabular-nums; }
.dmy .dcal { flex:0 0 auto; border:1px solid #cfc6b8; background:#fff; border-radius:8px; padding:5px 7px; font-size:15px; line-height:1; cursor:pointer; }
.dmy .dcal:hover { border-color:var(--brand); }
.dmy .dpick { position:absolute; right:0; bottom:0; width:1px; height:1px; padding:0; margin:0; border:0; opacity:0; pointer-events:none; }
/* 1 Nov 2026: 'Showing' button of the visit whose report is in the side column; the side column blinks when pressed */
.brow .bshow.bshowing { background:#FFF4B8; border-color:#E0B800; color:#5a4700; font-weight:700; }
@keyframes rpblink { 0%, 50%, 100% { box-shadow:0 0 0 0 #E0B80000; background:#fff; } 25%, 75% { box-shadow:0 0 0 5px #E0B800; background:#FFF7CC; } }
.rpview.blink { animation:rpblink 1.1s ease-in-out 1; }

/* ---- hosting 5 Nov 2026: public front page + clinic profile ---- */
/* ===== Public landing (hosting, premium) — no report samples ===== */
.land-v2 { max-width: none; margin: 0; padding: 0; color: #1f2933; }
.land-v2 a { color: #1F5F66; }
.land-wrap { max-width: 1280px; margin: 0 auto; padding: 0 28px; }
.land-hero { position: relative; min-height: min(78vh, 640px); display: flex; align-items: flex-end; color: #fff; overflow: hidden; background: #0f3a3f; }
.land-hero-media {
  position: absolute; inset: 0;
  background-color: #0f3a3f;
  background-image: url("img/landing/hero.jpg");
  background-size: cover; background-position: center 30%; background-repeat: no-repeat;
}
.land-hero-media img {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; object-position: center 30%; display: block;
}
.land-hero-scrim { position: absolute; inset: 0; background: linear-gradient(105deg, rgba(15,58,63,.88) 0%, rgba(15,58,63,.72) 42%, rgba(15,58,63,.28) 100%); }
.land-hero-inner { position: relative; z-index: 1; max-width: 1280px; margin: 0 auto; padding: 88px 28px 64px; width: 100%; }
.land-kicker { display: inline-block; font-size: .78rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #F3C9A3; margin: 0 0 12px; }
.land-hero h1 { color: #fff; font-size: clamp(2.4rem, 5vw, 3.75rem); line-height: 1.1; font-weight: 800; margin: 0 0 18px; letter-spacing: -.02em; max-width: 15ch; text-shadow: 0 2px 18px rgba(0,0,0,.25); }
.land-hero h1 span { color: #E76F51; }
.land-sub { font-size: clamp(1.12rem, 2.1vw, 1.35rem); line-height: 1.5; max-width: 38rem; margin: 0 0 24px; color: rgba(255,255,255,.92); }
.land-actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.land-btn-primary { background: #E76F51 !important; border-color: #E76F51 !important; color: #fff !important; padding: 12px 22px !important; font-weight: 700 !important; border-radius: 999px !important; box-shadow: 0 8px 24px rgba(231,111,81,.35); }
.land-btn-primary:hover { filter: brightness(1.05); }
.land-btn-ghost { background: transparent !important; border: 1.5px solid rgba(255,255,255,.75) !important; color: #fff !important; padding: 11px 20px !important; border-radius: 999px !important; }
.land-btn-ghost-dark { background: #fff !important; border: 1.5px solid #fff !important; color: #17494F !important; padding: 11px 20px !important; border-radius: 999px !important; }
.land-need-hint { margin: 18px 0 0; font-size: .88rem; color: rgba(255,255,255,.82); max-width: 34rem; line-height: 1.4; }
.land-need-hint a { color: #F6C177; font-weight: 600; }
.land-strip { background: #fff; border-bottom: 1px solid #E5E7EB; padding: 28px 0; }
.land-strip-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.land-strip-item { display: flex; gap: 12px; align-items: flex-start; }
.land-strip-item b { display: block; color: #17494F; font-size: 1.08rem; margin-bottom: 4px; }
.land-strip-item span { display: block; font-size: .95rem; color: #4b5563; line-height: 1.45; }
.land-ico { width: 44px; height: 44px; flex: 0 0 44px; }
.land-section { padding: 80px 0; }
.land-v2 h2 { border-left: none; padding-left: 0; }
.land-section h2 { font-size: clamp(1.75rem, 3vw, 2.35rem); color: #17494F; margin: 0 0 16px; letter-spacing: -.015em; }
.land-cta h2 { color: #fff; }
.land-lead { font-size: 1.15rem; color: #374151; line-height: 1.55; max-width: 44rem; margin: 0 0 28px; }
.land-muted { font-size: .9rem; color: #6b7280; margin: 16px 0 0; line-height: 1.45; }
.land-alt { background: linear-gradient(180deg, #F3F9F8 0%, #EEF4FC 100%); }
.land-need { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; align-items: stretch; }
.land-need-card { background: #fff; border: 1px solid #D5E5E2; border-radius: 18px; padding: 26px 24px; box-shadow: 0 8px 24px rgba(23,73,79,.06); display: flex; flex-direction: column; min-height: 220px; }
.land-need-card .land-need-title { display: block; color: #1F5F66; font-size: 1.2rem; font-weight: 800; margin: 0 0 14px; }
.land-need-card p { margin: 0; font-size: 1.02rem; color: #374151; line-height: 1.5; }
.land-need-card .land-need-list { margin: 0; padding: 0; list-style: none; }
.land-need-card .land-need-list li { position: relative; padding: 7px 0 7px 22px; font-size: 1.02rem; color: #374151; line-height: 1.4; }
.land-need-card .land-need-list li::before { content: ""; position: absolute; left: 0; top: 14px; width: 8px; height: 8px; border-radius: 50%; background: #2E7D86; }
.land-steps { list-style: none; margin: 8px 0 0; padding: 0; display: grid; gap: 16px; }
.land-steps li { display: flex; gap: 16px; align-items: flex-start; background: #fff; border-radius: 14px; padding: 18px 18px; border: 1px solid #E3F1EF; box-shadow: 0 4px 14px rgba(23,73,79,.04); }
.land-steps .n { flex: 0 0 36px; height: 36px; border-radius: 50%; background: #1F5F66; color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 800; }
.land-steps b { display: block; color: #17494F; margin-bottom: 3px; }
.land-steps span:not(.n) { display: block; color: #4b5563; font-size: .95rem; line-height: 1.45; }
.land-split-inner { display: grid; grid-template-columns: 1.05fr .95fr; gap: 40px; align-items: center; }
.land-split-copy p { color: #374151; line-height: 1.55; font-size: 1.05rem; }
.land-ticks { margin: 16px 0 0; padding: 0; list-style: none; }
.land-ticks li { position: relative; padding: 8px 0 8px 28px; color: #374151; line-height: 1.4; }
.land-ticks li::before { content: ""; position: absolute; left: 0; top: 12px; width: 16px; height: 16px; border-radius: 50%; background: #E4F3EC; box-shadow: inset 0 0 0 4px #1D5B3C; }
.land-split-media {
  border-radius: 20px; overflow: hidden; box-shadow: 0 18px 50px rgba(23,73,79,.16);
  width: 100%; max-width: 100%; aspect-ratio: 4 / 3; min-height: 0;
  background-color: #dfe9e7;
  background-image: url("img/landing/consult.jpg");
  background-size: cover; background-position: center; background-repeat: no-repeat;
  position: relative;
}
.land-split-media img {
  position: absolute; inset: 0; width: 100%; height: 100%; max-width: none;
  object-fit: cover; object-position: center; display: block;
}
.land-photo-band { padding-top: 24px; background: #F7F4EE; }
.land-photo-band-inner { display: grid; grid-template-columns: 1.35fr .85fr; gap: 28px; align-items: stretch; }
.land-photo-frame {
  border-radius: 24px; overflow: hidden; box-shadow: 0 18px 50px rgba(23,73,79,.14);
  width: 100%; max-width: 100%; aspect-ratio: 16 / 10; min-height: 0;
  background-color: #c5d8d4;
  background-image: url("img/landing/outdoors.jpg");
  background-size: cover; background-position: center 18%; background-repeat: no-repeat;
  position: relative;
}
.land-photo-frame picture, .land-photo-frame img {
  position: absolute; inset: 0; width: 100%; height: 100%; max-width: none;
  object-fit: cover; object-position: center 18%; display: block;
}
.land-photo-card { background: #fff; border-radius: 20px; padding: 28px 24px; box-shadow: 0 12px 40px rgba(23,73,79,.10); border: 1px solid #E3F1EF; display: flex; flex-direction: column; justify-content: center; }
.land-photo-card h2 { margin-top: 0; font-size: 1.45rem; border-left: none; padding-left: 0; }
.land-cta { background: linear-gradient(120deg, #1F5F66 0%, #17494F 55%, #2E7D86 100%); color: #fff; padding: 56px 0; }
.land-cta h2 { color: #fff; margin: 0 0 10px; }
.land-cta p { color: rgba(255,255,255,.9); max-width: 36rem; margin: 0 0 20px; line-height: 1.5; }
.land-cta-inner { text-align: left; }
.land-foot { background: #0f2f33; color: rgba(255,255,255,.78); padding: 36px 0 48px; font-size: .88rem; line-height: 1.5; }
.land-foot a { color: #F6C177; }
.land-foot p { margin: 0 0 12px; max-width: 52rem; }
@media (max-width: 960px) {
  .land-strip-grid { grid-template-columns: 1fr 1fr; }
  .land-need { grid-template-columns: 1fr; align-items: start; }
  .land-need-card { min-height: 0; }
  .land-split-inner { grid-template-columns: 1fr; gap: 24px; }
  .land-photo-band-inner { grid-template-columns: 1fr; gap: 16px; }
  .land-facts-grid { grid-template-columns: repeat(3, 1fr); gap: 8px; align-items: start; }
  .land-fact-num { font-size: 1.45rem; }
  .land-fact-label { font-size: .7rem; margin-top: 4px; line-height: 1.35; }
  .land-facts { padding: 28px 0 !important; }
}
@media (max-width: 640px) {
  .land-hero { min-height: 0; align-items: flex-end; }
  .land-hero-inner { padding: 56px 16px 36px; width: 100%; max-width: 100%; box-sizing: border-box; }
  .land-hero h1 { max-width: none; font-size: clamp(1.85rem, 8.2vw, 2.35rem); }
  .land-sub { font-size: 1.02rem; }
  .land-hero-media { transform: none; }
  .land-strip-grid { grid-template-columns: 1fr; }
  .land-section { padding: 40px 0; }
  .land-wrap { padding: 0 16px; max-width: 100%; box-sizing: border-box; }
  .land-actions { flex-direction: column; align-items: stretch; gap: 10px; }
  .land-actions .btn { width: 100%; text-align: center; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; }
  .land-need-card { padding: 18px 16px; min-height: 0; }
  .land-cta .land-actions { flex-direction: column; align-items: stretch; }
  .land-cta .land-actions .btn { width: 100%; text-align: center; min-height: 44px; }
  /* Compact public header: logo + Sign in only */
  body.land-page .topbar { padding: 10px 14px; gap: 10px; flex-wrap: nowrap; }
  body.land-page .brand { font-size: 16px; white-space: nowrap; min-width: 0; flex: 0 1 auto; overflow: hidden; text-overflow: ellipsis; }
  body.land-page #nav { display: flex; align-items: center; flex: 0 0 auto; flex-wrap: nowrap; }
  body.land-page #nav a { display: none; margin-left: 0; }
  body.land-page #nav a[href="#/login"] {
    display: inline-flex; align-items: center; justify-content: center;
    white-space: nowrap; border: 1.5px solid rgba(255,255,255,.7);
    border-radius: 999px; padding: 8px 14px; min-height: 36px; font-size: 13px;
    background: rgba(255,255,255,.12);
  }
  body.land-page #nav a[href="#/login"].active { border-bottom: 1.5px solid rgba(255,255,255,.7); }
}
/* Legacy .land helpers kept harmless if referenced */
.land { max-width: none; margin: 0; padding: 0; }

/* Landing page chrome */
body.land-page { background: #fff; }
body.land-page main { max-width: none; margin: 0; padding: 0; min-height: 0; }
.land-v2 { overflow-x: clip; }
body.land-page .topbar { position: sticky; top: 0; z-index: 100; background: rgba(23,73,79,.92); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); transition: box-shadow .25s ease, background .25s ease; }
body.land-scrolled .topbar { box-shadow: 0 8px 28px rgba(15,47,51,.22); background: rgba(15,47,51,.96); }
.land-hero-media { will-change: transform; transform: scale(1.06); transform-origin: center top; width: 100%; max-width: 100%; }
@media (max-width: 640px) {
  .land-hero-media { transform: none; will-change: auto; }
}
.land-v2, .land-hero, .land-section, .land-wrap, .land-split-inner, .land-photo-band-inner { max-width: 100%; box-sizing: border-box; }
.land-split-inner, .land-photo-band-inner { min-width: 0; }
.land-split-copy, .land-split-media, .land-photo-frame, .land-photo-card { min-width: 0; max-width: 100%; }
.land-card { transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease; }
.land-card:hover { transform: translateY(-3px); box-shadow: 0 14px 34px rgba(23,73,79,.12); border-color: #b9d6d1; }
.land-btn-primary, .land-btn-ghost, .land-btn-ghost-dark { transition: transform .18s ease, filter .18s ease, box-shadow .18s ease; }
.land-btn-primary:hover, .land-btn-ghost:hover, .land-btn-ghost-dark:hover { transform: translateY(-1px); }
.land-facts { background: #17494F; color: #fff; padding: 48px 0 !important; }
.land-facts-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; text-align: center; }
.land-fact-num { display: block; font-size: clamp(2rem, 4vw, 2.8rem); font-weight: 800; color: #F6C177; letter-spacing: -.02em; line-height: 1.1; }
.land-fact-label { display: block; margin-top: 8px; font-size: .95rem; color: rgba(255,255,255,.88); line-height: 1.4; }
.land-reveal { opacity: 0; transform: translateY(18px); transition: opacity .55s ease, transform .55s ease; }
.land-reveal.is-in { opacity: 1; transform: none; }
.land-delay-1 { transition-delay: .08s; }
.land-delay-2 { transition-delay: .16s; }
.land-delay-3 { transition-delay: .24s; }
@media (prefers-reduced-motion: reduce) {
  .land-reveal { opacity: 1 !important; transform: none !important; transition: none !important; }
  .land-hero-media { transform: none !important; }
  .land-card, .land-btn-primary, .land-btn-ghost, .land-btn-ghost-dark { transition: none !important; }
  .land-card:hover { transform: none; }
}
.logo-prev { max-height: 64px; max-width: 160px; display: block; margin-top: 8px; border: 1px solid #E5E7EB; border-radius: 8px; padding: 4px; background: #fff; }
.clinic-box { border: 1px dashed #C9BBA8; border-radius: 12px; padding: 12px 14px; margin-top: 14px; background: #FFFcf7; }
.clinic-box h3 { margin: 0 0 8px; font-size: 1rem; color: #17494F; }

/* ---- app phone polish 5 Nov 2026 ---- */
@media (max-width: 640px) {
  /* Topbar: no collision; tappable pills; wrap cleanly */
  .topbar { padding: 10px 12px; gap: 8px; align-items: flex-start; flex-wrap: wrap; }
  .brand { font-size: 16px; line-height: 1.2; }
  body:not(.land-page) #nav { display: flex; flex-wrap: wrap; gap: 6px; width: 100%; justify-content: flex-start; }
  body:not(.land-page) #nav a, body:not(.land-page) #nav .who { margin-left: 0; display: inline-flex; align-items: center; justify-content: center;
    min-height: 36px; padding: 8px 12px; border-radius: 999px; border: 1px solid rgba(255,255,255,.35);
    font-size: 13px; white-space: nowrap; box-sizing: border-box; }
  body:not(.land-page) #nav a.active { border-color: #FFD8C9; border-bottom-width: 1px; }
  body:not(.land-page) #nav .who { border-style: dashed; opacity: .85; max-width: 100%; overflow: hidden; text-overflow: ellipsis; }

  /* Forms: larger tap targets, numeric-friendly */
  input, select, textarea { font-size: 16px; padding: 10px 11px; min-height: 44px; box-sizing: border-box; }
  input[type=checkbox], input[type=radio] { width: 20px; height: 20px; min-height: 0; padding: 0; }
  .chk { display: flex; align-items: flex-start; gap: 10px; padding: 8px 0; font-size: 14px; line-height: 1.35; }
  .chk input { margin-top: 2px; flex: 0 0 auto; }
  .btn, label.btn { min-height: 44px; padding: 11px 16px; display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; }
  .btn.small, label.btn.small { min-height: 40px; padding: 9px 12px; font-size: 13px; }
  .dmy .dcal { min-width: 44px; min-height: 44px; padding: 8px; font-size: 18px; }
  .dmy .dmyin { min-height: 44px; font-size: 16px; }

  /* Grids collapse */
  .g2, .g3, .g4, .g6 { grid-template-columns: 1fr 1fr !important; }
  .grid.g6 > label[style*="span 2"], .grid.g6 > label[style*="span 3"] { grid-column: 1 / -1 !important; }
  .eyes { grid-template-columns: 1fr; gap: 12px; }
  .txgrid { grid-template-columns: 1fr !important; }
  .txgrid .chk { min-height: 40px; }
  .summary { grid-template-columns: 1fr; }
  .tiles { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .reprow { flex-direction: column; align-items: stretch; gap: 8px; }
  .reprow b { min-width: 0; display: block; }
  .reprow .btn, .reprow a.btn { width: 100%; }
  .row { flex-wrap: wrap; gap: 8px; }
  .row > .btn, .row > a.btn, .row > label.btn { flex: 1 1 auto; }

  /* Upload actions stack full-width on phones */
  #rptPick, #rptCamBtn, #rptAddBtn, label.btn[for^="rpt"], label.btn[for$="_file"], label.btn[for$="_add"] {
    width: 100%; margin: 4px 0;
  }
  .rptbar, .rpbar, .brbar { display: flex; flex-direction: column; align-items: stretch; gap: 8px; }
  .rpview { max-height: 38vh; }
  .rpbtns { display: flex; flex-wrap: wrap; gap: 8px; }

  /* Tables: scroll inside card, don't widen the page */
  .card:has(table.t), .card:has(table.brev) { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  table.t, table.brev { font-size: 12.5px; }
  table.t th, table.t td { padding: 8px 6px; }

  main { padding: 0 12px; margin: 14px auto; max-width: 100%; box-sizing: border-box; }
  .card { padding: 14px 14px; max-width: 100%; box-sizing: border-box; }
  .sitefoot { padding: 14px 12px; }

  /* Voice note */
  #voice .grid.g4 { grid-template-columns: 1fr 1fr !important; }
  #vMake, #vScript { min-height: 44px; width: 100%; }
}
@media (max-width: 400px) {
  .g2, .g3, .g4, .g6 { grid-template-columns: 1fr !important; }
  .tiles { grid-template-columns: 1fr 1fr; }
}