/* itechnicia.com/result — same look as the "Website preview" card in
   Dashboard → Exam Settings → Results. */
.res-hero{ background:var(--navy-anchor); padding:108px 5vw 56px; text-align:center; }
@media (min-width:901px){ .res-hero{ padding-top:32px; } }
.res-hero__inner{ max-width:640px; margin:0 auto; }
.res-eyebrow{ font-family:'Roboto Mono',monospace; font-size:13px; letter-spacing:.14em; color:var(--yellow); margin-bottom:14px; }
.res-hero h1{ font-family:'Poppins',sans-serif; font-weight:800; font-size:clamp(26px,3.4vw,38px); color:var(--white); margin-bottom:12px; line-height:1.2; text-wrap:balance; }
.res-hero p{ font-family:'Inter',sans-serif; font-size:14.5px; color:var(--on-dark-300); }

.res-body{ background:var(--surface-bg); padding:48px 16px 80px; }
.res-body__inner{ max-width:720px; margin:0 auto; }

.res-site{ background:var(--white); border:1px solid var(--gray150); border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-md); }
.res-top{ background:var(--navy-anchor); color:var(--white); padding:12px 18px; display:flex; justify-content:space-between; align-items:center; gap:8px; flex-wrap:wrap; }
.res-top b{ font-family:'Poppins',sans-serif; font-weight:600; }
.res-url{ font-family:'Roboto Mono',monospace; font-size:12px; opacity:.8; }
.res-inner{ padding:20px; display:flex; flex-direction:column; gap:16px; }

.res-form{ display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:14px; align-items:end; }
.res-form label{ display:flex; flex-direction:column; gap:6px; font-family:'Inter',sans-serif; font-size:13px; font-weight:500; color:var(--gray700); }
.res-in{ border:1px solid var(--gray300); border-radius:10px; padding:10px 12px; font-size:14.5px; color:var(--ink); background:var(--white); width:100%; font-family:'Inter',sans-serif; }
.res-in:focus{ outline:2px solid var(--primary-blue); outline-offset:0; border-color:transparent; }
.res-mono{ font-family:'Roboto Mono',monospace; font-variant-numeric:tabular-nums; }
.res-btn{ background:var(--primary-blue); color:var(--white); border:0; border-radius:10px; padding:11px 18px; font-family:'Poppins',sans-serif; font-weight:600; font-size:14px; cursor:pointer; }
.res-btn:hover{ filter:brightness(1.07); }
.res-btn:disabled{ opacity:.6; cursor:wait; }
.res-btn:focus-visible{ outline:2px solid var(--navy-anchor); outline-offset:2px; }

.res-error{ background:var(--danger-bg); color:var(--danger); border-radius:10px; padding:10px 14px; font-family:'Inter',sans-serif; font-size:13.5px; }
.res-note{ font-family:'Inter',sans-serif; font-size:13px; color:var(--gray500); }
.res-note--ok{ color:var(--success); font-weight:600; }

.res-ms{ border:1px solid var(--gray150); border-radius:12px; padding:14px; display:flex; flex-direction:column; gap:12px; }
.res-ms__head{ display:flex; justify-content:space-between; align-items:flex-start; gap:12px; }
.res-ms__head h3{ font-family:'Poppins',sans-serif; font-weight:600; font-size:16px; color:var(--navy-anchor); margin:0 0 2px; }
.res-ms__head p{ font-family:'Inter',sans-serif; font-size:12.5px; color:var(--gray500); }
.res-grade{ font-family:'Poppins',sans-serif; font-weight:700; font-size:30px; line-height:1; color:var(--success); }
.res-grade--fail{ color:var(--danger); font-size:20px; }

.res-tbl{ overflow-x:auto; border:1px solid var(--gray150); border-radius:10px; }
.res-tbl table{ border-collapse:collapse; width:100%; font-family:'Inter',sans-serif; font-size:13.5px; }
.res-tbl th,.res-tbl td{ padding:10px 12px; text-align:left; border-bottom:1px solid var(--gray150); white-space:nowrap; color:var(--ink); }
.res-tbl th{ font-size:11.5px; text-transform:uppercase; letter-spacing:.05em; color:var(--gray500); font-weight:600; background:var(--gray100); }
.res-tbl tr:last-child td{ border-bottom:0; }
.res-tbl .r{ text-align:right; }
.res-chip{ display:inline-block; border-radius:999px; padding:2px 10px; font-size:12px; font-weight:600; }
.res-chip.ok{ background:var(--success-bg); color:var(--success); }
.res-chip.bad{ background:var(--danger-bg); color:var(--danger); }