/* Negro editorial y acento azul para la acción principal. */
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap');
:root { --ink:#0a0a0a; --muted:#626262; --line:#dedede; --soft:#f4f4f4; --blue:#2563eb; --sans:'Plus Jakarta Sans',system-ui,sans-serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:100px; }
body { margin:0; font-family:var(--sans); color:var(--ink); background:white; line-height:1.6; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; transition:opacity 180ms; }
img { display:block; max-width:100%; }
button,input,select { font:inherit; border-radius:0; }
button,summary { cursor:pointer; }
:focus-visible { outline:3px solid var(--blue); outline-offset:4px; }
h1,h2,h3 { letter-spacing:-.045em; line-height:1.12; }
h2 { font-size:clamp(32px,4.2vw,56px); margin:14px 0 24px; text-wrap:balance; }
h3 { font-size:20px; margin:0 0 12px; }
p { max-width:62ch; }
.container { width:min(100% - 56px,1200px); margin-inline:auto; }
.skip-link { position:fixed; top:8px; left:8px; z-index:100; padding:12px 20px; background:white; transform:translateY(-150%); }
.skip-link:focus { transform:none; }
.eyebrow { display:block; font-size:11px; font-weight:700; letter-spacing:.17em; color:var(--muted); }
.btn { display:inline-flex; justify-content:center; align-items:center; gap:12px; min-height:48px; padding:14px 22px; border:1px solid transparent; font-size:14px; font-weight:700; transition:background-color 180ms,transform 180ms; }
.btn-primary { color:white; background:var(--blue); }
.btn-primary:hover { background:#1d4ed8; }
.btn:active { transform:translateY(1px); }
.btn-outline { border-color:var(--line); color:var(--ink); }
.btn-outline:hover { background:var(--soft); }
.text-link { display:inline-flex; gap:10px; border-bottom:1px solid currentColor; padding:8px 0; font-size:14px; font-weight:700; }
.nav { position:sticky; z-index:50; top:0; border-bottom:1px solid var(--line); background:white; }
.nav-inner { display:flex; align-items:center; justify-content:space-between; min-height:76px; gap:20px; }
.brand { font-size:22px; letter-spacing:-.055em; font-weight:800; white-space:nowrap; }
.brand span { color:#707070; font-weight:500; }
.nav-links { display:flex; align-items:center; gap:28px; font-size:13px; font-weight:600; }
.nav-links>a:not(.btn):hover { opacity:.65; }
.mobile-menu { display:none; position:relative; }
.mobile-menu summary { list-style:none; border:1px solid var(--line); min-height:44px; padding:10px 14px; font-size:13px; font-weight:700; }
.mobile-menu summary::-webkit-details-marker { display:none; }
.mobile-menu summary span { padding-left:8px; }
.mobile-menu nav { position:absolute; right:0; top:calc(100% + 10px); min-width:230px; background:white; border:1px solid var(--line); padding:10px; box-shadow:0 10px 30px #0002; }
.mobile-menu nav a { display:block; padding:14px; font-size:14px; }
.mobile-menu nav a:hover { background:var(--soft); }
.hero { position:relative; overflow:hidden; color:white; background:var(--ink); }
.hero-photo { position:absolute; inset:0; background:linear-gradient(90deg,#000c,#0007),url('https://images.unsplash.com/photo-1519671482749-fd09be7ccebf?w=1800&q=85&auto=format&fit=crop') center/cover; }
.hero-inner { position:relative; padding-block:88px 64px; }
.hero .eyebrow { color:#ddd; }
.hero h1 { font-size:clamp(44px,6.2vw,84px); max-width:17ch; margin:24px 0; font-weight:800; }
.hero-lead { font-size:17px; max-width:58ch; color:#eee; }
.hero-search { display:grid; grid-template-columns:1.25fr 1fr 1fr .7fr auto; background:white; color:var(--ink); padding:6px; margin-top:32px; }
.hero-search label { display:flex; flex-direction:column; gap:6px; min-width:0; padding:10px 14px; border-right:1px solid var(--line); font-size:11px; font-weight:700; color:var(--muted); }
.hero-search input,.hero-search select { display:block; width:100%; min-height:30px; min-width:0; border:0; background:white; color:var(--ink); font-size:14px; padding:0; }
.hero-search .btn { white-space:nowrap; }
.hero-note { font-size:12px; color:#ddd; max-width:90ch; margin:20px 0; }
.hero-help { display:inline-block; border-bottom:1px solid #aaa; padding:7px 0; font-size:14px; }
.section { padding-block:84px; }
.soft { background:var(--soft); }
.section-head { display:flex; justify-content:space-between; align-items:end; gap:30px; margin-bottom:30px; }
.section-head h2 { margin-bottom:0; }
.category-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.category { border:1px solid var(--line); overflow:hidden; transition:transform 200ms; }
.category:hover { transform:translateY(-3px); }
.category img { width:100%; aspect-ratio:4/3; height:auto; object-fit:cover; }
.category>div { padding:22px; }
.category p { margin:0 0 18px; font-size:14px; color:var(--muted); }
.category span { font-size:13px; font-weight:700; }
.note { color:var(--muted); font-size:12px; margin-top:20px; }
.steps { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:36px; list-style:none; padding:0; margin:38px 0 0; }
.steps li { border-top:1px solid #ccc; padding-top:20px; }
.steps li>span { font-size:12px; color:var(--muted); display:block; margin-bottom:20px; }
.steps p { font-size:14px; color:var(--muted); }
.split { display:grid; grid-template-columns:1.1fr 1fr; gap:72px; align-items:center; }
.lead { font-size:17px; color:var(--muted); }
.split .btn { margin-top:16px; }
.help-panel { border:1px solid var(--line); padding:38px; background:var(--soft); }
.help-panel p { color:var(--muted); font-size:15px; margin-bottom:28px; }
.dark { background:var(--ink); color:white; }
.dark .eyebrow,.dark .lead,.dark .note,.dark p { color:#ccc; }
.host-photo { margin:0; }
.host-photo img { width:100%; height:auto; aspect-ratio:4/3; object-fit:cover; }
.host-photo figcaption { color:#bbb; font-size:11px; margin-top:12px; }
.faq-wrap { max-width:900px; }
.faq { margin-top:36px; }
.faq details { border-top:1px solid var(--line); padding-block:22px; }
.faq summary { font-size:17px; font-weight:700; padding-right:20px; }
.faq details p { color:var(--muted); font-size:14px; margin-bottom:0; }
.footer { color:white; background:var(--ink); padding-block:60px 28px; }
.footer .brand span { color:#bbb; }
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr; gap:40px; }
.footer-grid p { color:#aaa; font-size:14px; }
.footer-grid nav h3 { font-size:13px; letter-spacing:0; }
.footer-grid nav a { display:block; padding-block:8px; font-size:13px; color:#ccc; }
.footer-grid nav a:hover { color:white; }
.footer-bottom { margin-top:40px; padding-top:22px; border-top:1px solid #333; display:flex; justify-content:space-between; gap:20px; color:#aaa; font-size:11px; flex-wrap:wrap; }
@media (max-width:1000px) { .hero-search { grid-template-columns:repeat(2,minmax(0,1fr)); } .hero-search button { grid-column:1/-1; } .hero-search label { border-bottom:1px solid var(--line); } .hero-search label:nth-child(even) { border-right:0; } .split { gap:36px; } }
@media (max-width:760px) {
  html { scroll-padding-top:84px; }
  .container { width:calc(100% - 36px); }
  .nav-inner { min-height:66px; }
  .brand { font-size:19px; }
  .nav-links { display:none; }
  .mobile-menu { display:block; }
  .hero-inner { padding-block:44px 38px; }
  .hero h1 { font-size:clamp(38px,9.5vw,62px); line-height:1.1; margin-block:18px; }
  .hero-lead { font-size:15px; }
  .hero-search { margin-top:24px; }
  .hero-search label { padding:10px; }
  .hero-search input,.hero-search select { font-size:16px; }
  .hero-note { line-height:1.6; }
  .section { padding-block:56px; }
  .section-head { align-items:start; flex-direction:column; gap:18px; }
  .category-grid,.steps,.split,.footer-grid { grid-template-columns:1fr; }
  .category img { aspect-ratio:16/9; }
  .steps { gap:22px; }
  .steps li>span { margin-bottom:12px; }
  .help-panel { padding:26px; }
  .split { gap:30px; }
  .footer-grid { gap:24px; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { transition:none!important; animation:none!important; } .category:hover,.btn:active { transform:none; } }
