/* Travita — shared service-page styling.
   Every page sets --ac / --ac2 / --dp / --dp2 for its own sector colour. */
:root{
  --ink:#0b2419; --green:#0f2e22; --green-2:#12392b; --green-3:#17251e;
  --cream:#f6f2ea; --gold:#d9a441; --gold-3:#e5b95f;
  --muted:#5c6b62; --soft:#7fa895; --line:#e5e0d5; --hair:#efe9db;
  --on-dark:#b9d3c6; --on-dark-2:#8fb4a0;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#fff;color:var(--green-3);
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit}
img,svg{max-width:100%}
.wrap{max-width:1180px;margin:0 auto;padding:0 24px}
.wrap.narrow{max-width:880px}
.center{text-align:center}
.rv{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s ease}
.rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}}

/* header */
header.site{position:sticky;top:0;z-index:100;background:rgba(11,36,25,.93);
  backdrop-filter:saturate(160%) blur(10px);-webkit-backdrop-filter:saturate(160%) blur(10px);
  border-bottom:1px solid rgba(255,255,255,.09)}
.hdr{max-width:1180px;margin:0 auto;padding:11px 24px;display:flex;align-items:center;gap:20px}
.brand{display:flex;align-items:center;gap:9px;text-decoration:none;margin-inline-end:auto}
.brand svg{width:32px;height:32px;border-radius:9px;flex-shrink:0}
.wm{font-weight:800;font-size:21px;line-height:1;color:#fff}
.wm .tra{color:var(--gold)}
nav.main{display:flex;align-items:center;gap:21px}
nav.main a{font-size:14.5px;font-weight:600;text-decoration:none;color:#dcefe4;opacity:.86;white-space:nowrap}
nav.main a:hover{opacity:1;color:var(--gold-3)}
.nav-cta{background:var(--gold);color:#231806 !important;padding:9px 17px;border-radius:999px;opacity:1 !important}
.nav-cta:hover{background:var(--gold-3)}
.burger{display:none;width:40px;height:40px;border-radius:10px;border:1px solid rgba(255,255,255,.2);
  background:transparent;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0}
.burger span,.burger span::before,.burger span::after{display:block;width:18px;height:2px;background:#fff;position:relative;transition:.2s}
.burger span::before,.burger span::after{content:'';position:absolute;left:0}
.burger span::before{top:-6px}.burger span::after{top:6px}
header.site.open .burger span{background:transparent}
header.site.open .burger span::before{transform:rotate(45deg) translate(4px,4px)}
header.site.open .burger span::after{transform:rotate(-45deg) translate(4px,-4px)}
nav.mob{display:none;flex-direction:column;padding:2px 24px 16px}
nav.mob a{font-size:15.5px;font-weight:600;text-decoration:none;color:#dcefe4;padding:13px 4px;border-bottom:1px solid rgba(255,255,255,.09)}
@media(max-width:980px){nav.main{display:none}.burger{display:flex}header.site.open nav.mob{display:flex}}

/* sector hero */
.shero{position:relative;background:linear-gradient(150deg,var(--dp),var(--dp2));color:#fff;overflow:hidden}
.sart{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.5}
.shero-in{position:relative;z-index:1;max-width:1180px;margin:0 auto;padding:26px 24px 62px}
.crumb{font-size:13px;color:rgba(255,255,255,.7);margin-bottom:26px}
.crumb a{text-decoration:none;opacity:.85}.crumb a:hover{opacity:1;text-decoration:underline}
.crumb span{opacity:.45;margin:0 5px}.crumb b{color:#fff}
.kick{display:inline-block;font-size:11.5px;font-weight:700;letter-spacing:1.4px;text-transform:uppercase;
  color:#fff;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.32);
  padding:6px 14px;border-radius:999px;margin-bottom:18px}
.shero h1{font-size:clamp(29px,4.6vw,48px);line-height:1.12;letter-spacing:-1px;margin:0 0 16px;max-width:17ch;color:#fff}
.shero .lede{font-size:clamp(16px,2vw,19px);color:rgba(255,255,255,.9);max-width:62ch;margin:0 0 26px}
.btns{display:flex;gap:11px;flex-wrap:wrap}
.btns.center-b{justify-content:center}
.btn{display:inline-block;padding:13px 26px;border-radius:999px;text-decoration:none;font-weight:700;
  font-size:15px;border:1px solid transparent;cursor:pointer;font-family:inherit}
.btn-a{background:var(--ac);color:#04140f}
.btn-a:hover{background:var(--ac2)}
.btn-o{background:transparent;color:#fff;border-color:rgba(255,255,255,.4)}
.btn-o:hover{background:rgba(255,255,255,.1);border-color:#fff}

/* sector switcher */
.secnav{background:var(--ink);border-bottom:1px solid rgba(255,255,255,.08);overflow-x:auto}
.secnav .wrap{display:flex;align-items:center;gap:16px;padding-top:11px;padding-bottom:11px;white-space:nowrap}
.secnav span{font-size:11px;font-weight:700;letter-spacing:1.1px;text-transform:uppercase;color:var(--on-dark-2)}
.secnav a{font-size:14px;font-weight:600;color:#dcefe4;text-decoration:none;opacity:.75}
.secnav a:hover{opacity:1}
.secnav a.on{color:var(--ac2);opacity:1;border-bottom:2px solid var(--ac2);padding-bottom:2px}

/* sections */
section{padding:64px 0}
section.alt{background:var(--cream)}
section.dark{background:var(--green);color:#fff}
.eyebrow{font-size:11.5px;font-weight:700;letter-spacing:1.3px;text-transform:uppercase;color:var(--ac);margin:0 0 10px}
section.dark .eyebrow{color:var(--ac2)}
h2{font-size:clamp(23px,3.2vw,33px);line-height:1.18;letter-spacing:-.5px;color:var(--green);margin:0 0 12px}
section.dark h2{color:#fff}
.sub{color:var(--muted);max-width:64ch;margin:0 0 34px;font-size:16.5px}
section.dark .sub{color:var(--on-dark)}
.prose p{margin:0 0 16px;font-size:16.5px;color:#3d4a43}

/* two options */
.ogrid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
@media(max-width:840px){.ogrid{grid-template-columns:1fr}}
.opt{background:#fff;border:1px solid var(--line);border-radius:18px;padding:28px;position:relative}
.opt-hi{border:2px solid var(--ac);box-shadow:0 10px 34px rgba(0,0,0,.08)}
.otag{display:inline-block;font-size:11px;font-weight:700;letter-spacing:1.1px;text-transform:uppercase;
  color:#04140f;background:var(--ac);padding:5px 12px;border-radius:999px;margin-bottom:14px}
.opt:not(.opt-hi) .otag{background:var(--green);color:#fff}
.opt h3{font-size:22px;margin:0 0 4px;color:var(--green)}
.oprice{font-size:14px;font-weight:700;color:var(--ac);margin:0 0 14px}
.opt:not(.opt-hi) .oprice{color:var(--muted)}
.obody{font-size:15px;color:#4a5751;margin:0 0 18px}
.opts{list-style:none;margin:0 0 22px;padding:0}
.opts li{display:flex;gap:10px;align-items:flex-start;margin-bottom:10px;font-size:14.5px;color:#3d4a43}
.tick{width:20px;height:20px;border-radius:50%;background:rgba(0,0,0,.06);color:var(--ac);
  display:flex;align-items:center;justify-content:center;font-size:11px;flex-shrink:0;margin-top:2px;font-weight:700}
.opt .btn{width:100%;text-align:center}
.opt .btn-o{color:var(--green);border-color:var(--line)}
.opt .btn-o:hover{background:var(--cream);border-color:var(--green)}

/* steps */
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:22px}
.step{display:flex;gap:14px;align-items:flex-start}
.sn{width:34px;height:34px;border-radius:11px;background:var(--ac);color:#04140f;font-weight:800;
  font-size:15px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.step h3{font-size:16.5px;margin:0 0 5px;color:var(--green)}
.step p{font-size:14.5px;color:#4a5751;margin:0}

/* why */
.wgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px}
.wcard{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);border-radius:15px;padding:22px}
.wcard h3{font-size:17px;color:#fff;margin:0 0 7px}
.wcard p{font-size:14.5px;color:var(--on-dark);margin:0}

/* know list */
.klist{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:700px){.klist{grid-template-columns:1fr}}
.klist li{display:flex;gap:11px;align-items:flex-start;background:#fff;border:1px solid var(--line);
  border-radius:12px;padding:14px 16px;font-size:14.5px;color:#3d4a43}

/* deliverables accordion */
.dllist{display:grid;gap:12px}
.dl{background:#fff;border:1px solid var(--line);border-radius:15px;padding:20px 22px;transition:.15s}
.dl.open{border-color:var(--ac);box-shadow:0 8px 26px rgba(0,0,0,.07)}
.dl-head{width:100%;display:flex;align-items:center;gap:12px;background:none;border:0;padding:0;
  cursor:pointer;font-family:inherit;text-align:start}
.dl-head h3{font-size:18px;margin:0;flex:1;color:var(--green)}
.dl-cv{font-size:21px;color:var(--ac);transition:transform .2s;line-height:1}
.dl.open .dl-cv{transform:rotate(45deg)}
.dl-sum{font-size:14.5px;color:var(--muted);margin:6px 0 0}
.dl-body{max-height:0;overflow:hidden;transition:max-height .3s ease}
.dl.open .dl-body{max-height:460px}
.dl-body .in{padding-top:14px;margin-top:14px;border-top:1px solid var(--hair)}
.dl-body p{margin:0;font-size:15px;color:#3d4a43}

/* directory */
.dgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:18px}
.dcard{background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;transition:.16s}
.dcard:hover{border-color:var(--ac);transform:translateY(-3px);box-shadow:0 10px 28px rgba(0,0,0,.09)}
.dart{height:118px;background:linear-gradient(140deg,var(--dp),var(--dp2))}
.din{padding:18px}
.drow{display:flex;align-items:center;gap:10px}
.drow b{font-size:16.5px;color:var(--green);flex:1}
.dstars{color:var(--ac);font-size:13px;letter-spacing:1px}
.dloc{display:block;font-size:12.5px;color:var(--muted);margin-top:2px}
.dtags{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0}
.dtags span{font-size:11.5px;color:var(--green);background:var(--cream);border:1px solid var(--line);
  padding:4px 9px;border-radius:99px}
.din p{font-size:14px;color:#4a5751;margin:0 0 14px}
.dbtn{background:none;border:0;padding:0;font-family:inherit;font-size:14px;font-weight:700;
  color:var(--ac);cursor:pointer}
.dbtn:hover{text-decoration:underline}
.dnote{margin-top:22px;background:#fff;border:1px solid var(--line);border-inline-start:3px solid var(--ac);
  border-radius:13px;padding:20px 22px}
.dnote p{margin:0 0 14px;font-size:15px;color:#3d4a43}

/* app */
.appsec{background:linear-gradient(150deg,var(--ink),var(--green) 60%,var(--green-2));color:#fff}
.appsec h2{color:#fff}.appsec .sub{color:var(--on-dark)}.appsec .eyebrow{color:var(--ac2)}
.agrid{display:grid;grid-template-columns:1.15fr .85fr;gap:44px;align-items:center}
@media(max-width:840px){.agrid{grid-template-columns:1fr;gap:28px}}
.alist{list-style:none;margin:0 0 24px;padding:0}
.alist li{display:flex;gap:11px;align-items:flex-start;margin-bottom:11px;font-size:15px;color:var(--on-dark)}
.alist .tick{background:rgba(255,255,255,.12);color:var(--ac2)}
.aphone{display:flex;justify-content:center}
.scr{width:230px;border-radius:26px;background:#0a1c14;border:8px solid rgba(255,255,255,.14);padding:16px 14px 20px}
.sbar{height:5px;width:60px;border-radius:99px;background:rgba(255,255,255,.25);margin:0 auto 18px}
.srow{display:flex;align-items:center;gap:8px;margin-bottom:14px}
.srow b{font-size:14px;color:#fff;flex:1}
.srow span{font-size:11px;color:#04140f;background:var(--ac);padding:3px 9px;border-radius:99px;font-weight:700}
.sline{height:9px;border-radius:99px;background:rgba(255,255,255,.13);margin-bottom:8px}
.sline.sh{width:68%}
.srow2{display:flex;justify-content:space-between;align-items:center;margin:18px 0 14px;
  padding-top:14px;border-top:1px solid rgba(255,255,255,.1)}
.srow2 span{font-size:11.5px;color:var(--on-dark-2)}
.srow2 b{font-size:13px;color:#fff}
.sbtn{text-align:center;background:var(--ac);color:#04140f;font-size:12.5px;font-weight:700;
  padding:10px;border-radius:10px}

/* faq */
.fqlist{display:grid;gap:10px}
.fq{background:#fff;border:1px solid var(--line);border-radius:13px;padding:16px 20px}
.fq.open{border-color:var(--ac)}
.fq-head{width:100%;display:flex;align-items:center;gap:12px;background:none;border:0;padding:0;
  cursor:pointer;font-family:inherit;text-align:start;font-size:16px;font-weight:600;color:var(--green)}
.fq-head span:first-child{flex:1}
.fq-cv{font-size:20px;color:var(--ac);transition:transform .2s;line-height:1}
.fq.open .fq-cv{transform:rotate(45deg)}
.fq-body{max-height:0;overflow:hidden;transition:max-height .3s ease}
.fq.open .fq-body{max-height:300px}
.fq-body .in{padding-top:12px}
.fq-body p{margin:0;font-size:15px;color:#4a5751}

/* final cta */
.cta-sec{background:var(--cream);border-top:1px solid var(--line)}

/* footer */
footer.site{background:var(--ink);color:#cfe8db}
.f-top{max-width:1180px;margin:0 auto;padding:52px 24px 30px;display:grid;grid-template-columns:1.7fr 1fr 1fr 1fr;gap:32px}
@media(max-width:860px){.f-top{grid-template-columns:1fr 1fr}.f-top>div:first-child{grid-column:1/-1}}
@media(max-width:500px){.f-top{grid-template-columns:1fr}}
.f-top h4{font-size:11.5px;text-transform:uppercase;letter-spacing:.7px;color:var(--soft);margin:0 0 13px}
.f-top ul{list-style:none;margin:0;padding:0}
.f-top li{margin-bottom:9px}
.f-top a{font-size:14px;color:#dcefe4;text-decoration:none;opacity:.88}
.f-top a:hover{opacity:1;text-decoration:underline}
.f-about{font-size:13.5px;color:var(--on-dark);margin:13px 0 0;max-width:40ch}
.f-legal{font-size:12.5px;color:var(--on-dark-2);margin:12px 0 0}
.f-bottom{border-top:1px solid rgba(255,255,255,.1);max-width:1180px;margin:0 auto;padding:16px 24px;
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:9px}
.f-bottom span,.f-bottom a{font-size:12.5px;color:var(--on-dark-2);text-decoration:none}
