:root{
  --navy:#14263D;
  --navy2:#203652;
  --ink:#213348;
  --muted:#596C80;
  --cream:#F6F8FB;
  --white:#fff;
  --line:#E1E7EF;
  --accent:#336A96;
  --blue:#5B86B0;
  --mint:#dff5e9;
  --pink:#f8dfe8;
  --shadow:0 24px 70px rgba(25,32,55,.12);
  --radius:26px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:"DM Sans",ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:var(--ink);
  background:var(--cream);
  line-height:1.5;
}
button,input,select,textarea{font:inherit}

/* Refreshed site-wide typography and accessible slate-blue brand palette */
h1,h2,h3,h4,.brand-wordmark,.contact-email,.pv-score2{
  font-family:"Manrope","DM Sans",ui-sans-serif,system-ui,sans-serif;
}
h1,h2,h3,h4{font-weight:800;text-wrap:balance}
p{font-weight:400}
.desktop-nav a,.nav-link-btn,.nav-cta,.primary-btn,.secondary-btn,
.side-nav button,.contact-button{font-family:"DM Sans",ui-sans-serif,system-ui,sans-serif}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:3px solid #336A96;outline-offset:3px;
}

button{cursor:pointer}
a{text-decoration:none;color:inherit}
.hidden{display:none!important}

.site-nav{
  height:78px;
  padding:0 6vw;
  display:flex;
  align-items:center;
  justify-content:space-between;
  background:rgba(248,246,241,.9);
  backdrop-filter:blur(18px);
  border-bottom:1px solid rgba(232,229,223,.7);
  position:sticky;
  top:0;
  z-index:20;
}
.brand{display:flex;align-items:center;text-decoration:none}
.brand-wordmark{font-size:25px;font-weight:850;letter-spacing:-.045em;line-height:1;color:#14263D}
.brand-wordmark b{font-weight:850;color:#336A96}
.desktop-nav{display:flex;gap:30px;color:#61758A;font-size:14px}
.desktop-nav a:hover{color:var(--ink)}
.auth-actions{display:flex;align-items:center;gap:18px}
.nav-link-btn,.nav-cta,.secondary-btn,.primary-btn{
  border:0;
  border-radius:14px;
  padding:12px 20px;
  font-weight:700;
}
.nav-link-btn{background:none;color:var(--ink)}
.nav-cta,.primary-btn{background:var(--navy);color:#fff}
.nav-cta{padding:11px 18px}
.primary-btn{box-shadow:0 12px 30px rgba(16,23,42,.16)}
.primary-btn b{margin-left:14px}
.secondary-btn{background:#fff;border:1px solid var(--line);color:var(--ink)}
.full{width:100%;justify-content:center}

.hero{
  min-height:680px;
  padding:80px 6vw 70px;
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:center;
  gap:50px;
  overflow:hidden;
}
.hero-copy{max-width:650px}
.eyebrow{
  text-transform:uppercase;
  letter-spacing:.16em;
  font-size:11px;
  font-weight:800;
  color:#63788B;
  margin-bottom:20px;
}
.eyebrow-dot{
  display:inline-block;
  width:7px;height:7px;border-radius:50%;
  background:var(--accent);
  margin-right:8px;
}
.hero h1{
  margin:0;
  font-size:clamp(48px,6vw,82px);
  line-height:.98;
  letter-spacing:-.052em;
  color:var(--navy);
}
.hero h1 span,.section h2 span,.preview-section h2 span,.feature-copy h2 span,.vision-inner h2 span,.final-cta h2 span{
  color:var(--accent);
}
.hero-lead{
  max-width:570px;
  margin:28px 0;
  color:var(--muted);
  font-size:18px;
  line-height:1.7;
}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap}
.hero-trust{margin-top:25px;color:#607184;font-size:12px;display:flex;gap:17px;flex-wrap:wrap}
.hero-trust span{color:#4b9a6d;font-weight:900}

.hero-stage{
  min-height:510px;
  position:relative;
  border-radius:42px;
  background:
    radial-gradient(circle at 90% 5%,rgba(51,106,150,.14),transparent 32%),
    radial-gradient(circle at 5% 95%,rgba(92,202,153,.16),transparent 30%),
    linear-gradient(145deg,#EAF3FA,#EFF5FA 58%,#F6F9FC);
  overflow:hidden;
  box-shadow:var(--shadow);
  padding:24px;
}
.orb{position:absolute;border-radius:50%;filter:blur(1px);pointer-events:none}
.orb-one{width:250px;height:250px;background:#CBE0F1;top:-135px;right:-70px;opacity:.75}
.orb-two{width:210px;height:210px;background:#DAEAF5;bottom:-125px;left:-80px;opacity:.75}

.hero-panel{
  position:relative;
  z-index:2;
  height:100%;
  min-height:462px;
  padding:22px;
  border:1px solid rgba(255,255,255,.8);
  border-radius:28px;
  background:rgba(255,255,255,.66);
  backdrop-filter:blur(18px);
  box-shadow:0 20px 55px rgba(42,48,78,.09);
}
.hero-panel-top{
  display:flex;
  justify-content:space-between;
  align-items:center;
  color:#7d8494;
  font-size:9px;
  font-weight:900;
  letter-spacing:.13em;
}
.hero-live{
  color:#4c9b70;
  display:flex;
  align-items:center;
  gap:6px;
}
.hero-live i,.hero-panel-footer i{
  width:6px;height:6px;border-radius:50%;
  display:inline-block;background:#54a777;
}
.journey-route{
  display:grid;
  grid-template-columns:1fr 1.4fr 1fr;
  align-items:center;
  gap:14px;
  margin:28px 0 12px;
}
.journey-place small{
  display:block;
  font-size:8px;
  color:#9ba1ae;
  font-weight:900;
  letter-spacing:.12em;
}
.journey-place strong{
  display:block;
  color:var(--navy);
  font-size:22px;
  letter-spacing:-.04em;
  margin-top:4px;
}
.journey-place span{
  display:block;
  color:#8a91a0;
  font-size:10px;
  margin-top:2px;
}
.journey-place.right{text-align:right}
.journey-path{
  display:flex;
  align-items:center;
  gap:7px;
}
.route-dot{
  width:8px;height:8px;border-radius:50%;
  background:var(--accent);
  flex:none;
}
.route-dash{
  height:1px;
  flex:1;
  border-top:2px dashed rgba(117,103,248,.35);
}
.journey-path b{
  width:34px;height:34px;border-radius:12px;
  display:grid;place-items:center;
  background:#E6F0F8;color:var(--accent);
  font-size:16px;
  transform:rotate(8deg);
  box-shadow:0 8px 20px rgba(51,106,150,.14);
}
.journey-date{
  display:flex;
  justify-content:space-between;
  padding:10px 12px;
  border-radius:11px;
  background:rgba(247,246,242,.85);
  color:#7d8492;
  font-size:9px;
  font-weight:800;
}
.journey-date span:first-child{color:var(--navy);letter-spacing:.08em}
.hero-insights{
  display:grid;
  gap:9px;
  margin-top:16px;
}
.insight-card{
  display:flex;
  align-items:center;
  gap:11px;
  padding:11px 12px;
  border:1px solid rgba(230,229,235,.9);
  border-radius:15px;
  background:rgba(255,255,255,.9);
}
.insight-icon{
  width:38px;height:38px;
  border-radius:11px;
  display:grid;place-items:center;
  flex:none;
}
.pet-icon{background:#E4EBF2}
.airline-icon{background:#DDEBF7;color:#336A96}
.docs-icon{background:#E5F0FA;color:#336A96}
.insight-card small{
  display:block;
  color:#969cab;
  font-size:7px;
  font-weight:900;
  letter-spacing:.1em;
}
.insight-card strong{
  display:block;
  color:var(--navy);
  font-size:11px;
  margin-top:2px;
}
.insight-card span{
  display:block;
  color:#89909e;
  font-size:8px;
  margin-top:2px;
}
.insight-check{
  margin-left:auto;
  width:22px;height:22px;border-radius:50%;
  display:grid;place-items:center;
  background:#e5f5eb;color:#4c9b70;
  font-size:11px;
}
.insight-arrow{
  margin-left:auto;
  color:#8d94a3;
  font-size:16px;
}
.hero-panel-footer{
  display:flex;
  justify-content:space-between;
  gap:10px;
  margin-top:14px;
  color:#8b92a0;
  font-size:8px;
}
.hero-panel-footer span:first-child{
  display:flex;
  align-items:center;
  gap:6px;
}


.proof-strip{
  margin:0 6vw;
  padding:23px 28px;
  background:#fff;
  border:1px solid var(--line);
  border-radius:22px;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:20px;
  box-shadow:0 10px 35px rgba(30,35,50,.05);
}
.proof-strip div{padding-right:20px;border-right:1px solid var(--line)}
.proof-strip div:last-child{border:0}
.proof-strip span{font-size:10px;color:var(--accent);font-weight:900;margin-right:10px}
.proof-strip strong{font-size:13px}
.proof-strip small{display:block;color:#858c9b;font-size:10px;margin-left:29px}

.section{padding:120px 6vw}
.section-intro{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:end;margin-bottom:55px}
.section h2,.preview-section h2{
  margin:0;
  color:var(--navy);
  font-size:clamp(40px,5vw,66px);
  line-height:1;
  letter-spacing:-.045em;
}
.section-intro>p,.preview-copy>p{color:var(--muted);max-width:470px;font-size:16px;line-height:1.8;margin:0 0 5px}
.flow-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.flow-grid article{position:relative;background:#fff;border:1px solid var(--line);padding:30px;border-radius:25px;min-height:260px}
.flow-grid em{position:absolute;right:25px;top:25px;font-style:normal;font-size:11px;color:#a0a6b2;font-weight:800}
.flow-icon{width:50px;height:50px;border-radius:15px;background:#EAF3FA;display:grid;place-items:center;font-size:23px;margin-bottom:28px}
.flow-grid h3{font-size:20px;margin:0 0 10px}
.flow-grid p{color:var(--muted);font-size:14px;line-height:1.7;margin:0}

.feature-band{
  background:var(--navy);
  color:#fff;
  padding:110px 10vw;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:90px;
  align-items:center;
}
.eyebrow.light{color:#aeb7cc}
.feature-copy h2,.vision-inner h2,.final-cta h2{
  margin:0;
  font-size:clamp(40px,5vw,64px);
  line-height:1;
  letter-spacing:-.045em;
}
.feature-copy h2 span{color:#A5D2F0}
.feature-copy>p{color:#aeb7c9;max-width:560px;line-height:1.8;margin:28px 0}
.feature-items{display:grid;gap:18px}
.feature-items>div{display:flex;gap:14px;align-items:flex-start}
.feature-items b{width:38px;height:38px;border-radius:12px;background:#24425F;display:grid;place-items:center;color:#A5D2F0}
.feature-items strong{display:block;font-size:14px}
.feature-items small{display:block;color:#8994ac;font-size:12px;margin-top:4px}
.feature-visual{display:flex;justify-content:center}
.mini-window{width:min(100%,430px);background:#fff;border-radius:25px;padding:22px;color:var(--ink);box-shadow:0 30px 70px rgba(0,0,0,.22)}
.mini-top{display:flex;justify-content:space-between;font-size:10px;font-weight:900;letter-spacing:.12em}
.ready{color:#4c9b70}
.mini-route{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;margin:28px 0;padding:20px;background:#F7F9FC;border-radius:18px}
.mini-route small{display:block;color:#9298a5;font-size:8px;font-weight:800}
.mini-route strong{display:block;margin-top:4px;font-size:20px}
.mini-route>span{color:var(--accent)}
.mini-result{display:flex;gap:12px;padding:15px;border:1px solid var(--line);border-radius:15px}
.result-icon{width:36px;height:36px;border-radius:11px;background:var(--mint);color:#438b64;display:grid;place-items:center;font-weight:900}
.mini-result strong{font-size:13px;display:block}
.mini-result small{font-size:10px;color:#7d8595}
.mini-bars{display:flex;gap:8px;margin-top:20px}
.mini-bars span{height:7px;border-radius:10px;background:#E4EBF2;flex:1}
.mini-bars span:first-child{flex:1.7;background:#AFCDE7}

.preview-section{padding:120px 6vw;display:grid;grid-template-columns:.75fr 1.25fr;gap:70px;align-items:center}
.preview-copy p{margin:28px 0}
.preview-image-wrap{position:relative}
.preview-image-wrap img{width:100%;display:block;border-radius:25px;box-shadow:var(--shadow);border:1px solid var(--line)}
.image-caption{position:absolute;bottom:15px;right:15px;padding:8px 12px;border-radius:10px;background:rgba(16,23,42,.85);color:#fff;font-size:10px}

.vision-section{background:#E0EDF7;padding:120px 6vw;text-align:center}
.vision-inner{max-width:820px;margin:auto}
.vision-inner h2 span{color:#336A96}
.vision-inner p{max-width:620px;margin:28px auto;color:#656c7d;line-height:1.8}
.vision-pills{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}
.vision-pills span{background:#fff;border:1px solid rgba(51,106,150,.14);padding:10px 16px;border-radius:999px;font-size:11px;font-weight:800}

.final-cta{padding:90px 6vw;display:flex;justify-content:space-between;align-items:center;gap:30px;background:#fff}
.final-cta h2 span{color:var(--accent)}
.final-cta p{color:var(--muted);margin:20px 0 0}

.contact-section{padding:85px 6vw;background:var(--cream)}
.contact-card{max-width:1240px;margin:auto;padding:clamp(28px,5vw,64px);background:#fff;border:1px solid var(--line);border-radius:30px;display:grid;grid-template-columns:1.3fr 1fr;align-items:center;gap:36px;box-shadow:0 18px 55px rgba(25,32,55,.07)}
.contact-section h2{margin:0;font-size:clamp(38px,4.7vw,60px);line-height:1.06;letter-spacing:-.045em;color:var(--navy)}
.contact-section h2 span{color:var(--accent)}
.contact-section p{color:var(--muted);font-size:16px;line-height:1.75;max-width:530px;margin:22px 0 0}
.contact-actions{display:flex;flex-direction:column;align-items:flex-start;gap:20px}
.contact-email{font-size:clamp(17px,2vw,24px);font-weight:750;color:var(--navy);overflow-wrap:anywhere}
.contact-email:hover{text-decoration:underline}
.contact-button{display:inline-flex;align-items:center}
@media(max-width:900px){.contact-card{grid-template-columns:1fr}}
@media(max-width:600px){.contact-section{padding:60px 20px}.contact-card{padding:30px 24px}.contact-actions{gap:18px}}

.view{display:none}
.view.active{display:block}

.dashboard-view{min-height:calc(100vh - 78px);background:#f4f5f8}
.dashboard-shell{display:grid;grid-template-columns:235px 1fr;min-height:calc(100vh - 78px)}
.dashboard-side{background:#11182b;color:#fff;padding:25px 18px;display:flex;flex-direction:column}
.dashboard-side .brand{margin:0 10px 40px}
.dashboard-side .brand img{filter:brightness(0) invert(1)}
.side-nav{display:grid;gap:7px}
.side-nav button{border:0;background:none;color:#aeb7c9;text-align:left;padding:12px;border-radius:12px}
.side-nav button.side-active,.side-nav button:hover{background:#252e46;color:#fff}
.side-nav span{margin-left:10px}
.logout-btn{margin-top:auto;background:none;border:1px solid #343d53;color:#aeb7c9;border-radius:12px;padding:11px}
.dashboard-main{padding:45px 5vw}
.dash-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px}
.dash-top h2{font-size:40px;letter-spacing:-.05em;margin:0}
.dash-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:18px}
.dash-card{background:#fff;border:1px solid #e6e7eb;border-radius:22px;padding:22px}
.dash-card h3{margin:0 0 15px}
.dash-card p{color:#607184;font-size:13px}
.pet-card{display:flex;align-items:center;gap:15px;background:#f8f7f4;padding:15px;border-radius:17px}
.pet-card .pet-avatar{width:55px;height:55px;border-radius:15px;background:#eee7df;display:grid;place-items:center;font-size:30px}
.trip-form{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.trip-form label,.form-row label{font-size:11px;color:#737b8b;font-weight:800}
.trip-form input,.trip-form select,.modal-box input,.modal-box select{display:block;width:100%;border:1px solid #dddfe5;border-radius:11px;padding:12px;margin-top:6px;background:#fff;outline:none}
.trip-form .primary-btn{margin-top:22px;grid-column:1/-1}
.result-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.result-card{border:1px solid #e6e7eb;border-radius:17px;padding:16px}
.result-card .result-head{display:flex;justify-content:space-between;gap:8px}
.result-card h4{margin:0;font-size:13px}
.result-card p{margin:8px 0 0;font-size:11px;line-height:1.6}
.status{font-size:9px;font-weight:800;padding:5px 8px;border-radius:99px;background:#eaf6ef;color:#4d8f68}
.status.pending{background:#fff4df;color:#a27632}
.timeline{display:grid;gap:10px}
.timeline-item{display:flex;gap:12px;align-items:flex-start}
.timeline-dot{width:9px;height:9px;background:var(--accent);border-radius:50%;margin-top:5px}
.timeline-item strong{font-size:12px;display:block}
.timeline-item small{color:#808796;font-size:10px}
.service-list{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.service{padding:13px;border-radius:15px;background:#f7f7f5}
.service strong{font-size:12px;display:block}
.service small{color:#858c99;font-size:10px}

.modal{position:fixed;inset:0;background:rgba(11,17,30,.58);display:grid;place-items:center;padding:20px;z-index:100}
.modal-box{width:min(100%,450px);background:#fff;border-radius:25px;padding:32px;position:relative;box-shadow:0 30px 90px rgba(0,0,0,.25)}
.modal-box h2{font-size:32px;letter-spacing:-.04em;margin:0}
.modal-box>p{color:var(--muted);font-size:13px}
.modal-close{position:absolute;right:18px;top:16px;border:0;background:#f2f2f2;width:32px;height:32px;border-radius:50%;font-size:20px}
.modal-box form{display:grid;gap:14px;margin-top:25px}
.modal-box label{font-size:12px;font-weight:800;color:#535b6c}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.notice{font-size:12px;color:#c45e70;min-height:18px}
.switch-btn{border:0;background:none;color:var(--accent);font-size:12px;font-weight:700;margin-top:16px}

@media(max-width:900px){
  .desktop-nav{display:none}
  .hero,.feature-band,.preview-section,.section-intro{grid-template-columns:1fr}
  .hero{padding-top:55px}
  .hero-stage{min-height:470px}
  .proof-strip{grid-template-columns:1fr 1fr}
  .proof-strip div:nth-child(2){border:0}
  .flow-grid{grid-template-columns:1fr}
  .dash-grid{grid-template-columns:1fr}
  .result-grid{grid-template-columns:1fr}
  .dashboard-shell{grid-template-columns:1fr}
  .dashboard-side{display:none}
}
@media(max-width:600px){
  .site-nav{padding:0 20px}
  .auth-actions .nav-link-btn{display:none}
  .hero,.section,.preview-section,.feature-band,.vision-section,.final-cta{padding-left:20px;padding-right:20px}
  .hero h1{font-size:49px}
  .hero-stage{min-height:520px;border-radius:25px;padding:14px}
  .hero-panel{padding:17px;min-height:490px}
  .journey-route{grid-template-columns:.8fr 1.1fr .8fr;gap:8px}
  .journey-place strong{font-size:17px}
  .journey-place span{font-size:8px}
  .journey-date{font-size:8px}
  .hero-panel-footer{display:block}
  .hero-panel-footer span{margin-top:4px}

  .proof-strip{margin:0 20px;grid-template-columns:1fr}
  .proof-strip div{border:0;border-bottom:1px solid var(--line);padding-bottom:12px}
  .feature-band{gap:45px}
  .final-cta{display:block}
  .final-cta .primary-btn{margin-top:30px}
  .trip-form{grid-template-columns:1fr}
}
