.customer-page{background:#fff}
.site-header{position:sticky;top:0;z-index:80;background:rgba(255,255,255,.96);border-bottom:1px solid rgba(228,231,236,.9);backdrop-filter:blur(16px)}
.site-nav{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:18px}
.site-nav-actions{display:flex;align-items:center;gap:10px}
.nav-link{color:var(--ink-2);text-decoration:none;font-weight:760;font-size:14px}
.hero{position:relative;overflow:hidden;padding:64px 0 58px;background:radial-gradient(circle at 83% 16%,rgba(8,127,91,.15),transparent 30%),linear-gradient(180deg,#f3fbf7 0,#fff 90%)}
.hero:after{content:"";position:absolute;right:-150px;bottom:-210px;width:500px;height:500px;border-radius:50%;border:80px solid rgba(8,127,91,.045);pointer-events:none}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(340px,.72fr);gap:70px;align-items:center;position:relative;z-index:1}
.availability{display:inline-flex;align-items:center;gap:9px;padding:8px 12px;border:1px solid #b8e2d2;background:#fff;border-radius:999px;color:var(--brand-strong);font-size:13px;font-weight:850;box-shadow:0 4px 14px rgba(16,24,40,.04)}
.availability-dot{width:9px;height:9px;border-radius:50%;background:#12b76a;box-shadow:0 0 0 5px #dff7eb}
.hero-copy h1{font-size:clamp(44px,5.7vw,72px);line-height:.98;letter-spacing:-.058em;margin:22px 0 18px;max-width:760px}
.hero-copy>p{max-width:650px;font-size:19px;line-height:1.62;color:var(--muted);margin:0}
.hero-ctas{display:flex;gap:11px;flex-wrap:wrap;margin-top:28px}
.hero-ctas .btn{min-width:180px}
.trust-list{display:flex;gap:18px;flex-wrap:wrap;margin-top:22px;color:#475467;font-size:13px;font-weight:730}
.trust-item{display:inline-flex;align-items:center;gap:7px}
.trust-item svg{width:17px;height:17px;color:var(--brand)}
.delivery-preview{position:relative;max-width:420px;margin-left:auto;background:#132033;border-radius:34px;padding:10px;box-shadow:0 30px 70px rgba(16,24,40,.22)}
.delivery-preview:before{content:"";position:absolute;inset:-15px;border:1px solid rgba(8,127,91,.16);border-radius:44px;z-index:-1}
.preview-screen{overflow:hidden;border-radius:25px;background:#f7f9fc}
.preview-top{display:flex;align-items:center;justify-content:space-between;background:#fff;padding:16px 18px;border-bottom:1px solid var(--line)}
.preview-brand{font-weight:900;font-size:14px}
.preview-online{display:inline-flex;align-items:center;gap:6px;color:var(--success);font-size:11px;font-weight:850}
.preview-online:before{content:"";width:7px;height:7px;border-radius:50%;background:#12b76a}
.preview-content{padding:22px}
.preview-kicker{font-size:11px;font-weight:850;letter-spacing:.05em;color:var(--muted);text-transform:uppercase}
.preview-order{font-size:25px;font-weight:900;letter-spacing:-.035em;margin:6px 0 12px}
.preview-status{display:inline-flex;padding:7px 10px;border-radius:999px;background:var(--brand-soft);color:var(--brand-strong);font-size:12px;font-weight:850}
.preview-route{margin-top:18px;background:#fff;border:1px solid var(--line);border-radius:17px;padding:16px}
.preview-stop{display:grid;grid-template-columns:18px 1fr;gap:10px;align-items:start}
.preview-stop+.preview-stop{margin-top:18px}
.preview-route-line{height:22px;width:2px;background:var(--line-strong);margin:2px 0 2px 7px}
.preview-dot{width:16px;height:16px;border:4px solid var(--brand-soft);background:var(--brand);border-radius:50%}
.preview-dot.end{background:#142033;border-color:#e8eaee}
.preview-stop small{display:block;color:var(--muted);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.04em}
.preview-stop strong{font-size:13px;display:block;margin-top:2px}
.preview-footer{display:flex;justify-content:space-between;align-items:center;margin-top:17px;padding-top:14px;border-top:1px solid var(--line);font-size:13px}
.preview-footer span{color:var(--muted)}
.preview-footer strong{font-size:20px}

.section{padding:70px 0}
.section-muted{background:#f7f9fc;border-block:1px solid #eef1f4}
.section-heading{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:28px}
.section-heading-copy{max-width:650px}
.eyebrow{display:block;color:var(--brand);font-size:12px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;margin-bottom:9px}
.section-heading h2{font-size:clamp(30px,4vw,46px);line-height:1.05;letter-spacing:-.045em;margin:0}
.section-heading p{font-size:16px;color:var(--muted);line-height:1.65;margin:11px 0 0}
.steps-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.step-card{position:relative;background:#fff;border:1px solid var(--line);border-radius:20px;padding:22px;box-shadow:0 4px 14px rgba(16,24,40,.04)}
.step-number{width:38px;height:38px;border-radius:13px;background:var(--brand);color:#fff;display:grid;place-items:center;font-weight:900;box-shadow:0 9px 20px rgba(8,127,91,.18)}
.step-card h3{font-size:19px;margin:18px 0 7px;letter-spacing:-.02em}
.step-card p{margin:0;color:var(--muted);line-height:1.58}
.services-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.service-card{min-height:148px;border:1px solid var(--line);border-radius:19px;background:#fff;padding:18px;text-align:left;cursor:pointer;transition:transform .16s,border-color .16s,box-shadow .16s;color:var(--ink)}
.service-card:hover{transform:translateY(-2px);border-color:#a9d8c6;box-shadow:var(--shadow-sm)}
.service-icon{width:46px;height:46px;border-radius:14px;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center;margin-bottom:15px}
.service-icon svg{width:23px;height:23px}
.service-card strong{display:block;font-size:17px;margin-bottom:5px}
.service-card span{font-size:13px;color:var(--muted);line-height:1.45}
.whatsapp-cta{padding:32px 0 72px}
.whatsapp-panel{display:grid;grid-template-columns:1fr auto;gap:28px;align-items:center;background:linear-gradient(135deg,#0b6f50,#0e8f66);color:#fff;border-radius:28px;padding:32px;box-shadow:0 22px 48px rgba(8,127,91,.20)}
.whatsapp-panel h2{font-size:clamp(27px,3.6vw,40px);letter-spacing:-.04em;margin:7px 0 8px}
.whatsapp-panel p{margin:0;color:#d8f3e8;max-width:680px;line-height:1.6}
.whatsapp-panel .eyebrow{color:#baf1da;margin:0}
.whatsapp-panel .btn{background:#fff;color:#0b6f50;white-space:nowrap}
.site-footer{background:#111827;color:#fff;padding:38px 0 96px}
.footer-row{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
.footer-brand .brand-copy strong{color:#fff}
.footer-brand .brand-copy small{color:#9ca3af}
.footer-links{display:flex;gap:18px;flex-wrap:wrap}
.footer-links a{color:#d1d5db;text-decoration:none;font-size:14px;font-weight:700}
.mobile-cta{display:none}

/* Order flow */
.order-dialog{width:min(760px,100%)}
.order-progress{display:flex;gap:6px;margin-bottom:21px}
.order-progress span{height:6px;flex:1;border-radius:99px;background:var(--line)}
.order-progress span.active{background:var(--brand)}
.step-intro{margin-bottom:20px}
.step-intro h2{font-size:27px;letter-spacing:-.035em;margin:0 0 7px}
.step-intro p{margin:0;color:var(--muted);line-height:1.55}
.service-choice-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.service-choice{display:grid;grid-template-columns:48px 1fr 20px;align-items:center;gap:13px;min-height:86px;border:1px solid var(--line);border-radius:17px;background:#fff;padding:14px;text-align:left;cursor:pointer;color:var(--ink)}
.service-choice.active{border:2px solid var(--brand);background:var(--brand-pale);padding:13px}
.service-choice .service-icon{width:48px;height:48px;margin:0}
.service-choice strong{display:block;font-size:15px}
.service-choice small{display:block;color:var(--muted);font-size:12px;margin-top:3px}
.service-choice-check{width:19px;height:19px;border-radius:50%;border:2px solid var(--line-strong);display:grid;place-items:center}
.service-choice.active .service-choice-check{border-color:var(--brand);background:var(--brand);color:#fff}
.location-stack{display:grid;gap:12px}
.location-card{border:1px solid var(--line);border-radius:18px;padding:17px;background:#fff}
.location-head{display:flex;align-items:center;gap:10px;font-weight:850;margin-bottom:14px}
.location-badge{width:31px;height:31px;border-radius:10px;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center}
.location-badge svg{width:17px;height:17px}
.location-card.drop .location-badge{background:#edf0f5;color:#142033}
.route-tools{display:flex;gap:9px;flex-wrap:wrap;margin-top:12px}
.map-wrap{margin-top:12px}
.map{height:290px;border:1px solid var(--line);border-radius:18px;overflow:hidden}
.map-help{font-size:12px;color:var(--muted);margin-top:7px}
.optional-box{margin-top:14px;border:1px solid var(--line);border-radius:16px;background:#fff;overflow:hidden}
.optional-box summary{cursor:pointer;padding:15px 16px;font-weight:800;color:var(--ink-2)}
.optional-content{padding:2px 16px 16px}
.review-card{border:1px solid var(--line);border-radius:18px;background:#fff;overflow:hidden}
.review-row{display:grid;grid-template-columns:145px 1fr;gap:18px;padding:14px 16px;border-bottom:1px solid var(--line)}
.review-row:last-child{border-bottom:0}
.review-row span{font-size:13px;color:var(--muted);font-weight:700}
.review-row strong{text-align:right;word-break:break-word}
.quote-box{margin-top:14px;background:#f7f9fc;border:1px solid var(--line);border-radius:18px;padding:16px}
.quote-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:6px 0;color:var(--ink-2)}
.quote-total{font-size:19px;font-weight:900;border-top:1px solid var(--line);margin-top:8px;padding-top:13px;color:var(--ink)}
.order-confirmation{text-align:center;padding:8px 0}
.success-icon{width:68px;height:68px;border-radius:22px;background:var(--success-soft);color:var(--success);display:grid;place-items:center;margin:0 auto 16px}
.success-icon svg{width:34px;height:34px}
.order-confirmation h2{font-size:28px;letter-spacing:-.035em;margin:0 0 8px}
.order-confirmation p{color:var(--muted);margin:0 0 16px}
.confirmation-note{background:var(--brand-pale);border:1px solid #cbe9dd;border-radius:14px;padding:13px;text-align:left;font-size:14px;margin:14px 0}
.confirmation-actions{display:grid;gap:9px}
.customer-tracking .brand{margin-bottom:22px}

@media(max-width:980px){
  .hero-grid{grid-template-columns:1fr .72fr;gap:38px}
  .hero-copy h1{font-size:52px}
  .services-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
  .site-nav{min-height:68px}
  .site-nav-actions .nav-link,.site-nav-actions .btn-whatsapp{display:none}
  .hero{padding:42px 0 44px}
  .hero-grid{grid-template-columns:1fr;gap:36px}
  .hero-copy{text-align:center}
  .availability{margin-inline:auto}
  .hero-copy h1{font-size:clamp(40px,12vw,56px)}
  .hero-copy>p{font-size:17px;margin-inline:auto}
  .hero-ctas{justify-content:center}
  .trust-list{justify-content:center}
  .delivery-preview{margin-inline:auto;width:min(420px,100%)}
  .steps-grid{grid-template-columns:1fr}
  .section{padding:54px 0}
  .section-heading{display:block;text-align:center}
  .section-heading-copy{margin-inline:auto}
  .whatsapp-panel{grid-template-columns:1fr;text-align:center;padding:26px 22px}
  .whatsapp-panel .btn{width:100%}
  .footer-row{align-items:flex-start;flex-direction:column}
  .mobile-cta{display:grid;grid-template-columns:1fr 52px;gap:9px;position:fixed;left:0;right:0;bottom:0;z-index:100;padding:10px 12px calc(10px + var(--safe-bottom));background:rgba(255,255,255,.97);border-top:1px solid var(--line);backdrop-filter:blur(14px)}
  .mobile-cta .btn{width:100%}
  .mobile-wa{width:52px;height:50px;border-radius:14px;background:#20b66b;color:#fff;display:grid;place-items:center;text-decoration:none}
  .mobile-wa svg{width:23px;height:23px}
}
@media(max-width:600px){
  .hero-ctas{display:grid;grid-template-columns:1fr;width:100%}
  .hero-ctas .btn{width:100%}
  .trust-list{display:grid;gap:9px;text-align:left}
  .services-grid,.service-choice-grid{grid-template-columns:1fr}
  .service-card{min-height:auto;display:grid;grid-template-columns:46px 1fr;gap:13px;align-items:center}
  .service-card .service-icon{margin:0}
  .service-card strong{margin-bottom:3px}
  .review-row{grid-template-columns:1fr;gap:4px}
  .review-row strong{text-align:left}
  .site-footer{padding-bottom:105px}
  .tracking-wrap{padding-top:16px}
}