/* ==========================================================
   TaksimTransfer V7.7.1 — UI polish / visual-error repair
   Keeps V7.7.0 reservation functionality intact.
   ========================================================== */

:root{
  --v771-blue:#0c7df0;
  --v771-blue2:#0669df;
  --v771-navy:#073b70;
  --v771-text:#123655;
  --v771-muted:#76889a;
  --v771-line:#d9e4ee;
  --v771-green:#1db969;
  --v771-shadow:0 14px 34px rgba(19,57,94,.08);
}

.tt760-page,.tt760-page *,.tt760-hero,.tt760-hero *{box-sizing:border-box}
.tt760-page{background:#f4f8fc!important;padding:18px 0 36px!important}
.tt760-page>.container,.tt760-hero>.container{
  width:min(1228px,calc(100% - 36px))!important;
  max-width:none!important;
  margin:0 auto!important;
  padding:0!important;
}

/* Hero */
.tt760-hero{margin:18px 0 0!important;padding:0!important;background:none!important}
.tt760-hero-inner{
  min-height:140px!important;
  border-radius:18px!important;
  padding:27px 31px!important;
  overflow:hidden!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 510px!important;
  gap:24px!important;
  align-items:center!important;
  background:
    linear-gradient(90deg,rgba(4,50,94,.98) 0%,rgba(6,76,145,.94) 55%,rgba(7,103,197,.78) 100%),
    url('/assets/img/reservation-v771/hero-clean.jpg') right center/cover no-repeat!important;
  color:#fff!important;
  box-shadow:0 10px 26px rgba(14,51,87,.09)!important;
}
.tt760-hero-inner:before,.tt760-hero-inner:after{display:none!important}
.tt760-hero-copy{max-width:600px!important}
.tt760-kicker{
  display:block!important;
  margin:0 0 9px!important;
  font-size:10.5px!important;
  font-weight:850!important;
  color:#fff!important;
}
.tt760-hero h1{
  margin:0 0 8px!important;
  font-size:31px!important;
  line-height:1.04!important;
  font-weight:850!important;
  letter-spacing:-.025em!important;
  color:#fff!important;
  white-space:nowrap!important;
}
.tt760-hero p{
  margin:0!important;
  font-size:12.5px!important;
  line-height:1.4!important;
  color:rgba(255,255,255,.92)!important;
}
.tt760-hero-benefits{
  display:grid!important;
  grid-template-columns:repeat(4,1fr)!important;
  gap:16px!important;
  margin:0!important;
  text-align:center!important;
}
.tt760-hero-benefits>div{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
}
.tt760-benefit-icon{
  width:38px!important;height:38px!important;
  margin:0 0 6px!important;
  border:2px solid rgba(255,255,255,.9)!important;
  border-radius:11px!important;
  display:grid!important;place-items:center!important;
  color:#fff!important;
  font-size:18px!important;
  background:transparent!important;
}
.tt760-hero-benefits b{
  display:block!important;
  font-size:8.8px!important;
  line-height:1.15!important;
  color:#fff!important;
  font-weight:800!important;
}
.tt760-hero-benefits small{display:none!important}

/* Layout */
.tt760-layout{
  display:grid!important;
  grid-template-columns:minmax(0,842px) 366px!important;
  gap:20px!important;
  align-items:start!important;
}

/* Main card */
.tt760-booking-card{
  background:#fff!important;
  border:1px solid #dce6ef!important;
  border-radius:18px!important;
  box-shadow:var(--v771-shadow)!important;
  overflow:hidden!important;
  min-width:0!important;
}

/* Stepper */
.tt760-booking-card .booking-progress{
  position:relative!important;
  display:grid!important;
  grid-template-columns:repeat(5,1fr)!important;
  gap:0!important;
  min-height:108px!important;
  margin:0!important;
  padding:20px 24px 15px!important;
  background:#fff!important;
  border:0!important;
  border-bottom:1px solid #e7edf3!important;
  overflow:visible!important;
}
.tt760-booking-card .booking-progress:after{
  content:""!important;
  position:absolute!important;
  left:9.5%!important;right:9.5%!important;top:42px!important;
  height:2px!important;background:#dce5ee!important;z-index:0!important;
}
.tt760-booking-card .booking-progress>div{
  position:relative!important;
  z-index:1!important;
  min-height:68px!important;
  padding:50px 2px 0!important;
  margin:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:#173d61!important;
  font-size:9.6px!important;
  line-height:1.15!important;
  font-weight:800!important;
  text-align:center!important;
  overflow:visible!important;
  white-space:normal!important;
}
.tt760-booking-card .booking-progress>div:before{
  position:absolute!important;
  top:4px!important;
  left:50%!important;
  transform:translateX(-50%)!important;
  width:40px!important;height:40px!important;
  display:grid!important;place-items:center!important;
  border:2px solid #ccd8e4!important;
  border-radius:50%!important;
  background:#fff!important;
  color:#365a7b!important;
  box-shadow:0 0 0 6px #fff!important;
  font-size:12px!important;
  font-weight:800!important;
}
.tt760-progress>div:nth-child(1):before{content:"1"!important}
.tt760-progress>div:nth-child(2):before{content:"2"!important}
.tt760-progress>div:nth-child(3):before{content:"3"!important}
.tt760-progress>div:nth-child(4):before{content:"4"!important}
.tt760-progress>div:nth-child(5):before{content:"5"!important}
.tt760-progress>div.active:before{
  background:var(--v771-blue)!important;
  border-color:var(--v771-blue)!important;
  color:#fff!important;
}
.tt760-progress>div.active{color:#064f98!important}
.tt760-progress>div.completed:before{
  content:"✓"!important;
  background:#eaf8f1!important;
  border-color:#8bd1b1!important;
  color:#168159!important;
}

/* Step content */
.tt760-booking-card .booking-step{
  display:none!important;
  margin:0!important;
  padding:23px 28px 27px!important;
  background:#fff!important;
}
.tt760-booking-card .booking-step.active{display:block!important}
.tt760-step-title{
  display:flex!important;
  align-items:center!important;
  gap:14px!important;
  margin:0 0 17px!important;
}
.tt760-step-icon{
  width:52px!important;height:52px!important;
  flex:0 0 52px!important;
  border:1px solid #d9e4ee!important;
  border-radius:14px!important;
  background:#f4f9ff!important;
  color:#0b72e7!important;
  display:grid!important;place-items:center!important;
  font-size:25px!important;
  font-weight:900!important;
}
.tt760-step-title h2{
  margin:0 0 4px!important;
  font-size:24px!important;
  line-height:1.08!important;
  color:#0b3f79!important;
  letter-spacing:-.02em!important;
}
.tt760-step-title p{
  margin:0!important;
  font-size:10px!important;
  color:#7b8da0!important;
}

/* Trip types */
.tt760-trip-types{
  display:grid!important;
  grid-template-columns:200px 200px 1fr!important;
  gap:14px!important;
  align-items:center!important;
  margin:0 0 18px!important;
}
.tt760-trip-types label{
  position:relative!important;
  min-height:45px!important;
  padding:0 15px!important;
  border:1px solid #d8e2ec!important;
  border-radius:10px!important;
  background:#f8fbfd!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  color:#173a5e!important;
  font-size:10px!important;
  font-weight:800!important;
}
.tt760-trip-types label:has(input:checked){
  background:linear-gradient(135deg,var(--v771-blue),var(--v771-blue2))!important;
  color:#fff!important;
  border-color:#0a73e6!important;
  box-shadow:0 8px 18px rgba(8,112,226,.17)!important;
}
.tt760-trip-types input{position:absolute!important;opacity:0!important}
.tt760-trip-types span{font-size:16px!important}
.tt760-trip-types em{
  justify-self:end!important;
  align-self:center!important;
  margin-right:6px!important;
  padding:6px 12px!important;
  border-radius:999px!important;
  background:#fff2df!important;
  color:#e18a19!important;
  font-size:7.8px!important;
  font-style:normal!important;
  font-weight:800!important;
}

/* Route */
.tt760-route-grid{
  display:grid!important;
  grid-template-columns:1fr 48px 1fr!important;
  gap:8px!important;
  align-items:center!important;
  margin:0 0 12px!important;
}
.tt760-swap{
  width:42px!important;height:42px!important;
  margin:auto!important;
  border-radius:50%!important;
  border:1px solid #d5e2ee!important;
  background:#fff!important;
  color:#0c79ec!important;
  font-size:18px!important;
  font-weight:900!important;
  display:grid!important;place-items:center!important;
  box-shadow:0 7px 16px rgba(14,77,135,.14)!important;
}

.tt760-grid{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:12px 13px!important;
}
.tt760-input-card{
  position:relative!important;
  min-height:68px!important;
  margin:0!important;
  padding:10px 12px 8px 57px!important;
  border:1px solid #d8e3ed!important;
  border-radius:12px!important;
  background:#fff!important;
  box-shadow:none!important;
}
.tt760-input-card .tt760-field-icon{
  position:absolute!important;
  left:0!important;top:0!important;bottom:0!important;
  width:47px!important;
  border-right:1px solid #e3eaf1!important;
  display:grid!important;place-items:center!important;
  color:#0a70e3!important;
  font-size:17px!important;
}
.tt760-input-card label{
  display:block!important;
  margin:0 0 3px!important;
  font-size:9px!important;
  color:#153a60!important;
  font-weight:800!important;
}
.tt760-input-card label small{
  font-size:7.8px!important;
  color:#7d8fa2!important;
  font-weight:600!important;
}
.tt760-input-card input,
.tt760-input-card select,
.tt760-input-card textarea{
  width:100%!important;
  min-height:29px!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  outline:0!important;
  background:transparent!important;
  box-shadow:none!important;
  font-size:11px!important;
  color:#243f5b!important;
}
.tt760-input-card textarea{min-height:34px!important;resize:none!important}

/* Return fields */
.return-fields{display:none!important}
.tt771-roundtrip .return-fields{display:grid!important;margin-top:12px!important}

/* Buttons */
.tt760-nav{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  margin:19px 0 0!important;
  padding:17px 0 0!important;
  border-top:1px solid #edf2f6!important;
}
.tt760-next,.tt760-back,.tt760-clear{
  min-height:46px!important;
  border-radius:10px!important;
  padding:0 19px!important;
  font-size:9.5px!important;
  font-weight:900!important;
}
.tt760-clear,.tt760-back{
  border:1px solid #d9e3ed!important;
  background:#f6f9fc!important;
  color:#38536f!important;
}
.tt760-next{
  min-width:560px!important;
  margin-left:auto!important;
  border:0!important;
  background:linear-gradient(135deg,var(--v771-blue),var(--v771-blue2))!important;
  color:#fff!important;
  box-shadow:0 8px 20px rgba(9,111,225,.18)!important;
}

/* Summary */
.tt760-summary{
  position:sticky!important;
  top:90px!important;
  width:366px!important;
  margin:0!important;
  background:#fff!important;
  border:1px solid #dbe5ee!important;
  border-radius:18px!important;
  box-shadow:var(--v771-shadow)!important;
  overflow:hidden!important;
}
.tt760-summary-head{
  display:flex!important;
  align-items:center!important;
  gap:12px!important;
  padding:18px 18px!important;
  background:linear-gradient(135deg,#06366a,#0a6cbc)!important;
  color:#fff!important;
}
.tt760-summary-icon{
  width:40px!important;height:40px!important;
  border-radius:10px!important;
  background:rgba(255,255,255,.12)!important;
  display:grid!important;place-items:center!important;
  font-size:18px!important;
}
.tt760-summary-head h3{
  margin:0 0 3px!important;
  font-size:18px!important;
  color:#fff!important;
}
.tt760-summary-head p{
  margin:0!important;
  font-size:7.8px!important;
  color:rgba(255,255,255,.8)!important;
}
.tt760-summary-list{padding:6px 16px 0!important}
.tt760-summary-list .summary-row{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  min-height:37px!important;
  padding:9px 0!important;
  border-bottom:1px solid #edf2f6!important;
}
.tt760-summary-list small{font-size:8.2px!important;color:#71869a!important}
.tt760-summary-list strong{
  font-size:9.2px!important;
  color:#17344f!important;
  max-width:58%!important;
  text-align:right!important;
}
.tt760-secondary-row{display:none!important}

.tt760-price-box{
  margin:12px 15px!important;
  padding:14px!important;
  border:1px solid #d2e5f4!important;
  border-radius:12px!important;
  background:linear-gradient(145deg,#fafdff,#eef7ff)!important;
}
.tt760-price-top{display:flex!important;justify-content:space-between!important;align-items:center!important}
.tt760-price-top small{font-size:9px!important;color:#0a4c88!important;font-weight:800!important}
.tt760-price-top span{
  padding:5px 8px!important;
  border-radius:8px!important;
  background:var(--v771-green)!important;
  color:#fff!important;
  font-size:7px!important;
  font-weight:800!important;
}
.tt760-price-box>strong{
  display:block!important;
  margin:4px 0 5px!important;
  font-size:30px!important;
  line-height:1!important;
  color:#0b5fa7!important;
}
.tt760-price-box p{
  margin:0 0 9px!important;
  font-size:7px!important;
  color:#8796a5!important;
}
.tt760-price-box .summary-total{
  padding-top:9px!important;
  border-top:1px solid #dbe8f3!important;
  font-size:9.5px!important;
}

.tt760-assurances{
  margin:0 15px 12px!important;
  padding:9px 11px!important;
  border:1px solid #e0e7ee!important;
  border-radius:12px!important;
}
.tt760-assurances>div{
  display:flex!important;
  align-items:center!important;
  gap:9px!important;
  padding:7px 0!important;
}
.tt760-assurances>div>span{
  width:28px!important;height:28px!important;flex:0 0 28px!important;
  border-radius:50%!important;
  background:var(--v771-green)!important;
  color:#fff!important;
  display:grid!important;place-items:center!important;
  font-size:11px!important;
}
.tt760-assurances p{margin:0!important}
.tt760-assurances b{
  display:block!important;
  font-size:8.3px!important;
  color:#1f3c57!important;
}
.tt760-assurances small{
  display:block!important;
  font-size:6.9px!important;
  color:#8494a4!important;
}
.tt760-payment-trust{
  margin:0 15px 15px!important;
  padding:12px!important;
  border:1px solid #e0e7ee!important;
  border-radius:12px!important;
}
.tt760-payment-trust>div:first-child{
  display:flex!important;
  align-items:center!important;
  gap:9px!important;
}
.tt760-payment-trust>div:first-child>span{
  width:31px!important;height:31px!important;
  border-radius:50%!important;
  background:#536c84!important;
  color:#fff!important;
  display:grid!important;place-items:center!important;
}
.tt760-payment-trust p{margin:0!important}
.tt760-payment-trust b{font-size:8.3px!important;color:#223c55!important}
.tt760-payment-trust small{display:block!important;font-size:6.8px!important;color:#8494a3!important}
.tt760-pay-logos{
  display:flex!important;
  justify-content:space-between!important;
  align-items:center!important;
  margin-top:12px!important;
  padding-top:10px!important;
  border-top:1px solid #edf1f4!important;
}
.tt760-pay-logos b{font-size:12.5px!important;color:#16487b!important}

/* Decouple why-band from sidebar height */
.tt760-why{
  margin-top:18px!important;
  display:grid!important;
  grid-template-columns:1.65fr repeat(3,.55fr)!important;
  align-items:center!important;
  gap:8px!important;
  padding:14px 16px!important;
  border:1px solid #deebf5!important;
  border-radius:14px!important;
  background:linear-gradient(90deg,#edf7ff,#fff)!important;
  box-shadow:0 8px 22px rgba(22,64,102,.05)!important;
}
.tt760-why-copy{
  display:flex!important;
  gap:11px!important;
  align-items:center!important;
}
.tt760-why-copy>span{
  width:38px!important;height:38px!important;
  border-radius:10px!important;
  background:#dcebff!important;
  color:#0b6fde!important;
  display:grid!important;place-items:center!important;
  font-size:18px!important;font-weight:900!important;
}
.tt760-why-copy p{margin:0!important}
.tt760-why-copy b{
  display:block!important;
  font-size:12.5px!important;
  color:#0d4d8d!important;
}
.tt760-why-copy small{
  display:block!important;
  margin-top:3px!important;
  font-size:7.5px!important;
  color:#74879b!important;
}
.tt760-stat{
  text-align:center!important;
  border-left:1px solid #d9e6f2!important;
}
.tt760-stat b{
  display:block!important;
  font-size:18px!important;
  color:#0a4f90!important;
}
.tt760-stat small{
  font-size:7.3px!important;
  color:#718398!important;
}

/* Functional later steps */
.tt760-vehicle-grid{display:grid!important;grid-template-columns:repeat(2,1fr)!important;gap:14px!important}
.tt760-vehicle-grid .vehicle-choice{border-radius:14px!important;overflow:hidden!important}
.tt760-vehicle-grid .vehicle-choice img{height:160px!important;object-fit:cover!important}
.tt760-extra-grid{display:grid!important;grid-template-columns:repeat(2,1fr)!important;gap:11px!important}
.tt760-choice-card{padding:11px!important;border:1px solid #dce6ef!important;border-radius:11px!important;background:#fff!important}
.tt760-choice-card>label{display:block!important;margin-bottom:7px!important;font-size:8.8px!important;color:#173c64!important;font-weight:800!important}
.tt760-choice-card .identity-choice,.tt760-choice-card .payment-choice{display:grid!important;grid-template-columns:repeat(2,1fr)!important;gap:8px!important}
.tt760-choice-card .payment-choice{grid-template-columns:repeat(3,1fr)!important}
.tt760-choice-card .identity-choice label,.tt760-choice-card .payment-choice label{
  min-height:45px!important;
  border:1px solid #dfe7ef!important;
  border-radius:9px!important;
  background:#fbfdff!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:6px!important;
  font-size:8.7px!important;
  font-weight:800!important;
}
.tt760-confirm{
  display:flex!important;
  gap:11px!important;
  padding:15px!important;
  border:1px solid #dce6ef!important;
  background:#f7fafc!important;
  border-radius:11px!important;
  font-size:9.2px!important;
  color:#566b80!important;
}

@media(max-width:1050px){
  .tt760-layout{grid-template-columns:minmax(0,1fr) 330px!important}
  .tt760-summary{width:330px!important}
  .tt760-hero-inner{grid-template-columns:1fr 430px!important}
  .tt760-hero h1{white-space:normal!important}
  .tt760-next{min-width:430px!important}
}
@media(max-width:880px){
  .tt760-layout{grid-template-columns:1fr!important}
  .tt760-summary{position:relative!important;top:auto!important;width:100%!important}
  .tt760-hero-inner{grid-template-columns:1fr!important}
}
@media(max-width:760px){
  .tt760-page>.container,.tt760-hero>.container{width:calc(100% - 20px)!important}
  .tt760-hero-inner{padding:20px 16px!important}
  .tt760-hero h1{font-size:25px!important;white-space:normal!important}
  .tt760-hero-benefits{grid-template-columns:repeat(2,1fr)!important}
  .tt760-progress{overflow-x:auto!important;grid-template-columns:repeat(5,minmax(70px,1fr))!important}
  .tt760-booking-card .booking-step{padding:18px 13px 20px!important}
  .tt760-trip-types{grid-template-columns:1fr 1fr!important}
  .tt760-trip-types em{display:none!important}
  .tt760-route-grid{grid-template-columns:1fr!important}
  .tt760-swap{transform:rotate(90deg)!important}
  .tt760-grid,.tt760-vehicle-grid,.tt760-extra-grid{grid-template-columns:1fr!important}
  .tt760-choice-card .payment-choice{grid-template-columns:1fr!important}
  .tt760-nav{flex-wrap:wrap!important}
  .tt760-next{order:1!important;width:100%!important;min-width:0!important}
  .tt760-clear,.tt760-back{order:2!important}
  .tt760-why{grid-template-columns:1fr!important}
  .tt760-stat{border-left:0!important;border-top:1px solid #d9e6f2!important;padding-top:8px!important}
}


/* ==========================================================
   V7.7.2 — proportional alignment corrections
   Based on the user's red-marked screenshot.
   ========================================================== */

/* 1) HERO: make left/right content visually equal and centered */
.tt760-hero-inner{
  min-height:144px!important;
  padding:26px 28px!important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
  align-items:center!important;
}
.tt760-hero-copy{
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  min-height:92px!important;
  max-width:none!important;
  padding-right:20px!important;
}
.tt760-kicker{
  margin:0 0 8px!important;
  font-size:10px!important;
  line-height:1!important;
}
.tt760-hero h1{
  margin:0 0 8px!important;
  font-size:30px!important;
  line-height:1.03!important;
  white-space:nowrap!important;
}
.tt760-hero p{
  margin:0!important;
  font-size:12px!important;
  line-height:1.35!important;
}
.tt760-hero-benefits{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  align-items:center!important;
  justify-items:center!important;
  gap:12px!important;
  padding-left:8px!important;
}
.tt760-hero-benefits>div{
  width:100%!important;
  min-height:78px!important;
  justify-content:center!important;
}
.tt760-benefit-icon{
  width:36px!important;
  height:36px!important;
  margin-bottom:6px!important;
}
.tt760-hero-benefits b{
  max-width:90px!important;
  min-height:18px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  font-size:8.4px!important;
  line-height:1.12!important;
}

/* 2) STEPPER: move labels slightly lower as requested */
.tt760-booking-card .booking-progress{
  min-height:112px!important;
  padding-top:20px!important;
  padding-bottom:16px!important;
}
.tt760-booking-card .booking-progress:after{
  top:42px!important;
}
.tt760-booking-card .booking-progress>div{
  padding-top:53px!important;
  font-size:9.4px!important;
  line-height:1.1!important;
}
.tt760-booking-card .booking-progress>div:before{
  top:4px!important;
}

/* 3) Summary blue header: rounded on all corners inside white card */
.tt760-summary{
  padding:14px!important;
  background:#fff!important;
  border-radius:18px!important;
  overflow:visible!important;
}
.tt760-summary-head{
  border-radius:14px!important;
  overflow:hidden!important;
  margin:0 0 6px!important;
  padding:18px 18px!important;
}
.tt760-summary-list{
  padding-left:2px!important;
  padding-right:2px!important;
}
.tt760-price-box,
.tt760-assurances,
.tt760-payment-trust{
  margin-left:0!important;
  margin-right:0!important;
}

/* 4) Keep summary content proportions equal with left card */
.tt760-summary-list .summary-row{
  min-height:36px!important;
}
.tt760-summary-list small{
  font-size:8px!important;
}
.tt760-summary-list strong{
  font-size:9px!important;
}
.tt760-price-box>strong{
  font-size:29px!important;
}

/* 5) Main panel / summary balance */
.tt760-layout{
  grid-template-columns:minmax(0,840px) 360px!important;
  gap:20px!important;
}
.tt760-booking-card,
.tt760-summary{
  align-self:start!important;
}

/* 6) Make first content row spacing more even */
.tt760-step-title{
  margin-bottom:16px!important;
}
.tt760-trip-types{
  grid-template-columns:200px 200px 1fr!important;
  margin-bottom:17px!important;
}
.tt760-trip-types em{
  margin-right:0!important;
  justify-self:end!important;
}

/* 7) Slightly more balanced route/card sizes */
.tt760-route-grid{
  grid-template-columns:1fr 48px 1fr!important;
}
.tt760-input-card{
  min-height:67px!important;
}
.tt760-swap{
  width:42px!important;
  height:42px!important;
}

/* 8) CTA / clean button alignment */
.tt760-nav{
  align-items:center!important;
}
.tt760-clear{
  min-width:84px!important;
}
.tt760-next{
  min-width:560px!important;
}

/* desktop-only visual alignment */
@media(min-width:1060px){
  .tt760-hero-inner{
    grid-template-columns:50% 50%!important;
  }
  .tt760-summary{
    width:360px!important;
  }
}

@media(max-width:1050px){
  .tt760-hero-inner{
    grid-template-columns:1fr 430px!important;
  }
  .tt760-hero h1{
    white-space:normal!important;
  }
  .tt760-summary{
    padding:12px!important;
  }
}


/* ==========================================================
   V7.7.3 — HERO HEIGHT + OUTER ALIGNMENT FIX
   User-requested corrections only.
   ========================================================== */

/* Hero and booking grid use exactly the same desktop width */
.tt760-page>.container,
.tt760-hero>.container{
  width:min(1220px,calc(100% - 36px))!important;
  max-width:none!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

/* Reduce hero height and keep all content safely inside */
.tt760-hero{
  margin-top:18px!important;
}
.tt760-hero-inner{
  min-height:118px!important;
  height:118px!important;
  padding:18px 24px!important;
  grid-template-columns:50% 50%!important;
  gap:14px!important;
  align-items:center!important;
  overflow:hidden!important;
  border-radius:17px!important;
}

/* Left hero text: vertically centered, no overflow */
.tt760-hero-copy{
  min-height:0!important;
  height:auto!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  align-items:flex-start!important;
  padding:0 14px 0 0!important;
  overflow:hidden!important;
}
.tt760-kicker{
  margin:0 0 6px!important;
  font-size:9px!important;
  line-height:1.1!important;
  letter-spacing:.01em!important;
  white-space:nowrap!important;
}
.tt760-hero h1{
  margin:0 0 6px!important;
  font-size:25px!important;
  line-height:1.02!important;
  letter-spacing:-.022em!important;
  white-space:nowrap!important;
  max-width:100%!important;
}
.tt760-hero p{
  margin:0!important;
  font-size:10px!important;
  line-height:1.25!important;
  white-space:nowrap!important;
  max-width:100%!important;
}

/* Right feature group vertically centered in the shorter hero */
.tt760-hero-benefits{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:8px!important;
  padding:0!important;
  margin:0!important;
  align-items:center!important;
}
.tt760-hero-benefits>div{
  min-height:62px!important;
  justify-content:center!important;
}
.tt760-benefit-icon{
  width:32px!important;
  height:32px!important;
  margin-bottom:4px!important;
  border-radius:9px!important;
  font-size:15px!important;
}
.tt760-hero-benefits b{
  font-size:7.6px!important;
  line-height:1.1!important;
  min-height:16px!important;
  max-width:88px!important;
}

/* Exact horizontal alignment with the summary outer edge */
.tt760-layout{
  grid-template-columns:minmax(0,840px) 360px!important;
  gap:20px!important;
  width:100%!important;
}
.tt760-summary{
  width:360px!important;
}

/* Summary blue header stays rounded and visually aligns with hero geometry */
.tt760-summary{
  padding:14px!important;
  border-radius:17px!important;
}
.tt760-summary-head{
  border-radius:13px!important;
  min-height:68px!important;
  display:flex!important;
  align-items:center!important;
}

/* Small breathing room under hero before the content cards */
.tt760-page{
  padding-top:14px!important;
}

/* Make sure no legacy hero CSS can push text outside */
.tt760-hero-inner *{
  max-height:none!important;
  overflow:visible!important;
}
.tt760-hero-copy,
.tt760-hero-copy *{
  overflow:hidden!important;
}

/* Tablet/mobile fallback */
@media(max-width:1050px){
  .tt760-hero-inner{
    height:auto!important;
    min-height:118px!important;
    grid-template-columns:1fr 420px!important;
  }
  .tt760-hero h1,
  .tt760-hero p{
    white-space:normal!important;
  }
}
@media(max-width:880px){
  .tt760-hero-inner{
    grid-template-columns:1fr!important;
    height:auto!important;
    min-height:0!important;
    padding:20px 16px!important;
  }
  .tt760-hero-copy{
    overflow:visible!important;
  }
  .tt760-hero h1,
  .tt760-hero p,
  .tt760-kicker{
    white-space:normal!important;
    overflow:visible!important;
  }
}


/* ==========================================================
   V7.7.4 — HERO + SUMMARY SAME TOP LINE
   This is the structural correction requested by the user.
   ========================================================== */

/* Old hero wrapper no longer exists outside the grid. */
.tt760-page{
  padding-top:18px!important;
}

/* Main two-column system: left hero+form, right summary. */
.tt760-layout{
  display:grid!important;
  grid-template-columns:minmax(0,840px) 360px!important;
  gap:20px!important;
  align-items:start!important;
  width:100%!important;
}
.tt774-left-column{
  min-width:0!important;
  display:flex!important;
  flex-direction:column!important;
  gap:14px!important;
}

/* HERO NOW OCCUPIES ONLY LEFT COLUMN */
.tt774-hero-inline{
  width:100%!important;
  margin:0!important;
  padding:0!important;
  max-width:none!important;
}
.tt774-hero-inline .tt760-hero-inner{
  width:100%!important;
  height:104px!important;
  min-height:104px!important;
  margin:0!important;
  padding:15px 18px!important;
  border-radius:17px!important;
  display:grid!important;
  grid-template-columns:minmax(0,1.12fr) minmax(330px,.88fr)!important;
  gap:12px!important;
  align-items:center!important;
  overflow:hidden!important;
}

/* Left hero copy fits completely inside the hero. */
.tt774-hero-inline .tt760-hero-copy{
  min-width:0!important;
  min-height:0!important;
  height:auto!important;
  padding:0!important;
  overflow:hidden!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
}
.tt774-hero-inline .tt760-kicker{
  margin:0 0 5px!important;
  font-size:7.8px!important;
  line-height:1!important;
  letter-spacing:.015em!important;
  white-space:nowrap!important;
}
.tt774-hero-inline .tt760-hero h1,
.tt774-hero-inline h1{
  margin:0 0 5px!important;
  font-size:20px!important;
  line-height:1.04!important;
  letter-spacing:-.018em!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:clip!important;
  max-width:100%!important;
}
.tt774-hero-inline .tt760-hero p,
.tt774-hero-inline p{
  margin:0!important;
  font-size:8.4px!important;
  line-height:1.2!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  max-width:100%!important;
}

/* Compact four feature items in the reduced hero. */
.tt774-hero-inline .tt760-hero-benefits{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:5px!important;
  padding:0!important;
  margin:0!important;
  align-items:center!important;
}
.tt774-hero-inline .tt760-hero-benefits>div{
  width:100%!important;
  min-height:58px!important;
  justify-content:center!important;
}
.tt774-hero-inline .tt760-benefit-icon{
  width:28px!important;
  height:28px!important;
  margin-bottom:3px!important;
  border-radius:8px!important;
  border-width:1.5px!important;
  font-size:13px!important;
}
.tt774-hero-inline .tt760-hero-benefits b{
  min-height:14px!important;
  max-width:74px!important;
  font-size:6.5px!important;
  line-height:1.08!important;
}

/* SUMMARY STARTS AT EXACT SAME Y AS HERO */
.tt760-summary{
  position:sticky!important;
  top:90px!important;
  margin:0!important;
  width:360px!important;
  align-self:start!important;
  padding:14px!important;
  border-radius:17px!important;
}
.tt760-summary-head{
  margin:0 0 6px!important;
  min-height:76px!important;
  border-radius:13px!important;
  display:flex!important;
  align-items:center!important;
}

/* Form keeps the same visual proportions below hero. */
.tt760-booking-card{
  margin:0!important;
}

/* Stepper text is slightly lower, as previously requested. */
.tt760-booking-card .booking-progress{
  min-height:112px!important;
}
.tt760-booking-card .booking-progress>div{
  padding-top:54px!important;
}

/* Why band remains below both columns */
.tt760-why{
  margin-top:18px!important;
}

/* At desktop widths, force exact proportions. */
@media(min-width:1060px){
  .tt760-page>.container{
    width:min(1220px,calc(100% - 36px))!important;
  }
  .tt760-layout{
    grid-template-columns:840px 360px!important;
  }
}

/* Tablet */
@media(max-width:1059px){
  .tt760-layout{
    grid-template-columns:minmax(0,1fr) 320px!important;
  }
  .tt760-summary{
    width:320px!important;
  }
  .tt774-hero-inline .tt760-hero-inner{
    grid-template-columns:1fr!important;
    height:auto!important;
    min-height:118px!important;
  }
  .tt774-hero-inline .tt760-hero-benefits{
    grid-template-columns:repeat(4,1fr)!important;
  }
  .tt774-hero-inline h1,
  .tt774-hero-inline p{
    white-space:normal!important;
  }
}

/* Mobile: natural one-column flow */
@media(max-width:880px){
  .tt760-layout{
    grid-template-columns:1fr!important;
  }
  .tt760-summary{
    position:relative!important;
    top:auto!important;
    width:100%!important;
  }
  .tt774-left-column{
    gap:12px!important;
  }
}


/* ==========================================================
   V7.7.5 — YOLCULUK BİLGİLERİ / HERO HİZA DÜZELTMESİ
   Sol form kartı hero ile aynı genişlik ve aynı kenarlarda.
   ========================================================== */

/* Left column itself fills its 840px grid track */
.tt774-left-column{
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  align-items:stretch!important;
}

/* Hero is the alignment reference */
.tt774-hero-inline{
  width:100%!important;
  max-width:none!important;
  align-self:stretch!important;
}
.tt774-hero-inline .tt760-hero-inner{
  width:100%!important;
  max-width:none!important;
}

/* Main reservation form MUST use the exact same width as hero */
.tt774-left-column > .tt760-booking-card,
.tt774-left-column > form.tt760-booking-card,
#bookingFormV67.tt760-booking-card{
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  margin-left:0!important;
  margin-right:0!important;
  align-self:stretch!important;
}

/* Neutralize legacy width constraints inherited from old reservation CSS */
#bookingFormV67,
#bookingFormV67 .booking-progress,
#bookingFormV67 .booking-step{
  width:100%!important;
  max-width:none!important;
}

#bookingFormV67 .booking-step{
  box-sizing:border-box!important;
}

#bookingFormV67 .tt760-step-title,
#bookingFormV67 .tt760-trip-types,
#bookingFormV67 .tt760-route-grid,
#bookingFormV67 .tt760-grid,
#bookingFormV67 .tt760-nav{
  width:100%!important;
  max-width:none!important;
}

/* Keep internal field columns proportional after widening */
#bookingFormV67 .tt760-grid{
  grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
}
#bookingFormV67 .tt760-route-grid{
  grid-template-columns:minmax(0,1fr) 48px minmax(0,1fr)!important;
}

/* CTA stretches naturally with the wider card */
#bookingFormV67 .tt760-next{
  min-width:0!important;
  width:min(560px,calc(100% - 110px))!important;
}

/* Exact left/right edge lock between hero and journey card */
.tt774-hero-inline,
#bookingFormV67{
  margin-left:0!important;
  margin-right:0!important;
}

/* Desktop: explicit matching width */
@media(min-width:1060px){
  .tt774-left-column,
  .tt774-hero-inline,
  #bookingFormV67{
    width:840px!important;
  }
}

/* Tablet/mobile remain fluid */
@media(max-width:1059px){
  .tt774-left-column,
  .tt774-hero-inline,
  #bookingFormV67{
    width:100%!important;
  }
}


/* ==========================================================
   V7.7.6 — STEP 4 GRID / COLUMN CLEANUP
   Müşteri ve Ödeme Bilgileri ekranını eşit sütun ve aynı hiza yapar.
   ========================================================== */

/* Step 4 overall content rhythm */
#bookingFormV67 .booking-step:nth-of-type(4){
  padding-top:22px!important;
}
#bookingFormV67 .booking-step:nth-of-type(4) .tt760-step-title{
  margin-bottom:16px!important;
  align-items:center!important;
}
#bookingFormV67 .booking-step:nth-of-type(4) .tt760-step-title h2{
  font-size:23px!important;
  line-height:1.1!important;
  margin:0 0 4px!important;
}
#bookingFormV67 .booking-step:nth-of-type(4) .tt760-step-title p{
  margin:0!important;
  font-size:9.5px!important;
  line-height:1.35!important;
}

/* Exact equal two-column system */
#bookingFormV67 .booking-step:nth-of-type(4) .tt760-grid{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
  column-gap:14px!important;
  row-gap:12px!important;
  align-items:stretch!important;
}

/* Normal cards use identical height */
#bookingFormV67 .booking-step:nth-of-type(4) .tt760-input-card,
#bookingFormV67 .booking-step:nth-of-type(4) .tt760-choice-card{
  min-height:68px!important;
  height:68px!important;
  margin:0!important;
  border-radius:11px!important;
  box-sizing:border-box!important;
}

/* Choice-card label alignment */
#bookingFormV67 .booking-step:nth-of-type(4) .tt760-choice-card{
  padding:9px 11px!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:flex-start!important;
}
#bookingFormV67 .booking-step:nth-of-type(4) .tt760-choice-card>label{
  display:block!important;
  margin:0 0 6px!important;
  font-size:8.7px!important;
  line-height:1.2!important;
  color:#173c64!important;
  font-weight:800!important;
}

/* Gender and nationality rows use equal internal halves */
#bookingFormV67 .booking-step:nth-of-type(4) .identity-choice{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:8px!important;
  flex:1!important;
}
#bookingFormV67 .booking-step:nth-of-type(4) .identity-choice label{
  min-height:38px!important;
  height:38px!important;
  padding:0 10px!important;
  border-radius:9px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  box-sizing:border-box!important;
}

/* Full-width rows truly span both columns */
#bookingFormV67 .booking-step:nth-of-type(4) .booking-full{
  grid-column:1 / -1!important;
  width:100%!important;
}

/* Nationality selector gets a little more room and equal halves */
#bookingFormV67 .booking-step:nth-of-type(4) .booking-full.tt760-choice-card{
  height:auto!important;
  min-height:76px!important;
}
#bookingFormV67 .booking-step:nth-of-type(4) .booking-full.tt760-choice-card .identity-choice{
  grid-template-columns:1fr 1fr!important;
}

/* Inputs: all labels start at same Y position */
#bookingFormV67 .booking-step:nth-of-type(4) .tt760-input-card label{
  margin:0 0 3px!important;
  font-size:8.7px!important;
  line-height:1.2!important;
}
#bookingFormV67 .booking-step:nth-of-type(4) .tt760-input-card input{
  min-height:28px!important;
  line-height:28px!important;
  font-size:10.5px!important;
}

/* Helper text does not push one column taller */
#bookingFormV67 .booking-step:nth-of-type(4) .field-help{
  display:block!important;
  margin-top:2px!important;
  font-size:6.7px!important;
  line-height:1.15!important;
  color:#8a98a7!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

/* Luggage count card fills its column exactly */
#bookingFormV67 .booking-step:nth-of-type(4) [name="luggage_count_review"]{
  width:100%!important;
}

/* Meet-name full width row */
#bookingFormV67 .booking-step:nth-of-type(4) .booking-full.tt760-input-card{
  height:68px!important;
  min-height:68px!important;
}

/* Payment row: one clean full-width table with 3 equal columns */
#bookingFormV67 .booking-step:nth-of-type(4) .payment-choice{
  display:grid!important;
  grid-template-columns:repeat(3,1fr)!important;
  gap:8px!important;
  width:100%!important;
}
#bookingFormV67 .booking-step:nth-of-type(4) .payment-choice label{
  min-height:40px!important;
  height:40px!important;
  padding:0 8px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  border-radius:9px!important;
  box-sizing:border-box!important;
  text-align:center!important;
  line-height:1.15!important;
}

/* Payment parent height follows one-row system */
#bookingFormV67 .booking-step:nth-of-type(4) .booking-full.tt760-choice-card:has(.payment-choice){
  min-height:72px!important;
  height:72px!important;
}

/* Align navigation with the card edges */
#bookingFormV67 .booking-step:nth-of-type(4) .tt760-nav{
  margin-top:18px!important;
  padding-top:16px!important;
  width:100%!important;
}
#bookingFormV67 .booking-step:nth-of-type(4) .tt760-back{
  min-width:74px!important;
}
#bookingFormV67 .booking-step:nth-of-type(4) .tt760-next{
  width:55%!important;
  min-width:0!important;
}

/* Hide inactive nationality input cleanly without leaving a layout hole */
#bookingFormV67 .booking-step:nth-of-type(4) .is-hidden{
  display:none!important;
}

/* Desktop exact alignment */
@media(min-width:1060px){
  #bookingFormV67 .booking-step:nth-of-type(4) .tt760-grid{
    grid-template-columns:1fr 1fr!important;
  }
}

/* Mobile becomes one column, still consistent */
@media(max-width:760px){
  #bookingFormV67 .booking-step:nth-of-type(4) .tt760-grid{
    grid-template-columns:1fr!important;
  }
  #bookingFormV67 .booking-step:nth-of-type(4) .booking-full{
    grid-column:1!important;
  }
  #bookingFormV67 .booking-step:nth-of-type(4) .tt760-input-card,
  #bookingFormV67 .booking-step:nth-of-type(4) .tt760-choice-card{
    height:auto!important;
    min-height:68px!important;
  }
  #bookingFormV67 .booking-step:nth-of-type(4) .payment-choice{
    grid-template-columns:1fr!important;
  }
  #bookingFormV67 .booking-step:nth-of-type(4) .payment-choice label{
    height:42px!important;
  }
}


/* ==========================================================
   V7.7.7 — STEP 4 STRUCTURAL REBUILD
   This section is rebuilt with its own independent grid.
   ========================================================== */

#bookingFormV67 .tt777-step4{
  padding:22px 28px 26px!important;
}

#bookingFormV67 .tt777-step4-title{
  margin-bottom:16px!important;
}

#bookingFormV67 .tt777-customer-grid{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
  gap:12px 14px!important;
  width:100%!important;
  align-items:stretch!important;
}

/* independent card reset */
#bookingFormV67 .tt777-card{
  box-sizing:border-box!important;
  width:100%!important;
  margin:0!important;
  border:1px solid #d9e4ee!important;
  border-radius:11px!important;
  background:#fff!important;
  box-shadow:none!important;
}

#bookingFormV67 .tt777-wide{
  grid-column:1 / -1!important;
}

#bookingFormV67 .tt777-field{
  position:relative!important;
  display:flex!important;
  min-height:70px!important;
  height:70px!important;
  padding:0!important;
  overflow:hidden!important;
}

#bookingFormV67 .tt777-icon{
  width:46px!important;
  flex:0 0 46px!important;
  display:grid!important;
  place-items:center!important;
  border-right:1px solid #e3eaf1!important;
  color:#0a70e3!important;
  font-size:16px!important;
}

#bookingFormV67 .tt777-field-body{
  flex:1!important;
  min-width:0!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  padding:8px 11px!important;
}

#bookingFormV67 .tt777-field-body label,
#bookingFormV67 .tt777-choice-card>label,
#bookingFormV67 .tt777-payment>label{
  display:block!important;
  margin:0 0 4px!important;
  color:#173c64!important;
  font-size:8.8px!important;
  line-height:1.2!important;
  font-weight:800!important;
}

#bookingFormV67 .tt777-field-body input{
  width:100%!important;
  min-height:26px!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  outline:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:#304a64!important;
  font-size:10.5px!important;
}

#bookingFormV67 .tt777-field-body small{
  display:block!important;
  margin-top:2px!important;
  color:#8a98a7!important;
  font-size:6.5px!important;
  line-height:1.15!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

/* gender / nationality */
#bookingFormV67 .tt777-choice-card{
  min-height:70px!important;
  padding:8px 10px!important;
  display:flex!important;
  flex-direction:column!important;
}

#bookingFormV67 .tt777-nationality{
  min-height:76px!important;
}

#bookingFormV67 .tt777-two-choice{
  flex:1!important;
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:8px!important;
}

#bookingFormV67 .tt777-two-choice>label{
  min-width:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  padding:0 9px!important;
  border:1px solid #dfe7ef!important;
  border-radius:9px!important;
  background:#fbfdff!important;
  color:#304a64!important;
  font-size:8.5px!important;
  line-height:1.1!important;
  font-weight:800!important;
}

#bookingFormV67 .tt777-two-choice input{
  width:14px!important;
  height:14px!important;
  margin:0!important;
  accent-color:#0b79ec!important;
}

#bookingFormV67 .tt777-two-choice>label:has(input:checked){
  border-color:#79b6ef!important;
  background:#eef7ff!important;
  color:#0b68c8!important;
}

/* identity input swaps in same left-column slot */
#bookingFormV67 .tt777-identity.is-hidden{
  display:none!important;
}

/* payment */
#bookingFormV67 .tt777-payment{
  min-height:78px!important;
  padding:9px 10px!important;
}

#bookingFormV67 .tt777-payment-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:8px!important;
}

#bookingFormV67 .tt777-payment-grid>label{
  min-height:42px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  padding:0 8px!important;
  border:1px solid #dfe7ef!important;
  border-radius:9px!important;
  background:#fbfdff!important;
  color:#304a64!important;
  font-size:8.3px!important;
  line-height:1.15!important;
  font-weight:800!important;
  text-align:center!important;
}

#bookingFormV67 .tt777-payment-grid input{
  width:14px!important;
  height:14px!important;
  margin:0!important;
  accent-color:#0b79ec!important;
}

#bookingFormV67 .tt777-payment-grid>label:has(input:checked){
  border-color:#79b6ef!important;
  background:#eef7ff!important;
  color:#0b68c8!important;
}

/* Navigation alignment */
#bookingFormV67 .tt777-step4-nav{
  width:100%!important;
  margin-top:18px!important;
  padding-top:16px!important;
}

#bookingFormV67 .tt777-step4-nav .tt760-back{
  min-width:76px!important;
}

#bookingFormV67 .tt777-step4-nav .tt760-next{
  width:56%!important;
  min-width:0!important;
  margin-left:auto!important;
}

/* Explicitly remove any visual WhatsApp card from old styles */
#bookingFormV67 .tt777-step4 [name="whatsapp"]{
  display:none!important;
}

/* Mobile */
@media(max-width:760px){
  #bookingFormV67 .tt777-customer-grid{
    grid-template-columns:1fr!important;
  }
  #bookingFormV67 .tt777-wide{
    grid-column:1!important;
  }
  #bookingFormV67 .tt777-payment-grid{
    grid-template-columns:1fr!important;
  }
  #bookingFormV67 .tt777-payment-grid>label{
    min-height:42px!important;
  }
  #bookingFormV67 .tt777-step4-nav .tt760-next{
    width:100%!important;
  }
}