:root{
  --navy:#071b33;
  --navy2:#0c2b4d;
  --blue:#1f7ae0;
  --sky:#79c7ff;
  --gold:#d8ab4e;
  --cream:#f7f4ed;
  --white:#ffffff;
  --ink:#152235;
  --muted:#5e6b7c;
  --danger:#c73535;
  --success:#1b8a5a;
  --shadow:0 18px 45px rgba(7,27,51,.15);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,Arial,Helvetica,sans-serif;color:var(--ink);background:#f8fbff;line-height:1.6}
a{color:inherit}
.container{width:min(1160px,92%);margin:auto}
.topbar{background:var(--navy);color:#fff;padding:9px 0;font-size:.9rem}
.topbar .container{display:flex;justify-content:space-between;gap:16px;align-items:center;flex-wrap:wrap}
.header{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.97);backdrop-filter:blur(10px);border-bottom:1px solid #e6edf5}
.nav{display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:78px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;font-weight:800;color:var(--navy);font-size:1.35rem}
.brand-mark{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(145deg,var(--blue),var(--navy));color:#fff;border:2px solid var(--gold);font-size:1.2rem}
.navlinks{display:flex;gap:14px;align-items:center;flex-wrap:nowrap}
.navlinks a{text-decoration:none;font-weight:700;color:var(--navy);font-size:.95rem}
.language-select{padding:10px 12px;border:1px solid #ccd8e6;border-radius:10px;background:#fff}
.hero{background:radial-gradient(circle at 20% 20%,rgba(121,199,255,.42),transparent 26%),linear-gradient(135deg,#06162b 0%,#0b315a 55%,#145d9c 100%);color:#fff;padding:92px 0 74px;overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:42px;align-items:center}
.eyebrow{display:inline-flex;align-items:center;gap:8px;border:1px solid rgba(255,255,255,.25);padding:7px 12px;border-radius:999px;background:rgba(255,255,255,.08);font-weight:700}
h1{font-size:clamp(2.7rem,6vw,5.4rem);line-height:1.02;margin:18px 0 20px;letter-spacing:-.04em}
.hero p{font-size:1.18rem;color:#e5f3ff;max-width:720px}
.actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:28px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 18px;border-radius:12px;text-decoration:none;font-weight:800;border:1px solid transparent;cursor:pointer;font-size:1rem}
.btn-primary{background:var(--gold);color:#17243a}
.btn-secondary{border-color:rgba(255,255,255,.4);color:#fff;background:rgba(255,255,255,.08)}
.btn-blue{background:var(--blue);color:#fff}
.btn-light{background:#fff;color:var(--navy);border-color:#d9e4ef}
.hero-card{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);border-radius:24px;padding:26px;box-shadow:var(--shadow)}
.hero-card h3{margin-top:0;color:#fff}
.hero-card ul{padding-left:20px;margin-bottom:0;color:#edf7ff}
.section{padding:72px 0}
.section-alt{background:#eef6fd}
.section-title{max-width:760px;margin:0 auto 34px;text-align:center}
.section-title h2{font-size:clamp(2rem,4vw,3.2rem);line-height:1.1;margin:0 0 14px;color:var(--navy)}
.section-title p{color:var(--muted);font-size:1.08rem}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.card{background:#fff;border:1px solid #e1eaf3;border-radius:18px;padding:24px;box-shadow:0 10px 30px rgba(7,27,51,.08)}
.card .icon{font-size:2rem}
.card h3{color:var(--navy);margin:10px 0 8px}
.card p{color:var(--muted)}
.card a{font-weight:800;color:var(--blue);text-decoration:none}
.notice{border-left:5px solid var(--gold);background:#fff8e5;padding:16px 18px;border-radius:12px;margin:18px 0}
.tool-shell{background:#fff;border:1px solid #dce7f2;border-radius:20px;padding:26px;box-shadow:var(--shadow)}
.tool-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
label{display:block;font-weight:800;color:var(--navy);margin:0 0 7px}
input,textarea,select{width:100%;padding:12px 13px;border:1px solid #c9d7e6;border-radius:10px;background:#fff;font:inherit}
textarea{min-height:160px;resize:vertical}
.controls{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.output{background:#f5f9fd;border:1px solid #d8e5f1;border-radius:12px;padding:16px;min-height:150px;white-space:pre-wrap}
.page-hero{background:linear-gradient(135deg,var(--navy),var(--navy2));color:#fff;padding:64px 0}
.page-hero h1{font-size:clamp(2.2rem,5vw,4rem);margin:0 0 12px}
.page-hero p{max-width:760px;color:#dbeeff;font-size:1.1rem}
.status{display:inline-flex;align-items:center;gap:8px;padding:7px 10px;border-radius:999px;font-size:.88rem;font-weight:800;background:#e9f8f1;color:var(--success)}
.status.pending{background:#fff3d8;color:#7a5a13}
.footer{background:var(--navy);color:#d8e7f4;padding:48px 0 24px}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:28px}
.footer a{color:#fff;text-decoration:none}
.small{font-size:.9rem;color:#6f7e90}
.demo-badge{display:inline-block;background:#fff3d8;color:#6e520b;padding:6px 10px;border-radius:999px;font-size:.82rem;font-weight:800}
.camera-preview{width:100%;max-height:360px;object-fit:contain;border-radius:12px;border:1px solid #d8e5f1;background:#f4f7fb;display:none}
.alert-card{border-left:5px solid var(--danger)}
@media(max-width:900px){.hero-grid,.tool-grid,.footer-grid{grid-template-columns:1fr}.grid{grid-template-columns:1fr 1fr}.navlinks{display:none}}
@media(max-width:620px){.grid{grid-template-columns:1fr}.hero{padding-top:62px}.section{padding:54px 0}.btn{width:100%}.topbar .container{justify-content:center}.nav{min-height:68px}.brand{font-size:1.15rem}}


/* HeartTranslate visual homepage v2 */
.topbar a{color:#fff;text-decoration:none}
.theme-hero{
  background:
    radial-gradient(circle at 85% 8%,rgba(216,171,78,.18),transparent 26%),
    linear-gradient(135deg,#f8f4ea 0%,#eef6fd 54%,#f8fbff 100%);
  padding:46px 0 64px;
  border-bottom:1px solid #dfe9f3;
}
.theme-hero-grid{
  display:grid;
  grid-template-columns:minmax(0,1.03fr) minmax(360px,.97fr);
  gap:46px;
  align-items:center;
}
.hero-art{
  position:relative;
  background:#111;
  padding:9px;
  border:2px solid var(--gold);
  border-radius:24px;
  box-shadow:0 28px 70px rgba(7,27,51,.25);
  overflow:hidden;
}
.hero-art img{
  display:block;
  width:100%;
  height:auto;
  border-radius:16px;
}
.hero-art-cta{
  display:block;
  margin:10px 0 0;
  padding:14px 18px;
  border-radius:12px;
  background:var(--gold);
  color:#17243a;
  font-weight:900;
  text-align:center;
  text-decoration:none;
}
.eyebrow.dark{
  color:#654b0b;
  border-color:rgba(101,75,11,.22);
  background:#fff5db;
}
.hero-intro h1{
  color:var(--navy);
  font-size:clamp(2.7rem,5.3vw,5rem);
  margin:18px 0;
}
.hero-lead{
  color:#40536b;
  font-size:1.17rem;
  max-width:650px;
}
.quick-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:13px;
  margin-top:28px;
}
.quick-action{
  display:grid;
  grid-template-columns:auto 1fr;
  column-gap:11px;
  align-items:center;
  padding:15px;
  background:#fff;
  border:1px solid #d8e4ef;
  border-radius:15px;
  text-decoration:none;
  box-shadow:0 9px 22px rgba(7,27,51,.07);
}
.quick-action span{
  grid-row:1/3;
  font-size:1.65rem;
}
.quick-action strong{color:var(--navy);line-height:1.15}
.quick-action small{color:var(--muted);line-height:1.3}
.quick-action.primary{background:var(--navy);border-color:var(--navy)}
.quick-action.primary strong,.quick-action.primary small{color:#fff}
.quick-action.alert{border-left:5px solid var(--danger)}
.trust-line{
  margin-top:20px;
  padding:13px 15px;
  border-left:4px solid var(--gold);
  background:rgba(255,255,255,.7);
  color:#5c6673;
  border-radius:10px;
  font-size:.93rem;
}
.need-now{padding:72px 0;background:#fff}
.section-kicker{
  display:inline-block;
  color:#8a671a;
  font-size:.86rem;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  margin-bottom:9px;
}
.section-kicker.light{color:#f2c968}
.need-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:18px;
}
.need-card{
  display:block;
  text-decoration:none;
  background:#f8fbff;
  border:1px solid #dfe9f3;
  border-radius:18px;
  padding:23px;
  transition:transform .2s ease,box-shadow .2s ease;
}
.need-card:hover{
  transform:translateY(-3px);
  box-shadow:0 16px 32px rgba(7,27,51,.10);
}
.need-card h3{color:var(--navy);margin:10px 0 7px}
.need-card p{color:var(--muted);margin:0}
.need-card.emergency{border-top:5px solid var(--danger)}
.current-standard{
  color:#fff;
  background:
    radial-gradient(circle at 90% 20%,rgba(121,199,255,.22),transparent 24%),
    linear-gradient(135deg,#06162b,#0c3158);
}
.current-grid{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:42px;
  align-items:center;
}
.current-standard h2{
  font-size:clamp(2.2rem,4.2vw,3.7rem);
  line-height:1.08;
  margin:0 0 18px;
}
.current-standard p{color:#dcecff;font-size:1.08rem}
.verification-card{
  padding:25px;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.09);
  border-radius:19px;
}
.verification-card h3{margin-top:0}
.verification-card li{margin:9px 0;color:#e9f4ff}
.pass-preview{background:#f8f4ea}
.pass-box{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
  padding:34px;
  background:#fff;
  border:1px solid #eadcb8;
  border-radius:22px;
  box-shadow:var(--shadow);
}
.pass-box h2{color:var(--navy);margin:4px 0 10px;line-height:1.15}
.pass-box p{color:var(--muted);max-width:760px}
.footer-brand{color:#fff}
.footer-note{color:#b9cadd}

@media(max-width:1000px){
  .theme-hero-grid,.current-grid{grid-template-columns:1fr}
  .hero-art{max-width:780px;margin:auto}
  .hero-intro{text-align:center}
  .hero-lead{margin-left:auto;margin-right:auto}
  .need-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:700px){
  .theme-hero{padding:24px 0 48px}
  .theme-hero-grid{gap:28px}
  .hero-art{padding:5px;border-radius:16px}
  .hero-art img{border-radius:11px}
  .hero-intro h1{font-size:clamp(2.35rem,12vw,3.6rem)}
  .quick-actions,.need-grid{grid-template-columns:1fr}
  .pass-box{display:block;padding:25px}
  .pass-box .btn{margin-top:16px}
}


/* Warm readable palette update for older travelers - v3 */
body{
  background:#f3ecdf;
  color:#132132;
  font-size:17px;
}
.header{
  background:rgba(248,243,234,.97);
  border-bottom:1px solid #e6d9c0;
}
.language-select,
input,textarea,select{
  font-size:1rem;
}
.section-alt{
  background:#eee2cf;
}
.card{
  background:#fffaf3;
  border:1px solid #e4d6bc;
}
.tool-shell{
  background:#fffaf3;
  border:1px solid #dfd1b7;
}
.output{
  background:#fbf5ea;
  border:1px solid #dccfb8;
}
.theme-hero{
  background:
    radial-gradient(circle at 85% 8%,rgba(216,171,78,.18),transparent 26%),
    linear-gradient(135deg,#f1e7d8 0%,#eadcc8 54%,#f5ede2 100%);
  border-bottom:1px solid #e3d4bb;
}
.hero-lead,
.section-title p,
.card p,
.need-card p,
.pass-box p,
.current-standard p,
.page-hero p{
  font-size:1.12rem;
}
.quick-action{
  background:#fffaf3;
  border:1px solid #dbcdb6;
}
.trust-line{
  background:rgba(255,250,243,.92);
  color:#4c5968;
}
.need-now{
  background:#f7f0e3;
}
.need-card{
  background:#fffaf3;
  border:1px solid #e1d4bd;
}
.pass-preview{
  background:#efe3cf;
}
.pass-box{
  background:#fffaf3;
  border:1px solid #e1d1b0;
}
.notice{
  background:#fff4dc;
}
.footer{
  background:#081b32;
}
@media(max-width:700px){
  body{font-size:18px;}
}


/* Final homepage start controls: translation first */
.topbar a{font-size:1rem;font-weight:800}
.navlinks a{font-size:1.02rem}
.home-start{background:#fff;border-bottom:1px solid #dbe6f1;padding:24px 0}
.home-start-heading{display:flex;align-items:baseline;gap:14px;margin-bottom:14px;color:var(--navy)}
.home-start-heading strong{font-size:1.15rem;letter-spacing:.06em}
.home-start-heading span{font-size:1.02rem;color:var(--muted)}
.home-start-grid{display:grid;grid-template-columns:minmax(240px,.85fr) 1fr 1fr;gap:14px}
.home-language-card,.home-tool-button{min-height:112px;border-radius:18px;padding:18px 20px;box-shadow:0 10px 28px rgba(7,27,51,.10)}
.home-language-card{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:center;background:#fff8e8;border:2px solid var(--gold)}
.home-language-card label{font-size:1.08rem;margin-bottom:6px}
.home-language-select{min-height:52px;font-size:1.08rem;font-weight:800;border:2px solid #b9cce0}
.home-tool-button{display:flex;align-items:center;gap:16px;text-decoration:none;color:#fff;border:2px solid transparent}
.home-tool-button.voice{background:linear-gradient(135deg,#0b315a,#1f7ae0);border-color:#1f7ae0}
.home-tool-button.scan{background:linear-gradient(135deg,#071b33,#0c416f);border-color:var(--gold)}
.home-start-icon{font-size:2.35rem;line-height:1}
.home-tool-button strong{display:block;font-size:1.34rem;line-height:1.1;letter-spacing:.01em}
.home-tool-button small{display:block;margin-top:6px;font-size:1rem;color:#eef7ff}
@media(max-width:900px){.home-start-grid{grid-template-columns:1fr}.home-start-heading{display:block}.home-start-heading span{display:block;margin-top:4px}.home-language-card,.home-tool-button{min-height:96px}.nav{flex-wrap:wrap;padding:8px 0}.header .language-select{max-width:190px}}
@media(max-width:620px){.home-start{padding:16px 0}.home-start-heading span{font-size:.95rem}.home-language-card,.home-tool-button{padding:16px;min-height:88px}.home-tool-button strong{font-size:1.2rem}.home-start-icon{font-size:2rem}}/* Clean desktop top navigation */
@media(min-width:901px){
  .nav{
    display:grid;
    grid-template-columns:auto 1fr auto;
    gap:24px;
    min-height:78px;
  }

  .navlinks{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:18px;
    flex-wrap:nowrap;
  }

  .navlinks a{
    white-space:nowrap;
    font-size:.92rem;
  }

  .header .language-select{
    width:150px;
  }
}
