/* =========================================================================
   City landing pages (template-parts/page-city.php, inc/families/city.php)
   ========================================================================= */

.city .screen-reader-text{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}

/* ---------- Hero ---------- */
.city-hero{padding-bottom:96px}
.city-hero:has(+ .city-pillars){padding-bottom:132px}
.city-hero__grid.has-media{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px}
.city-hero__kicker{display:inline-flex;align-items:center;gap:8px}
.city-hero__kicker .city-icon{color:var(--gold)}
.city-hero__title em{font-style:normal;color:var(--gold);position:relative;white-space:nowrap}
.city-hero__sub{margin:18px 0 0;font-size:20px;font-weight:800;line-height:1.7;color:#fff}
.city-hero__lead{font-size:16px;line-height:2.05;margin-top:14px}
.city-hero__lead p:last-child{margin-bottom:0}

/* ---------- Map ---------- */
.city-map{position:relative;align-self:center;min-width:0}
.city-map__frame{position:relative;padding:18px;border-radius:32px;background:radial-gradient(420px circle at 60% 40%,rgba(42,74,154,.35),transparent 70%),rgba(255,255,255,.02);border:1px solid var(--hair)}
.city-map__svg{display:block;width:100%;height:auto;overflow:visible}
.city-map__land{fill:none;stroke:rgba(169,182,207,.26);stroke-width:4.4;stroke-linecap:round}
.city-map__sea{fill:rgba(169,182,207,.55);font-family:var(--font);font-size:10.5px;font-weight:700;letter-spacing:.5px}
.city-map__abroad path{fill:none;stroke:rgba(169,182,207,.7);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.city-map__abroad text{fill:rgba(169,182,207,.85);font-family:var(--font);font-size:10.5px;font-weight:700}

.city-map__city{cursor:default}
.city-map__city.is-linked{cursor:pointer}
.city-map__halo{fill:transparent;transition:fill .2s}
.city-map__dot{fill:rgba(169,182,207,.75);transform-box:fill-box;transform-origin:center;transition:transform .2s,fill .2s}
.city-map__city.is-linked .city-map__dot{fill:#E8EDF7;stroke:rgba(157,190,240,.55);stroke-width:2}
.city-map__city:hover .city-map__halo,.city-map__city:focus-visible .city-map__halo,.city-map__city.is-hot .city-map__halo{fill:rgba(243,188,0,.22)}
.city-map__city:hover .city-map__dot,.city-map__city:focus-visible .city-map__dot,.city-map__city.is-hot .city-map__dot{fill:var(--gold);transform:scale(1.5)}
.city-map__city:focus{outline:none}

.city-map__office-ring{fill:rgba(42,74,154,.45);stroke:rgba(157,190,240,.5);stroke-width:1;transform-box:fill-box;transform-origin:center}
.city-map__office-pin{fill:#153D8A;stroke:#fff;stroke-width:1.6}
.city-map__office-core{fill:#fff}
.city-map__label{font-family:var(--font);font-size:10.5px;font-weight:800;fill:#fff;paint-order:stroke;stroke:#0A1430;stroke-width:3px;stroke-linejoin:round}
.city-map__city.is-office:hover .city-map__office-pin{fill:#2A4A9A}

.city-map__route-glow{fill:none;stroke:rgba(243,188,0,.18);stroke-width:7;stroke-linecap:round}
.city-map__route-line{fill:none;stroke:var(--gold);stroke-width:2.2;stroke-linecap:round;stroke-dasharray:5 6}
.city-map__runner{fill:#fff;stroke:var(--gold);stroke-width:2}
.city-map__km rect{fill:rgba(10,20,48,.9);stroke:rgba(243,188,0,.7);stroke-width:1}
.city-map__km text{fill:#FFD34D;font-family:var(--font);font-size:10.5px;font-weight:800}

.city-map__pulse{fill:none;stroke:var(--gold);stroke-width:2;opacity:0;transform-box:fill-box;transform-origin:center}
.city-map__pin{fill:var(--gold);stroke:#0A1430;stroke-width:1.5;filter:drop-shadow(0 6px 10px rgba(243,188,0,.45))}
.city-map__pin-core{fill:#0A1430}
.city-map__tag rect{fill:#fff;filter:drop-shadow(0 6px 14px rgba(0,0,0,.35))}
.city-map__tag text{fill:#0A1430;font-family:var(--font);font-size:12.5px;font-weight:900}

.has-motion .city-map__route-line{animation:city-march 1.1s linear infinite}
.has-motion .city-map__pulse{animation:city-pulse 2.4s ease-out infinite}
.has-motion .city-map__pulse--2{animation-delay:1.2s}
.has-motion .city-map__office-ring{animation:city-breathe 3.6s ease-in-out infinite}
.has-motion .city-map__pin{animation:city-bob 3s ease-in-out infinite}
.has-motion .city-map__here .city-map__pin-core{animation:city-bob 3s ease-in-out infinite}
@keyframes city-march{to{stroke-dashoffset:-22}}
@keyframes city-pulse{0%{opacity:.9;transform:scale(.6)}100%{opacity:0;transform:scale(3.6)}}
@keyframes city-breathe{50%{transform:scale(1.25);opacity:.6}}
@keyframes city-bob{50%{transform:translateY(-3px)}}

.city-map__tip{position:absolute;z-index:3;top:0;left:0;padding:5px 12px;border-radius:999px;background:#fff;color:#0A1430;font-size:13px;font-weight:800;white-space:nowrap;pointer-events:none;box-shadow:0 10px 24px rgba(0,0,0,.35);transform:translate(-50%,calc(-100% - 12px))}
.city-map__tip::after{content:"";position:absolute;left:50%;bottom:-5px;width:10px;height:10px;margin-left:-5px;background:#fff;transform:rotate(45deg)}
.city-map__tip small{font-weight:700;color:var(--gold-ink);margin-inline-start:6px}

.city-map__chips{position:absolute;inset:0;pointer-events:none}
.city-chip{position:absolute;display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border-radius:16px;background:#fff;color:#0A1430;font-size:13px;font-weight:700;line-height:1.5;box-shadow:0 16px 36px rgba(0,0,0,.3);pointer-events:auto;max-width:78%}
.city-chip b{font-weight:900}
.city-chip .rt-icon,.city-chip .city-icon{flex:none;color:#153D8A}
.city-chip--gold{top:14px;right:-14px;background:var(--gold)}
.city-chip--gold .rt-icon{color:#0A1430}
.city-chip:not(.city-chip--gold){bottom:14px;left:-14px}
.has-motion .city-chip--gold{animation:city-float 6s ease-in-out infinite}
.has-motion .city-chip:not(.city-chip--gold){animation:city-float 6s ease-in-out 3s infinite}
@keyframes city-float{50%{transform:translateY(-6px)}}

.city-map__legend{list-style:none;margin:16px 0 0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:6px 18px;font-size:12.5px;color:var(--on-ink-2)}
.city-map__legend li{display:inline-flex;align-items:center;gap:7px}
.city-map__legend i{width:10px;height:10px;border-radius:50%;background:rgba(169,182,207,.75)}
.city-map__legend i.is-here{background:var(--gold);box-shadow:0 0 0 3px rgba(243,188,0,.25)}
.city-map__legend i.is-office{background:#153D8A;box-shadow:0 0 0 2px #fff}
.city-map__legend i.is-linked{background:#E8EDF7;box-shadow:0 0 0 2px rgba(157,190,240,.55)}

/* ---------- Shared bits ---------- */
.city-head__lead{margin-top:12px;color:var(--muted);line-height:2}
.city-head__lead p{margin:0}
.city .sv-split__text .city-head,.city-form__intro .city-head,.city-does__text .city-head,.city-story__main .city-head{text-align:start;margin:0 0 4px;max-width:none}
.city-sub{margin:10px 0 0;font-size:17px;font-weight:700;color:var(--muted)}
.city-btns{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:36px 0 0}
.city .sv-split__text .city-btns,.city-form__intro .city-btns,.city-story__main .city-btns,.city-call .city-btns{justify-content:flex-start;margin-top:22px}
.city-arrow{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none;transition:transform .2s}
.city [data-rise]{--d:0ms}
.has-motion .city [data-rise]{transition-delay:var(--d)}

/* ---------- Pillars (under the hero) ---------- */
.city-pillars{position:relative;z-index:2;margin-top:-72px}
.city-pillars__grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(var(--n,4),minmax(0,1fr));gap:0;background:var(--card);border:1px solid var(--line);border-radius:28px;box-shadow:0 24px 60px var(--shadow);overflow:hidden}
.city-pillar{position:relative;display:flex;align-items:center;gap:14px;padding:26px 24px}
.city-pillar+.city-pillar{border-inline-start:1px solid var(--line)}
.city-pillar__icon{flex:none;width:52px;height:52px;border-radius:16px;display:flex;align-items:center;justify-content:center;background:var(--ink);color:var(--gold);transition:transform .3s}
.city-pillar__icon svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.city-pillar__icon .d{fill:rgba(243,188,0,.35)}
.city-pillar b{font-size:16px;font-weight:900;line-height:1.6;color:var(--ink-text)}
.city-pillar__n{position:absolute;top:10px;inset-inline-end:16px;font-family:var(--font-lat);font-size:28px;font-weight:700;color:var(--line);line-height:1}
.city-pillar:hover .city-pillar__icon{transform:rotate(-8deg) scale(1.06)}

/* ---------- Steps ---------- */
.city-steps__list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;counter-reset:cs}
.city-step{position:relative;display:flex;flex-direction:column;padding:0 0 26px;border-radius:26px;background:var(--card);border:1px solid var(--line);box-shadow:0 18px 40px var(--shadow);transition:transform .3s}
.city-step:hover{transform:translateY(-6px)}
.city-step__img{margin:0;border-radius:26px 26px 0 0;overflow:hidden;aspect-ratio:3/2}
.city-step__img img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .6s}
.city-step:hover .city-step__img img{transform:scale(1.05)}
.city-step__n{position:relative;z-index:1;width:58px;height:58px;margin:-29px auto 0;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--gold);color:#0A1430;font-size:24px;font-weight:900;border:5px solid var(--card);box-shadow:0 8px 18px rgba(243,188,0,.35)}
.city-step p{margin:14px 24px 0;text-align:center;font-size:16px;line-height:2;color:var(--text)}
.city-step:not(:last-child)::after{content:"←";position:absolute;z-index:2;top:42%;inset-inline-end:-30px;width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--gold);color:#0A1430;font-weight:900;font-size:16px;box-shadow:0 6px 14px rgba(243,188,0,.35)}

/* ---------- Split / tags ---------- */
.city-split .rt-prose p{line-height:2.05}
.city-tags{list-style:none;margin:20px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.city-tags li>a,.city-tags li>span{display:inline-flex;align-items:center;gap:10px;padding:8px 16px 8px 8px;border-radius:999px;background:var(--card);border:1px solid var(--line);font-weight:800;font-size:15px;color:var(--ink-text);transition:transform .2s,border-color .2s,box-shadow .2s}
.city-tags li>a:hover{transform:translateY(-3px);border-color:var(--gold);box-shadow:0 10px 24px var(--shadow)}
.city-tags i{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(243,188,0,.16);color:var(--gold-ink)}
.city-tags svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.city-tags .d{fill:rgba(243,188,0,.4)}

/* ---------- Logos ---------- */
.city-logos__grid{grid-template-columns:repeat(auto-fit,minmax(150px,200px));justify-content:center;gap:16px}
.city-logos__grid span{height:110px}
.city-logos__grid figure{margin:0;display:flex;align-items:center;justify-content:center;width:100%;height:100%}
.city-logos__grid img{max-height:80px}

/* ---------- Form block ---------- */
.city-form__intro h2{margin-top:6px}
.city-form__text{margin-top:14px}
.city-form__text p{line-height:2.05}
.city-nums{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:22px}
.city-num{padding:18px 20px;border-radius:20px;background:var(--card);border:1px solid var(--line);position:relative;overflow:hidden}
.city-num::after{content:"";position:absolute;inset-inline-end:-20px;bottom:-20px;width:80px;height:80px;border-radius:50%;background:radial-gradient(circle,rgba(243,188,0,.22),transparent 70%)}
.city-num b{display:block;font-size:34px;font-weight:900;line-height:1.2;color:var(--ink-text)}
.city-num>span{color:var(--muted);font-weight:700;font-size:14px}
.city-form__img{margin:24px 0 0}
.city-form__img img{display:block;width:100%;max-height:340px;object-fit:contain;border-radius:22px}
.city-form__box{position:relative}
.city-form__top{display:flex;align-items:center;gap:14px;margin-bottom:18px;padding-bottom:16px;border-bottom:1px dashed var(--line)}
.city-form__top h3{margin:0;font-size:20px;font-weight:900;color:var(--ink-text)}
.city-form__top p{margin:2px 0 0;font-size:14px;color:var(--muted)}
.city-form__icon{flex:none;width:48px;height:48px;border-radius:16px;display:flex;align-items:center;justify-content:center;background:var(--gold);color:#0A1430}
.city-form__icon svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.city-form__icon .d{fill:rgba(10,20,48,.2)}

/* ---------- Portfolio (dark band) ---------- */
.sv-sec.city-work{background:var(--ink);color:var(--on-ink);margin:16px;border-radius:36px;overflow:hidden;isolation:isolate}
.city-work::before{content:"";position:absolute;z-index:-1;inset:0;background:radial-gradient(600px circle at 90% 0%,rgba(42,74,154,.45),transparent 60%),radial-gradient(500px circle at 0% 100%,rgba(243,188,0,.14),transparent 60%)}
.city-work .sv-head h2{color:#fff}
.city-work .card-grid{grid-template-columns:repeat(2,minmax(0,1fr));max-width:900px;margin-inline:auto}
.city-work .card{background:var(--ink-2);border-color:var(--hair)}
.city-work .card__title a{color:#fff}
.city-work .card__excerpt{color:var(--on-ink-2)}

/* ---------- "We build" sentence ---------- */
.city-build__head{max-width:900px}
.city-build__head h2{font-size:40px;line-height:1.6}
.city-build__rot{position:relative;display:inline-block;color:var(--gold-ink);white-space:nowrap}
.city-build__rot::after{content:"";position:absolute;inset-inline:0;bottom:2px;height:10px;border-radius:6px;background:rgba(243,188,0,.28);z-index:-1}
.city-build__rot>span{display:inline-block;transition:opacity .35s,transform .35s}
.city-build__rot.is-out>span{opacity:0;transform:translateY(12px)}
.city-build__cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.city-build__card{text-align:center;transition:transform .3s,border-color .3s}
.city-build__card .sv-feature__icon{margin-inline:auto}
.city-build__card h3{margin:16px 0 0;font-size:20px;font-weight:900;color:var(--ink-text)}
.city-build__card p{margin:8px 0 0;color:var(--muted)}
.city-build__card.is-on{border-color:var(--gold);transform:translateY(-6px)}

/* ---------- City story ---------- */
.city-story__grid{display:grid;grid-template-columns:320px minmax(0,1fr);gap:48px;align-items:start}
.city-story__side{position:sticky;top:120px}
.city-story__card{position:relative;overflow:hidden;padding:28px;border-radius:28px;background:var(--ink);color:var(--on-ink);box-shadow:0 26px 54px var(--shadow)}
.city-story__card::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(169,182,207,.22) 1.4px,transparent 1.6px);background-size:14px 14px;-webkit-mask-image:radial-gradient(ellipse 80% 60% at 100% 0%,#000,transparent 75%);mask-image:radial-gradient(ellipse 80% 60% at 100% 0%,#000,transparent 75%)}
.city-story__card>*{position:relative}
.city-story__pin{width:48px;height:48px;border-radius:16px;display:flex;align-items:center;justify-content:center;background:var(--gold);color:#0A1430}
.city-story__label{display:block;margin-top:18px;color:var(--on-ink-2);font-size:14px;font-weight:700}
.city-story__name{display:block;font-size:40px;font-weight:900;line-height:1.3;color:#fff}
.city-story__facts{margin:18px 0 22px;display:flex;flex-direction:column;gap:8px}
.city-story__facts div{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-top:1px solid var(--hair);font-size:14px}
.city-story__facts dt{color:var(--on-ink-2)}
.city-story__facts dd{margin:0;font-weight:800;color:#fff;text-align:end}
.city-story__card .btn{width:100%;justify-content:center}
.city-story__title{margin:6px 0 0;font-size:32px;line-height:1.5;font-weight:900;color:var(--ink-text)}
.city-story__body{position:relative;margin-top:18px}
.city-story__body .rt-prose p{line-height:2.1}
.city-story__body.is-folded{max-height:560px;overflow:hidden}
.city-story__body.is-folded::after{content:"";position:absolute;inset:auto 0 0;height:160px;background:linear-gradient(to bottom,transparent,var(--sec-bg,var(--paper)))}
.city-story__more{display:inline-flex;align-items:center;gap:8px;margin-top:14px;padding:10px 20px;border-radius:999px;border:1px solid var(--line);background:var(--card);font-weight:800;color:var(--ink-text);cursor:pointer;transition:border-color .2s}
.city-story__more:hover{border-color:var(--gold)}
.city-story__more svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .3s}
.city-story__more[aria-expanded="true"] svg{transform:rotate(180deg)}
.sv-sec.city-story:nth-of-type(odd){--sec-bg:var(--paper)}
.sv-sec.city-story:nth-of-type(even){--sec-bg:var(--card)}

/* ---------- What Ratin does ---------- */
.city-does__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:center}
.city-does__text h2{margin:6px 0 0;font-size:32px;line-height:1.5;font-weight:900;color:var(--ink-text)}
.city-does__text .rt-prose{margin-top:12px}
.city-does__img{margin:22px 0 0}
.city-does__img img{display:block;width:100%;border-radius:24px;box-shadow:0 22px 44px var(--shadow)}
.city-does__list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.city-does__list li>a,.city-does__list li>span{display:flex;align-items:center;gap:12px;height:100%;padding:16px;border-radius:18px;background:var(--card);border:1px solid var(--line);color:var(--ink-text);transition:transform .2s,border-color .2s,box-shadow .2s}
.city-does__list li>a:hover{transform:translateY(-3px);border-color:var(--gold);box-shadow:0 12px 28px var(--shadow)}
.city-does__list li>a:hover .city-arrow{transform:translateX(-4px)}
.city-does__list i{flex:none;width:42px;height:42px;border-radius:14px;display:flex;align-items:center;justify-content:center;background:var(--ink);color:var(--gold)}
.city-does__list i svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.city-does__list i .d{fill:rgba(243,188,0,.35)}
.city-does__list b{flex:1;font-size:15px;font-weight:800;line-height:1.6}

/* ---------- Call band ---------- */
.city-call{padding-block:24px 72px;background:var(--paper)}
.city-call__box{display:flex;align-items:center;gap:28px;padding:32px 36px;border-radius:30px;background:var(--card);border:1px solid var(--line);box-shadow:0 24px 50px var(--shadow);position:relative;overflow:hidden}
.city-call__box::before{content:"";position:absolute;inset-block:0;inset-inline-start:0;width:8px;background:linear-gradient(var(--gold),#FFD34D)}
.city-call__ring{flex:none;width:72px;height:72px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--ink);color:var(--gold)}
.city-call__ring .ring{width:40px;height:40px}
.city-call__text{flex:1}
.city-call__text h2{margin:0;font-size:26px;font-weight:900;color:var(--ink-text)}
.city-call__text p{margin:6px 0 0;color:var(--muted)}
.city-call__actions{display:flex;flex-direction:column;align-items:flex-start;gap:10px}
.city-call__actions .city-btns{margin:0}
.city-call__tel{font-size:20px;font-weight:900;color:var(--ink-text)}

/* ---------- Statement ---------- */
.city-quote{padding-block:16px}
.city-quote__box{position:relative;margin:0;padding:64px 48px;border-radius:36px;background:var(--navy-bg);color:#fff;text-align:center;overflow:hidden;isolation:isolate}
.city-quote__box::before{content:"";position:absolute;z-index:-1;inset:0;background:radial-gradient(500px circle at 15% 120%,rgba(243,188,0,.28),transparent 60%),radial-gradient(500px circle at 90% -20%,rgba(255,255,255,.12),transparent 60%)}
.city-quote__mark{width:54px;height:40px;fill:var(--gold);opacity:.9}
.city-quote__box p{margin:14px auto 0;max-width:780px;font-size:34px;line-height:1.6;font-weight:900;text-wrap:balance}

/* ---------- Services hub ---------- */
.city-hub__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.city-hub__card{position:relative;display:flex;flex-direction:column;gap:6px;padding:22px;border-radius:22px;background:var(--card);border:1px solid var(--line);color:var(--text);overflow:hidden;transition:transform .25s,border-color .25s,box-shadow .25s}
.city-hub__card::after{content:"";position:absolute;inset-inline-end:-40px;top:-40px;width:110px;height:110px;border-radius:50%;background:radial-gradient(circle,rgba(243,188,0,.18),transparent 70%);transition:transform .4s}
.city-hub__card:hover{transform:translateY(-5px);border-color:var(--gold);box-shadow:0 18px 40px var(--shadow);color:var(--text)}
.city-hub__card:hover::after{transform:scale(1.6)}
.city-hub__card b{margin-top:10px;font-size:17px;font-weight:900;color:var(--ink-text)}
.city-hub__card>span:not(.city-hub__icon){font-size:14px;color:var(--muted);line-height:1.8}
.city-hub__card .city-arrow{position:absolute;inset-inline-end:18px;bottom:20px;color:var(--gold-ink)}
.city-hub__card:hover .city-arrow{transform:translateX(-4px)}
.city-hub__icon{width:46px;height:46px;border-radius:14px;display:flex;align-items:center;justify-content:center;background:var(--ink);color:var(--gold)}
.city-hub__icon svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.city-hub__icon .d{fill:rgba(243,188,0,.35)}
.city-hub__card.is-current{background:var(--ink);border-color:var(--ink)}
.city-hub__card.is-current b{color:#fff}
.city-hub__card.is-current>span:not(.city-hub__icon){color:var(--on-ink-2)}
.city-hub__card.is-current .city-hub__icon{background:var(--gold);color:#0A1430}
.city-hub__same{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px;margin-top:28px}
.city-hub__same>span{display:inline-flex;align-items:center;gap:6px;font-weight:800;color:var(--ink-text)}
.city-hub__same>span .rt-icon{color:var(--gold-ink)}
.city-hub__same a{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;border-radius:999px;background:rgba(243,188,0,.14);color:var(--ink-text);font-weight:800;font-size:14px;transition:background .2s}
.city-hub__same a:hover{background:var(--gold);color:#0A1430}
.city-hub__same a svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.city-hub__same a .d{fill:none}

/* ---------- Other cities ---------- */
.city-others__search{display:flex;align-items:center;gap:10px;max-width:420px;margin:0 auto 26px;padding:0 18px;border-radius:999px;background:var(--card);border:1px solid var(--line);transition:border-color .2s,box-shadow .2s}
.city-others__search:focus-within{border-color:var(--gold);box-shadow:0 0 0 4px rgba(243,188,0,.18)}
.city-others__search svg{width:20px;height:20px;flex:none;fill:none;stroke:var(--muted);stroke-width:2;stroke-linecap:round}
.city-others__search input{flex:1;min-width:0;height:50px;border:0;background:transparent;outline:none;font-size:15px}
.city-others__list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px}
.city-others__list a{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:18px;background:var(--card);border:1px solid var(--line);color:var(--text);transition:transform .2s,border-color .2s,box-shadow .2s}
.city-others__list a:hover{transform:translateY(-3px);border-color:var(--gold);box-shadow:0 12px 26px var(--shadow);color:var(--text)}
.city-others__pin{flex:none;width:38px;height:38px;border-radius:12px;display:flex;align-items:center;justify-content:center;background:rgba(243,188,0,.16);color:var(--gold-ink);transition:background .2s,color .2s}
.city-others__list a:hover .city-others__pin{background:var(--gold);color:#0A1430}
.city-others__name{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.5}
.city-others__name b{font-weight:900;color:var(--ink-text)}
.city-others__name small{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.city-others__km{flex:none;font-size:12px;font-weight:800;color:var(--muted);direction:ltr}
.city-others__list li[hidden]{display:none}
.city-others__empty{text-align:center;color:var(--muted);margin:16px 0 0}

/* ---------- Motion off ---------- */
@media (prefers-reduced-motion:reduce){
  .city-map *,.city-chip,.city-build__rot>span{animation:none!important;transition:none!important}
}

/* ---------- Tablet ---------- */
@media (max-width:1024px){
  .city-hero__grid.has-media{grid-template-columns:minmax(0,1fr);gap:40px}
  .city-map{max-width:620px;width:100%;margin-inline:auto}
  .city-pillars__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .city-pillar:nth-child(3){border-inline-start:0}
  .city-pillar:nth-child(n+3){border-top:1px solid var(--line)}
  .city-hub__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .city-story__grid{grid-template-columns:minmax(0,1fr);gap:28px}
  .city-story__side{position:static;order:2}
  .city-does__grid{grid-template-columns:minmax(0,1fr)}
  .city-steps__list{gap:20px}
  .city-step:not(:last-child)::after{display:none}
}

/* ---------- Phone ---------- */
@media (max-width:640px){
  .city-hero{padding-bottom:72px}
  .city-hero:has(+ .city-pillars){padding-bottom:96px}
  .city-hero .page-hero__title{font-size:29px;line-height:1.55}
  .city-hero__sub{font-size:17px}
  .city-hero__lead{font-size:15px}
  .city-hero .page-hero__cta{display:grid;grid-template-columns:minmax(0,1fr);gap:10px}
  .city-hero .page-hero__cta .btn{justify-content:center}
  .city-map__frame{padding:8px;border-radius:24px}
  .city-map__chips{position:static;display:flex;flex-direction:column;align-items:stretch;gap:8px;margin-top:12px}
  .city-chip,.city-chip--gold,.city-chip:not(.city-chip--gold){position:static;max-width:none;animation:none!important;box-shadow:none}
  .city-chip:not(.city-chip--gold){background:rgba(255,255,255,.08);color:#fff;border:1px solid var(--hair)}
  .city-chip:not(.city-chip--gold) .rt-icon{color:var(--gold)}
  .city-map__legend{margin-top:14px;justify-content:flex-start}
  .city-pillars{margin-top:-56px}
  .city-pillar{flex-direction:column;align-items:flex-start;gap:10px;padding:18px 16px}
  .city-pillar__icon{width:44px;height:44px;border-radius:14px}
  .city-pillar b{font-size:14.5px}
  .city-pillar__n{font-size:20px}
  .city-steps__list{grid-template-columns:minmax(0,1fr)}
  .city-step__img{aspect-ratio:16/9}
  .city-build__head h2{font-size:27px}
  .city-build__cards{grid-template-columns:minmax(0,1fr);gap:12px}
  .city-build__card{display:flex;align-items:center;gap:14px;text-align:start;padding:18px}
  .city-build__card .sv-feature__icon{margin:0;flex:none}
  .city-build__card h3{margin:0;font-size:17px}
  .city-story__title,.city-does__text h2{font-size:25px}
  .city-story__name{font-size:32px}
  .city-story__body.is-folded{max-height:420px}
  .city-does__list{grid-template-columns:minmax(0,1fr)}
  .city-call{padding-bottom:48px}
  .city-call__box{flex-direction:column;align-items:flex-start;gap:16px;padding:26px 22px}
  .city-call__ring{width:56px;height:56px}
  .city-call__text h2{font-size:22px}
  .city-quote__box{padding:44px 22px;border-radius:26px}
  .city-quote__box p{font-size:24px}
  .sv-sec.city-work{margin:8px;border-radius:26px}
  .city-work .card-grid{grid-template-columns:minmax(0,1fr)}
  .city-hub__grid{gap:10px}
  .city-hub__card{padding:16px 14px 40px}
  .city-hub__card b{font-size:15px;margin-top:6px}
  .city-hub__card>span:not(.city-hub__icon){font-size:13px;line-height:1.7}
  .city-hub__icon{width:40px;height:40px}
  .city-hub__card .city-arrow{bottom:14px;inset-inline-end:14px}
  .city-others__list{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .city-others__list a{display:grid;grid-template-columns:auto minmax(0,1fr);gap:2px 10px;padding:10px 12px}
  .city-others__pin{grid-row:span 2}
  .city-others__km{justify-self:start}
  .city-others__pin{width:32px;height:32px;border-radius:10px}
  .city-nums{gap:8px}
  .city-num{padding:14px 16px}
  .city-num b{font-size:28px}
  .city-logos__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}