/* PortugalTest — landing and legal pages. "Atlântico": warm paper, deep ocean primary, terracotta accent. */
:root {
  --bg:#F7F4EE; --surface:#FFFFFF; --surface-2:#F0EBE2; --ink:#1B1F24; --muted:#5F6670; --line:#E3DDD2; --line-strong:#C9C1B4;
  --primary:#0F4C5C; --primary-deep:#093642; --primary-soft:#DCEBEE; --on-primary:#FFFFFF;
  --accent:#C8553D; --accent-soft:#F8E1DA; --success:#2E7D5B; --success-soft:#DDF0E6;
  --serif:"Lora", Georgia, "Times New Roman", serif; --sans:"Inter", -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; --mono:ui-monospace, Menlo, Consolas, monospace;
  --radius:14px; --shadow:0 1px 2px rgba(27,31,36,.06), 0 12px 32px -16px rgba(27,31,36,.25);
  --w:1120px;
  color-scheme: light dark;
}
@media (prefers-color-scheme: dark) {
  :root { --bg:#121517; --surface:#1B1F23; --surface-2:#23282D; --ink:#ECE8E1; --muted:#A7AEB6; --line:#2F353B; --line-strong:#4A525A;
    --primary:#7FC4D3; --primary-deep:#B9E0E8; --primary-soft:#16343C; --on-primary:#0B1A1E;
    --accent:#E8927B; --accent-soft:#4A2A22; --success:#86D1AE; --success-soft:#1F4535;
    --shadow:0 1px 2px rgba(0,0,0,.4), 0 12px 32px -16px rgba(0,0,0,.7); }
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--bg); color:var(--ink); font-family:var(--sans); font-size:17px; line-height:1.55; -webkit-font-smoothing:antialiased; }
a { color:var(--primary); }
h1, h2, h3 { font-family:var(--serif); font-weight:600; line-height:1.15; margin:0 0 .4em; letter-spacing:-.012em; }
h1 { font-size:clamp(34px, 5vw, 54px); }
h2 { font-size:clamp(26px, 3.4vw, 36px); }
h3 { font-size:20px; }
p { margin:.5em 0; }
.wrap { max-width:var(--w); margin:0 auto; padding:0 24px; }
.muted { color:var(--muted); }
.lead { font-size:19px; color:var(--muted); max-width:60ch; }
section { padding:72px 0; }
section + section { border-top:1px solid var(--line); }
.eyebrow { font-size:13px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--accent); margin-bottom:12px; }

/* header */
.top { position:sticky; top:0; z-index:10; background:color-mix(in srgb, var(--bg) 85%, transparent); backdrop-filter:blur(12px); border-bottom:1px solid var(--line); }
.top .wrap { display:flex; align-items:center; gap:24px; height:64px; }
.logo { display:flex; align-items:center; gap:10px; text-decoration:none; color:inherit; font-family:var(--serif); font-weight:700; font-size:21px; letter-spacing:-.01em; }
.logo .mark { width:32px; height:32px; border-radius:9px; background:var(--primary); color:var(--on-primary); display:inline-flex; align-items:center; justify-content:center; font-size:15px; font-weight:700; }
.top nav { display:flex; gap:22px; margin-left:auto; }
.top nav a { text-decoration:none; color:var(--muted); font-weight:500; font-size:15px; }
.top nav a:hover { color:var(--ink); }
.langs { display:flex; gap:4px; }
.langs a { text-decoration:none; font-size:13px; font-weight:600; padding:5px 8px; border-radius:8px; color:var(--muted); }
.langs a.on { background:var(--surface-2); color:var(--ink); }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; text-decoration:none; border:1px solid var(--line-strong); background:var(--surface); color:var(--ink); border-radius:999px; padding:12px 22px; font-size:16px; font-weight:600; cursor:pointer; font-family:inherit; line-height:1.2; white-space:nowrap; }
.btn:hover { border-color:var(--primary); }
.btn.primary { background:var(--primary); color:var(--on-primary); border-color:var(--primary); }
.btn.primary:hover { background:var(--primary-deep); border-color:var(--primary-deep); }
.btn.sm { padding:9px 16px; font-size:14px; }
@media (max-width: 820px) { .top nav { display:none; } }

/* hero */
.hero { padding:72px 0 56px; }
.hero .wrap { display:grid; grid-template-columns:1.1fr .9fr; gap:56px; align-items:center; }
.hero h1 { max-width:16ch; }
.hero .cta { display:flex; gap:12px; flex-wrap:wrap; margin:28px 0 18px; }
.hero .note { font-size:14px; color:var(--muted); max-width:56ch; }
@media (max-width: 900px) { .hero .wrap { grid-template-columns:1fr; gap:36px; } .hero { padding:44px 0 40px; } }
/* illustration: a paper, its answer sheet, the clock and an estimate badge */
.illo { position:relative; height:420px; }
.illo .sheet, .illo .clock, .illo .badge, .illo .wave { position:absolute; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow); }
.illo .sheet { left:6%; top:6%; width:74%; padding:22px 24px; }
.illo .sheet .hdr { display:flex; justify-content:space-between; align-items:baseline; gap:12px; border-bottom:2px solid var(--ink); padding-bottom:10px; margin-bottom:14px; }
.illo .sheet .hdr span { white-space:nowrap; }
.illo .sheet .hdr b { font-family:var(--serif); font-size:17px; }
.illo .sheet .hdr span { font-size:12px; color:var(--muted); letter-spacing:.06em; text-transform:uppercase; }
.illo .rowq { display:flex; align-items:center; gap:10px; padding:6px 0; border-bottom:1px dashed var(--line); font-family:var(--mono); font-size:14px; }
.illo .rowq .n { width:24px; color:var(--muted); }
.illo .bub { width:26px; height:26px; border-radius:50%; border:1.5px solid var(--line-strong); display:inline-flex; align-items:center; justify-content:center; font-size:12px; font-weight:700; font-family:var(--sans); }
.illo .bub.on { background:var(--primary); border-color:var(--primary); color:var(--on-primary); }
.illo .clock { right:0; top:0; padding:12px 16px; font-family:var(--mono); font-size:22px; font-variant-numeric:tabular-nums; }
.illo .clock small { display:block; font-family:var(--sans); font-size:11px; color:var(--muted); letter-spacing:.06em; text-transform:uppercase; }
.illo .wave { right:4%; top:46%; padding:30px 16px 12px; display:flex; align-items:flex-end; gap:4px; height:84px; width:44%; }
.illo .wave i { display:block; width:5px; background:var(--primary); border-radius:3px; opacity:.85; }
.illo .wave em { position:absolute; left:16px; top:9px; font-style:normal; font-size:11px; color:var(--muted); letter-spacing:.06em; text-transform:uppercase; white-space:nowrap; }
.illo .badge { left:14%; bottom:2%; padding:14px 18px; display:flex; align-items:center; gap:14px; }
.illo .badge .pct { font-family:var(--serif); font-size:34px; font-weight:700; color:var(--primary); line-height:1; }
.illo .badge small { display:block; font-size:12px; color:var(--muted); }
.illo .badge b { font-size:14px; }
@media (max-width: 480px) { .illo { height:360px; } .illo .sheet { width:80%; padding:16px; } .illo .wave { display:none; } .illo .clock { font-size:18px; } }

/* trust strip */
.trust { border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:var(--surface); padding:18px 0; }
.trust .wrap { display:grid; grid-template-columns:repeat(4, 1fr); gap:18px; }
.trust div { display:flex; gap:10px; align-items:flex-start; font-size:14px; color:var(--muted); }
.trust svg { flex:none; width:20px; height:20px; color:var(--success); margin-top:2px; }
@media (max-width: 820px) { .trust .wrap { grid-template-columns:1fr 1fr; } }
@media (max-width: 480px) { .trust .wrap { grid-template-columns:1fr; gap:10px; } }

/* cards and grids */
.grid3 { display:grid; grid-template-columns:repeat(3, 1fr); gap:20px; margin-top:32px; }
.grid2 { display:grid; grid-template-columns:repeat(2, 1fr); gap:20px; margin-top:32px; }
@media (max-width: 900px) { .grid3 { grid-template-columns:1fr; } .grid2 { grid-template-columns:1fr; } }
.card { background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:24px; }
.card h3 { margin-top:0; }
.card p { color:var(--muted); font-size:15.5px; margin:0; }
.card .ic { width:40px; height:40px; border-radius:10px; background:var(--primary-soft); color:var(--primary); display:inline-flex; align-items:center; justify-content:center; margin-bottom:14px; }
.card .ic svg { width:22px; height:22px; }
.legal-note { margin-top:20px; padding:14px 18px; border-left:3px solid var(--accent); background:var(--accent-soft); border-radius:0 10px 10px 0; font-size:14.5px; }

/* exam table */
.exam-table { width:100%; border-collapse:collapse; margin-top:28px; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; }
.exam-table th, .exam-table td { text-align:left; padding:16px 18px; vertical-align:top; border-top:1px solid var(--line); font-size:15.5px; }
.exam-table th { font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); border-top:0; background:var(--surface-2); }
.exam-table td.name { font-family:var(--serif); font-weight:600; font-size:16px; min-width:200px; }
.exam-table td.num { font-family:var(--mono); white-space:nowrap; }
.exam-table td.w { color:var(--muted); }
.exam-table tr.break td { background:var(--surface-2); color:var(--muted); font-size:14px; text-align:center; }
@media (max-width: 760px) {
  .exam-table thead { display:none; }
  .exam-table, .exam-table tbody, .exam-table tr, .exam-table td { display:block; }
  .exam-table td { border-top:0; padding:6px 18px; }
  .exam-table tr { border-top:1px solid var(--line); padding:12px 0; }
  .exam-table td.name { padding-top:0; }
  .exam-table td.num::before { content:attr(data-l) ": "; color:var(--muted); font-family:var(--sans); }
}
.facts { display:grid; grid-template-columns:repeat(4, 1fr); gap:20px; margin-top:24px; }
.facts div { background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:18px 20px; }
.facts b { display:block; font-family:var(--serif); font-size:17px; margin-bottom:6px; }
.facts p { font-size:14.5px; color:var(--muted); margin:0; }
@media (max-width: 900px) { .facts { grid-template-columns:1fr 1fr; } }
@media (max-width: 520px) { .facts { grid-template-columns:1fr; } }
.verified { margin-top:20px; font-size:14px; color:var(--muted); display:flex; gap:16px; flex-wrap:wrap; align-items:center; }

/* steps */
.steps { display:grid; grid-template-columns:repeat(3, 1fr); gap:20px; margin-top:32px; counter-reset:step; }
.steps div { position:relative; padding:24px 24px 24px 72px; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); }
.steps div::before { counter-increment:step; content:counter(step); position:absolute; left:22px; top:22px; width:36px; height:36px; border-radius:50%; background:var(--primary); color:var(--on-primary); display:flex; align-items:center; justify-content:center; font-family:var(--serif); font-weight:700; font-size:18px; }
.steps h3 { margin-top:2px; }
.steps p { color:var(--muted); font-size:15.5px; margin:0; }
@media (max-width: 900px) { .steps { grid-template-columns:1fr; } }

/* pricing */
.plans { display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-top:32px; max-width:900px; }
.plan { background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:28px; display:flex; flex-direction:column; }
.plan.full { border:2px solid var(--primary); box-shadow:var(--shadow); }
.plan .name { font-size:13px; letter-spacing:.1em; text-transform:uppercase; font-weight:700; color:var(--muted); }
.plan.full .name { color:var(--primary); }
.plan .price { font-family:var(--serif); font-size:44px; font-weight:700; line-height:1.1; margin:8px 0 2px; }
.plan .note { font-size:14px; color:var(--muted); min-height:20px; }
.plan ul { list-style:none; padding:0; margin:20px 0 24px; flex:1; }
.plan li { padding:7px 0 7px 30px; position:relative; font-size:15.5px; }
.plan li::before { content:""; position:absolute; left:2px; top:12px; width:16px; height:16px; border-radius:50%; background:var(--success-soft); }
.plan li::after { content:""; position:absolute; left:7px; top:15px; width:6px; height:9px; border:solid var(--success); border-width:0 2px 2px 0; transform:rotate(45deg); }
.plan .how { font-size:13.5px; color:var(--muted); margin-top:14px; }
@media (max-width: 760px) { .plans { grid-template-columns:1fr; } }

/* faq */
.faq { max-width:800px; margin-top:24px; }
.faq details { border-top:1px solid var(--line); padding:6px 0; }
.faq details:last-child { border-bottom:1px solid var(--line); }
.faq summary { cursor:pointer; font-weight:600; font-size:17px; padding:12px 32px 12px 0; position:relative; list-style:none; }
.faq summary::-webkit-details-marker { display:none; }
.faq summary::after { content:"+"; position:absolute; right:4px; top:10px; font-size:22px; color:var(--muted); font-weight:400; }
.faq details[open] summary::after { content:"–"; }
.faq details p { margin:0 0 14px; color:var(--muted); max-width:70ch; }

/* disclaimer and footer */
.disclaimer { background:var(--surface); border:1px solid var(--line-strong); border-radius:var(--radius); padding:24px 28px; margin-top:8px; }
.disclaimer h3 { margin:0 0 6px; }
.disclaimer p { margin:0; color:var(--muted); font-size:15px; }
footer { border-top:1px solid var(--line); padding:32px 0 48px; color:var(--muted); font-size:14px; }
footer .wrap { display:flex; gap:24px; flex-wrap:wrap; align-items:center; }
footer nav { display:flex; gap:18px; flex-wrap:wrap; }
footer nav a { color:var(--muted); text-decoration:none; }
footer nav a:hover { color:var(--ink); }
footer .copy { width:100%; margin-top:8px; }

/* legal pages */
.doc { max-width:760px; padding:40px 0 80px; }
.doc h1 { font-size:36px; }
.doc h2 { font-size:22px; margin-top:32px; }
.doc p, .doc li { color:var(--ink); font-size:16px; }
.doc .updated { color:var(--muted); font-size:14px; }

/* narrow screens: the header keeps the logo and the language switch; the hero has the call to action */
@media (max-width: 600px) {
  .wrap { padding:0 18px; }
  .top .wrap { gap:12px; height:58px; }
  .top .btn { display:none; }
  .langs { margin-left:auto; }
  .logo { font-size:19px; }
  section { padding:52px 0; }
  .hero .cta .btn { flex:1; }
  .card { padding:20px; }
}
