/* Urban Deal Offers — plum and transit-green, city-map styling */
:root{
  --plum:#3E2163; --plum-dk:#24123A; --plum-lt:#CDB8EA; --green:#1FA971; --green-dk:#127A51;
  --lilac:#F4F2F7; --lilac-2:#E8E3F0; --ink:#1B1225; --muted:#5E566B; --line:#E2DCEA; --paper:#FFFFFF;
  --display:'Barlow Condensed','Barlow',system-ui,sans-serif; --sans:'Barlow',system-ui,-apple-system,'Segoe UI',sans-serif;
  --wrap:1220px; --g:clamp(16px,4vw,40px);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font:400 18px/1.6 var(--sans)}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3,h4{font-family:var(--display);font-weight:700;line-height:1.02;letter-spacing:-.005em;margin:0 0 .45em;color:var(--plum-dk)}
p{margin:0 0 1em}
:focus-visible{outline:3px solid var(--green);outline-offset:3px;border-radius:4px}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--g)}
.skip{position:absolute;left:-999px;top:8px;background:var(--green);color:#fff;padding:8px 14px;z-index:100;font-weight:700}
.skip:focus{left:8px}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;font:700 16px/1 var(--sans);padding:15px 24px;border-radius:6px;text-decoration:none;border:0;cursor:pointer;transition:background .15s,color .15s}
.btn--green{background:var(--green);color:#fff}
.btn--green:hover{background:var(--green-dk)}
.btn--plum{background:var(--plum);color:#fff}
.btn--plum:hover{background:var(--plum-dk)}
.btn--ghost{box-shadow:inset 0 0 0 2px var(--plum);color:var(--plum);background:transparent}
.btn--ghost:hover{background:var(--plum);color:#fff}
.btn--white{background:#fff;color:var(--plum-dk)}
.btn--white:hover{background:var(--lilac-2)}
.btn--sm{padding:11px 16px;font-size:15px}
.go{font-weight:700;color:var(--green-dk);text-decoration:none;display:inline-flex;align-items:center;gap:8px}
.go::after{content:"";width:10px;height:10px;border-radius:50%;border:3px solid currentColor}
.go:hover{color:var(--plum)}

/* ---------- header ---------- */
.ann{background:var(--plum-dk);color:#ddd2ee;font-size:15px}
.ann .wrap{display:flex;justify-content:space-between;gap:12px;min-height:38px;align-items:center;flex-wrap:wrap}
.ann a{color:#fff;text-decoration:none;font-weight:600}
.ann a:hover{color:var(--green)}
.hdr{background:#fff;border-bottom:4px solid var(--green);position:sticky;top:0;z-index:40}
.hdr .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:82px}
.logo img{height:50px;width:auto}
.stations{list-style:none;margin:0;padding:0;display:flex;gap:0;position:relative}
.stations::before{content:"";position:absolute;left:18px;right:18px;top:13px;height:4px;background:var(--line);border-radius:4px}
.stations li{position:relative}
.stations a{display:flex;flex-direction:column;align-items:center;gap:6px;padding:4px 16px;text-decoration:none;font:600 15px/1.2 var(--sans);color:var(--muted)}
.stations a::before{content:"";width:18px;height:18px;border-radius:50%;background:#fff;border:4px solid var(--plum-lt);position:relative;z-index:1;transition:border-color .15s}
.stations a:hover{color:var(--plum)}
.stations a:hover::before{border-color:var(--plum)}
.stations a[aria-current]{color:var(--plum-dk);font-weight:700}
.stations a[aria-current]::before{border-color:var(--green);background:var(--green)}
.mnav{display:none;background:var(--plum);color:#fff;border:0;border-radius:6px;padding:11px 16px;font:700 15px var(--sans);cursor:pointer}
@media (max-width:900px){
  .hdr .wrap{min-height:68px}
  .logo img{height:40px}
  .mnav{display:inline-block}
  .stations{display:none;position:absolute;left:0;right:0;top:100%;background:#fff;flex-direction:column;padding:12px var(--g) 20px;border-bottom:4px solid var(--green);box-shadow:0 20px 30px rgba(27,18,37,.12)}
  .stations[data-open]{display:flex}
  .stations::before{left:calc(var(--g) + 7px);right:auto;top:24px;bottom:30px;width:4px;height:auto}
  .stations a{flex-direction:row;padding:12px 0;font-size:18px;gap:16px}
  .hdr .wrap{position:relative}
  .ann__l{display:none}
}

/* ---------- hero ---------- */
.hero{background:var(--lilac)}
.hero .wrap{display:grid;grid-template-columns:.95fr 1.05fr;gap:52px;align-items:center;padding-top:64px;padding-bottom:72px}
.hero h1{font-size:clamp(52px,7vw,100px);line-height:.92;margin-bottom:22px;letter-spacing:-.015em}
.hero p{font-size:20px;color:var(--muted);max-width:44ch}
.hero__cta{display:flex;gap:12px;flex-wrap:wrap;margin:28px 0 36px}
.route{list-style:none;margin:0;padding:0 0 0 4px;position:relative;display:grid;gap:14px}
.route::before{content:"";position:absolute;left:11px;top:8px;bottom:8px;width:4px;background:var(--green);border-radius:4px}
.route li{display:flex;gap:16px;align-items:center;font-weight:700;font-size:18px;position:relative}
.route li::before{content:"";width:18px;height:18px;border-radius:50%;background:#fff;border:4px solid var(--plum-dk);flex:none}
.hero__img{border-radius:22px;overflow:hidden;box-shadow:0 30px 60px rgba(36,18,58,.18)}
@media (max-width:960px){.hero .wrap{grid-template-columns:1fr;padding-top:40px;gap:36px}}

/* ---------- sections ---------- */
.sec{padding:88px 0}
.sec--lilac{background:var(--lilac)}
.sec--plum{background:var(--plum);color:#e6dcf3}
.sec--plum h2,.sec--plum h3{color:#fff}
.title{display:flex;justify-content:space-between;align-items:end;gap:20px;flex-wrap:wrap;margin-bottom:40px}
.title h2{font-size:clamp(40px,5vw,64px);margin:0}
.title p{margin:6px 0 0;color:var(--muted);max-width:52ch}
.sec--plum .title p{color:var(--plum-lt)}
@media (max-width:700px){.sec{padding:60px 0}}

/* ---------- the deal line ---------- */
.line{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(8,1fr);gap:10px;position:relative}
.line::before{content:"";position:absolute;left:4%;right:4%;top:calc((100% - 70px)/2);height:8px;background:linear-gradient(90deg,var(--green),var(--plum));border-radius:8px;z-index:0;top:62px}
.line a{display:flex;flex-direction:column;align-items:center;text-align:center;text-decoration:none;position:relative;z-index:1}
.line img{width:132px;height:132px;border-radius:50%;object-fit:cover;background:#fff;transition:transform .2s}
.line a:hover img{transform:scale(1.06)}
.line strong{display:block;margin-top:12px;font:700 21px/1.1 var(--display);color:var(--plum-dk)}
.line span{font-size:14px;color:var(--muted);font-weight:600}
.line a:hover strong{color:var(--green-dk)}
@media (max-width:1150px){.line img{width:104px;height:104px}.line::before{top:48px}}
@media (max-width:860px){
  .line{grid-template-columns:1fr;gap:0}
  .line::before{left:43px;right:auto;top:20px;bottom:20px;width:8px;height:auto;background:linear-gradient(var(--green),var(--plum))}
  .line a{flex-direction:row;text-align:left;gap:18px;padding:8px 0}
  .line img{width:94px;height:94px}
  .line strong{margin-top:0}
}

/* ---------- product cards ---------- */
.bento{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.bento .card:first-child{grid-column:span 2;grid-row:span 2}
.bento .card:first-child .card__img{aspect-ratio:auto;flex:1;min-height:0}
.bento .card:first-child .card__body{flex:0 0 auto}
.bento .card:first-child h3{font-size:28px}
.bento .more{grid-column:span 1;min-height:220px;background:var(--plum);border-radius:16px;display:flex;flex-direction:column;justify-content:space-between;padding:24px;color:#fff;text-decoration:none}
.bento .more h3{color:#fff;font-size:30px}
.bento .more:hover{background:var(--plum-dk)}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.grid--4{grid-template-columns:repeat(4,1fr)}
.card{background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;display:flex;flex-direction:column;scroll-margin-top:110px}
.card[hidden]{display:none}
.card:target{box-shadow:0 0 0 3px var(--green)}
.card__img{aspect-ratio:1/1;background:var(--lilac);padding:16px;display:grid;place-items:center}
.card__img img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply}
.card__body{padding:16px 18px 20px;display:flex;flex-direction:column;gap:12px;flex:1}
.card small{font-weight:700;font-size:13px;color:var(--green-dk)}
.card h3{font:600 18px/1.35 var(--sans);letter-spacing:0;color:var(--ink);margin:0;flex:1}
.card__foot{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap}
.card__foot .btn{white-space:nowrap}
.price{font:700 28px/1 var(--display);color:var(--plum-dk)}
@media (max-width:1000px){.bento,.grid--4{grid-template-columns:repeat(2,1fr)}.bento .card:first-child{grid-row:span 1}.grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.bento,.grid,.grid--4{gap:12px}.card__body{padding:12px}.card h3{font-size:15px}.card__foot{flex-direction:column;align-items:stretch}.price{font-size:24px}.bento .card:first-child h3{font-size:20px}}

/* ---------- tabs / filters ---------- */
.tabs{display:flex;gap:6px;overflow-x:auto;border-bottom:2px solid var(--line);margin-bottom:26px;scrollbar-width:thin}
.tabs button{border:0;background:none;padding:12px 16px;font:700 16px var(--sans);color:var(--muted);cursor:pointer;white-space:nowrap;border-bottom:4px solid transparent;margin-bottom:-2px}
.tabs button:hover{color:var(--plum)}
.tabs button[aria-selected="true"]{color:var(--plum-dk);border-bottom-color:var(--green)}
.tools{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;margin-bottom:26px;background:var(--lilac);border-radius:14px;padding:16px 20px}
.tools p{margin:0;font-weight:700}
.tools label{display:flex;align-items:center;gap:12px;font-weight:600;font-size:16px}
.tools input[type=range]{width:200px;accent-color:var(--green)}
.tools output{font:700 20px var(--display);color:var(--plum-dk);min-width:60px}
.tools select{font:inherit;font-size:16px;padding:9px 12px;border:2px solid var(--line);border-radius:8px;background:#fff}
.none{display:none;padding:40px;text-align:center;background:var(--lilac);border-radius:16px}
.none[data-show]{display:block}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips a{border:2px solid var(--line);border-radius:999px;padding:7px 14px;font-weight:600;font-size:15px;text-decoration:none}
.chips a:hover{border-color:var(--plum)}
.chips a[aria-current]{background:var(--plum);color:#fff;border-color:var(--plum)}

/* ---------- promos ---------- */
.promos{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.promo{border-radius:20px;overflow:hidden;text-decoration:none;display:flex;flex-direction:column}
.promo div{padding:28px 30px}
.promo p{margin:0 0 4px;font-weight:600}
.promo h3{font-size:36px;margin-bottom:16px}
.promo--green{background:var(--green);color:#e8fff3}
.promo--green h3{color:#fff}
.promo--plum{background:var(--plum);color:#e6dcf3}
.promo--plum h3{color:#fff}
@media (max-width:860px){.promos{grid-template-columns:1fr}}

/* ---------- about split ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.split>*{min-width:0}
.split img{border-radius:20px}
.split .lead{font-size:clamp(21px,2.2vw,26px);line-height:1.4;font-weight:600}
@media (max-width:900px){.split{grid-template-columns:1fr;gap:32px}}
.promises{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.promise{border-radius:16px;padding:24px;background:#fff;border:1px solid var(--line);position:relative}
.sec--plum .promise{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.14)}
.promise::before{content:"";display:block;width:22px;height:22px;border-radius:50%;border:5px solid var(--green);margin-bottom:14px;background:#fff}
.promise h3{font-size:26px;margin-bottom:6px}
.promise p{margin:0;font-size:17px}
.sec:not(.sec--plum) .promise p{color:var(--muted)}
@media (max-width:900px){.promises{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.promises{grid-template-columns:1fr}}

/* ---------- blog ---------- */
.stories{display:grid;gap:22px}
.story{display:grid;grid-template-columns:300px 1fr;gap:28px;align-items:center;text-decoration:none;padding:18px;border-radius:18px;border:1px solid var(--line);background:#fff}
.story img{border-radius:12px;aspect-ratio:5/3;object-fit:cover;width:100%}
.story h3{font-size:clamp(26px,3vw,34px);margin-bottom:8px}
.story p{color:var(--muted);margin:0 0 10px;font-size:17px}
.story .meta{font-weight:700;font-size:14px;color:var(--green-dk)}
.story:hover{border-color:var(--plum)}
.story:hover h3{color:var(--plum)}
@media (max-width:760px){.story{grid-template-columns:1fr;gap:14px}}

/* ---------- page head ---------- */
.ph{background:var(--plum);color:#e6dcf3;padding:46px 0 52px;position:relative;overflow:hidden}
.ph::after{content:"";position:absolute;left:0;right:0;bottom:22px;height:6px;background:var(--green)}
.ph::before{content:"";position:absolute;right:12%;bottom:14px;width:22px;height:22px;border-radius:50%;background:#fff;border:5px solid var(--plum-dk);z-index:1}
.ph h1{color:#fff;font-size:clamp(44px,6vw,80px);margin:8px 0 0;max-width:20ch}
.ph p{margin:12px 0 0;max-width:60ch;font-size:19px}
.crumbs{font-size:15px;display:flex;gap:8px;flex-wrap:wrap}
.crumbs a{color:#fff;font-weight:700;text-decoration:none}
.crumbs a:hover{color:var(--green)}

/* ---------- article ---------- */
.art{max-width:760px;margin:0 auto}
.art__img{border-radius:20px;width:100%;margin-bottom:36px}
.prose{font-size:19px;line-height:1.75}
.prose>p:first-child{font-size:22px;color:var(--plum-dk);line-height:1.55}
.prose h2{font-size:36px;margin:1.4em 0 .4em}
.prose h3{font-size:26px;margin:1.3em 0 .4em}
.prose a{color:var(--green-dk);text-decoration-thickness:2px;text-underline-offset:3px;word-break:break-word}
.prose ul,.prose ol{padding-left:1.3em}
.prose li{margin-bottom:.5em}
.prose li::marker{color:var(--green);font-weight:700}

/* ---------- policies ---------- */
.pol{display:grid;grid-template-columns:240px minmax(0,1fr);gap:56px;align-items:start}
.toc{position:sticky;top:110px}
.toc h2{font-size:22px}
.toc ol{list-style:none;margin:0;padding:0 0 0 4px;position:relative;display:grid;gap:4px}
.toc ol::before{content:"";position:absolute;left:11px;top:12px;bottom:12px;width:4px;background:var(--line)}
.toc a{display:flex;gap:14px;align-items:center;padding:6px 0;text-decoration:none;font-weight:600;font-size:15px;line-height:1.3;color:var(--muted);position:relative}
.toc a::before{content:"";flex:none;width:18px;height:18px;border-radius:50%;background:#fff;border:4px solid var(--plum-lt)}
.toc a:hover{color:var(--plum-dk)}
.toc a:hover::before{border-color:var(--green)}
.clause{scroll-margin-top:110px;padding-bottom:10px}
.clause h2{font-size:30px;display:flex;gap:14px;align-items:baseline}
.clause h2 span{font:700 18px var(--sans);color:var(--green-dk)}
.updated{font-weight:700;color:var(--muted)}
.dtable{width:100%;border-collapse:collapse;margin:8px 0 36px;font-size:16px}
.dtable th{text-align:left;background:var(--plum);color:#fff;padding:12px 14px;font-weight:700}
.dtable td{padding:12px 14px;border-bottom:1px solid var(--line);vertical-align:top}
.dtable tr:nth-child(even) td{background:var(--lilac)}
.faq details{border:1px solid var(--line);border-radius:14px;margin-bottom:10px;background:#fff}
.faq summary{cursor:pointer;list-style:none;padding:18px 22px;font:700 22px/1.2 var(--display);color:var(--plum-dk);display:flex;justify-content:space-between;gap:16px;align-items:center}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";flex:none;width:16px;height:16px;border-radius:50%;border:4px solid var(--plum-lt)}
.faq details[open] summary::after{background:var(--green);border-color:var(--green)}
.faq details[open]{border-color:var(--plum-lt)}
.faq .prose{padding:0 22px 18px;font-size:18px}
@media (max-width:900px){.pol{grid-template-columns:1fr}.toc{position:static}.dtable thead{display:none}.dtable tr{display:block;border-bottom:2px solid var(--line);padding:8px 0}.dtable td{display:block;border:0;padding:4px 0;background:none!important}.dtable td::before{content:attr(data-h);display:block;font-weight:700;font-size:13px;color:var(--green-dk)}}

/* ---------- contact & forms ---------- */
.cwrap{display:grid;grid-template-columns:.9fr 1.1fr;gap:28px;align-items:stretch}
.cinfo{background:var(--plum);color:#e6dcf3;border-radius:20px;padding:clamp(24px,4vw,40px);display:flex;flex-direction:column;gap:22px}
.cinfo h2{color:#fff;font-size:40px;margin:0}
.cinfo dl{margin:0;display:grid;gap:18px}
.cinfo dt{font-weight:700;color:var(--green);font-size:15px}
.cinfo dd{margin:2px 0 0;font-size:19px}
.cinfo a{color:#fff;text-decoration:none;font-weight:600;word-break:break-word}
.cinfo a:hover{text-decoration:underline}
.map{border:0;width:100%;height:240px;border-radius:14px;display:block;margin-top:auto}
.panel{background:#fff;border:1px solid var(--line);border-radius:20px;padding:clamp(24px,4vw,40px)}
.panel h2{font-size:38px}
.fld{display:block;margin-bottom:16px}
.fld>span{display:block;font-weight:700;font-size:16px;margin-bottom:6px}
.fld input,.fld textarea{width:100%;font:inherit;font-size:17px;padding:13px 15px;border:2px solid var(--line);border-radius:8px;background:var(--lilac);color:var(--ink)}
.fld input:focus,.fld textarea:focus{outline:none;border-color:var(--green);background:#fff}
.calc{display:inline-block;margin-left:6px;background:var(--green);color:#fff;border-radius:6px;padding:0 10px;font-weight:700}
.agree{display:flex;gap:12px;align-items:flex-start;margin:4px 0 22px;font-size:16px;color:var(--muted)}
.agree input{width:22px;height:22px;accent-color:var(--green);flex:none;margin-top:2px}
.err{color:#B3261E;font-weight:700;min-height:1em;margin:0 0 12px}
.ok{display:none;background:#E6F6EE;border-left:6px solid var(--green);border-radius:10px;padding:16px 18px;margin-top:18px;font-weight:600}
.ok h3{font-size:24px;margin-bottom:6px}
.ok p{margin:0;font-weight:400}
.single{max-width:640px;margin:0 auto}
@media (max-width:900px){.cwrap{grid-template-columns:1fr}}

/* ---------- footer ---------- */
.foot{background:var(--plum-dk);color:#c9bddc;padding:72px 0 0;font-size:17px;position:relative}
.foot::before{content:"";position:absolute;left:0;right:0;top:0;height:6px;background:var(--green)}
.foot__grid{display:grid;grid-template-columns:1.3fr 1fr 1fr 1.2fr;gap:36px}
.foot h2{color:#fff;font-size:24px;margin-bottom:14px}
.foot ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.foot a{color:#f1ebfa;text-decoration:none}
.foot a:hover{color:var(--green)}
.foot .logo img{height:46px;margin-bottom:16px}
.stop{border-left:4px solid var(--green);padding-left:16px;display:grid;gap:10px}
.stop b{color:#fff}
.foot__bar{border-top:1px solid rgba(255,255,255,.12);margin-top:56px;padding:20px 0;font-size:15px}
.foot__bar .wrap{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
@media (max-width:900px){.foot__grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.foot__grid{grid-template-columns:1fr}}
