:root{--blue:#247bb5;--deep:#287aae;--pale:#e5f0f6;--pale2:#edf5f8;--ink:#272427;--yellow:#f1db35;--orange:#f5a72a;--wrap:920px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);font-family:"Yu Gothic","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;line-height:1.9;letter-spacing:.05em;background:#fff}img{display:block;max-width:100%}a{color:inherit;text-decoration:none}button,input{font:inherit}.wrap{width:min(100% - 40px,var(--wrap));margin-inline:auto}.content-wrap{max-width:900px}.section-pad{padding:78px 0}.site-header{position:relative;background:#fff;z-index:20}.header-main{height:225px;display:flex;align-items:center;justify-content:space-between;padding-top:15px;position:relative}.header-main:after{content:"";position:absolute;z-index:-1;left:50%;bottom:0;width:100vw;height:58px;transform:translateX(-50%);background:#68afe0;clip-path:polygon(0 36%,10% 62%,21% 58%,32% 27%,46% 72%,57% 35%,69% 76%,82% 29%,92% 66%,100% 32%,100% 100%,0 100%)}.brand-block{align-self:flex-end;margin-bottom:22px}.brand-copy{font-size:13px;line-height:1.55;margin:0 0 4px}.brand{display:block;position:relative;line-height:.85;font-family:"Yu Mincho","Hiragino Mincho ProN",serif;font-weight:900;white-space:nowrap}.brand-main{font-size:68px;letter-spacing:-.12em}.brand-particle{font-size:11px;color:var(--blue);font-family:inherit;letter-spacing:0}.brand small{display:block;color:#e83a31;font:700 7px/1 Arial,sans-serif;letter-spacing:0;margin-top:5px}.header-tools{margin-top:26px;text-align:right}.header-tools>a{font-size:14px;border-bottom:1px solid #222;padding-bottom:4px}.header-tools>a span{color:var(--blue)}.socials{display:flex;justify-content:flex-end;align-items:center;gap:20px;margin-top:15px}.socials a{font:bold 37px/1 Arial,sans-serif}.socials a:last-child{font-size:29px;color:#fff;background:#222;border-radius:50%;width:30px;height:30px;display:grid;place-items:center}.menu-toggle{display:none}.global-nav{height:50px;border-bottom:1px solid #222;background:#fff}.global-nav>ul{height:100%;display:flex;justify-content:center;align-items:center;list-style:none;padding:0;margin:0}.global-nav>ul>li{position:relative;border-right:1px solid #222;line-height:1}.global-nav>ul>li:first-child{border-left:1px solid #222}.global-nav a,.global-nav button{display:block;padding:0 17px;border:0;background:none;font-weight:600;white-space:nowrap;cursor:pointer}.global-nav .has-menu>button{color:var(--blue)}.dropdown{position:absolute;left:0;top:33px;width:205px;padding:0;margin:0;list-style:none;background:#2d7db4;box-shadow:0 6px 16px rgba(0,0,0,.12);display:none;z-index:15}.has-menu.is-open .dropdown{display:block}.dropdown a{color:#fff;padding:11px 15px;font-size:14px}.dropdown a:before{content:">";margin-right:15px}.dropdown .current{background:var(--yellow)}.dropdown .current a{color:#222}.hero{position:relative;background:#d9edf6}.hero-track{height:500px;position:relative;overflow:hidden}.hero-slide{position:absolute;inset:0;margin:0;opacity:0;transition:opacity .8s ease}.hero-slide.is-active{opacity:1}.hero-slide img{width:100%;height:100%;object-fit:cover}.hero-dots{position:absolute;left:50%;bottom:-37px;transform:translateX(-50%);display:flex;gap:12px;z-index:2}.hero-dots button{border:0;width:8px;height:8px;padding:0;border-radius:50%;background:#8a8a8a;cursor:pointer}.hero-dots button.is-active{background:#0874c4}.section-heading{text-align:center}.section-heading>p{margin:0;color:var(--blue);font:700 15px/1.4 Arial,sans-serif;letter-spacing:.22em}.section-heading h2{font-size:27px;letter-spacing:.2em;margin:12px 0 0}.squiggle{display:inline-block;width:87px;height:9px;margin-top:10px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='90' height='10' viewBox='0 0 90 10'%3E%3Cpath d='M0 5 Q5 0 10 5 T20 5 T30 5 T40 5 T50 5 T60 5 T70 5 T80 5 T90 5' fill='none' stroke='%23247bb5' stroke-width='2'/%3E%3C/svg%3E") center/contain no-repeat}.heading-lead{margin-top:18px;font-size:14px;letter-spacing:.24em}.topics{padding-top:82px}.topic-columns{display:grid;grid-template-columns:1.35fr .92fr;gap:48px;margin-top:55px}.topic-box h3{margin:0;text-align:center;font-size:18px;font-weight:500;letter-spacing:.2em;line-height:1}.topic-box h3 span{display:inline-block;padding:0 22px;background:linear-gradient(transparent 55%,#b6d5e8 55%)}.scroll-list{height:410px;overflow-y:auto;margin-top:14px;padding-right:18px;border-block:1px solid var(--blue);scrollbar-color:#b8d4e4 #e7f2f7;scrollbar-width:thin}.news-item{display:grid;grid-template-columns:120px 1fr;gap:16px;padding:14px 0;border-bottom:1px solid #777}.news-item img{width:120px;height:78px;object-fit:cover}.news-item p{margin:0;font-size:11px}.news-item b{background:#a8cee4;border-radius:14px;padding:4px 9px;margin-right:8px;font-weight:500}.news-item time{color:#777}.news-item h4{margin:7px 0 0;font-size:12px;line-height:1.7;font-weight:500}.news-item em{font-style:normal;color:#fff;background:#ed3137;border-radius:7px;padding:4px 8px;margin-right:7px}.event-box article{padding:24px 8px;border-bottom:1px solid #777;font-size:12px}.event-box article time{display:block;color:#777;font-size:10px}.event-box article p{margin:4px 0 0}.pill{display:inline-flex;align-items:center;justify-content:center;min-width:170px;height:38px;padding:0 24px;border-radius:999px;background:var(--blue);color:#fff;font-size:13px;font-weight:700;line-height:1;margin-top:24px}.pill:after{content:"▶";color:#fff;margin-left:16px}.pill.yellow{background:var(--yellow);color:#222}.pill.yellow:after{color:#222}.topic-box>.pill{display:flex;width:max-content;margin-inline:auto}.keyword-search{width:700px;max-width:100%;margin:68px auto 0;border:1px solid var(--blue);padding:18px 20px;display:flex;align-items:center;gap:26px}.keyword-search label{white-space:nowrap;letter-spacing:.16em}.keyword-search>div{display:flex;flex:1}.keyword-search input{min-width:0;flex:1;border:1px solid var(--blue);padding:8px 12px}.keyword-search button{width:64px;border:0;background:var(--blue);color:#fff;font-size:0;cursor:pointer;position:relative}.keyword-search button:before{content:"";position:absolute;left:22px;top:12px;width:13px;height:13px;border:4px solid #fff;border-radius:50%}.keyword-search button:after{content:"";position:absolute;width:10px;height:4px;background:#fff;transform:rotate(45deg);left:36px;top:29px}.mobile-promos{display:none}.announcements{margin-top:54px;border-bottom:1px solid var(--blue);position:relative;padding-bottom:18px}.announcements h3{display:flex;align-items:center;font-size:14px;margin:0}.announcements h3 span{font-size:42px;line-height:.7}.announcements ul{list-style:none;padding:0 0 0 68px;margin:0;font-size:12px}.announcements li{margin:6px 0}.announcements time{color:#777;margin-right:22px}.announcements>a{position:absolute;right:0;bottom:20px;background:var(--blue);color:#fff;font-size:11px;padding:2px 10px}.city-intro{position:relative;margin-top:115px;padding:82px 0 100px;background:linear-gradient(#e2eef5 0 205px,#fff 205px);overflow:hidden}.city-intro:before{content:"";position:absolute;top:-44px;left:0;width:100%;height:95px;background:#e2eef5;border-radius:50% 45% 0 0/60% 70% 0 0;transform:rotate(-1deg)}.intro-copy{position:relative}.align-left{text-align:left}.intro-copy>.section-heading{width:100%}.intro-copy>.section-heading h2{font-size:29px;letter-spacing:.11em}.intro-copy>p{font-size:14px;line-height:2.2;margin:42px 0 0;max-width:650px}.photo-ribbon{display:grid;grid-template-columns:repeat(5,1fr);margin-top:42px;border-bottom:2px solid var(--blue)}.photo-ribbon img{width:100%;height:210px;object-fit:cover}.city-hero{min-height:610px;padding:95px 0 65px;background:linear-gradient(90deg,rgba(155,207,236,.5),rgba(209,235,248,.35)),url('../images/bay.webp') center 54%/cover no-repeat;position:relative;overflow:hidden}.city-hero:after{content:"";position:absolute;left:-2%;right:-2%;bottom:-58px;height:90px;background:#fff;border-radius:50% 50% 0 0/40% 40% 0 0}.city-hero .content-wrap{position:relative}.mini-lead{color:var(--blue);font-weight:700;margin:0}.city-hero h2{font-size:34px;line-height:1.5;margin:12px 0 18px}.city-hero h2 span{color:#fff;background:var(--blue);clip-path:polygon(5% 0,100% 0,94% 100%,0 100%);padding:0 13px}.city-hero .content-wrap>p:last-of-type{max-width:690px;font-size:13px;line-height:2}.bike-note{position:absolute;right:70px;top:100px;transform:rotate(4deg);text-align:center}.bike-note b{display:block;background:#fff;border:1px solid #222;border-radius:13px;padding:5px 15px;font-size:12px}.bike-note span{font-size:76px}.city-stats{display:grid;grid-template-columns:repeat(4,1fr);max-width:720px;background:#fff;border:2px solid var(--blue);border-radius:17px;margin:45px 0 0;padding:9px 0;color:var(--blue)}.city-stats>div{text-align:center;border-right:1px solid var(--blue)}.city-stats>div:last-child{border:0}.city-stats dt{font-size:10px;line-height:1}.city-stats dd{margin:4px 0 0;font-size:13px;line-height:1.2}.city-stats b{font-size:22px}.feature{background:#e1edf4;padding:70px 0}.feature.light{background:#f0f6f9}.feature-inner{display:grid;grid-template-columns:1.02fr 1fr;align-items:center;gap:90px;min-height:400px}.feature-inner.reverse .feature-copy{order:2}.feature-inner.reverse .feature-media{order:1}.feature-copy{position:relative}.feature-no{color:var(--blue);font:800 38px/1 Arial,sans-serif;display:inline-block;border-bottom:7px double var(--blue);margin-bottom:22px}.sp-no,.sp-copy{display:none}.eyebrow{color:var(--blue);font-size:14px;font-weight:700;margin:0 0 10px}.feature h3{font-size:29px;line-height:1.6;margin:0 0 18px;letter-spacing:.06em}.feature h3 strong{color:var(--blue);font-weight:inherit}.feature-copy>p:not(.eyebrow){font-size:12px;line-height:2;margin:0}.feature-media{position:relative}.feature-media>img{width:100%;height:265px;object-fit:cover}.feature .decor{position:absolute;width:auto;height:auto;object-fit:contain;z-index:2}.decor.bus{right:40px;top:5px;width:86px;transform:translateY(-100%)}.decor.fisher{right:35px;top:5px;width:90px;transform:translateY(-95%)}.decor.family{right:45px;top:0;width:125px;transform:translateY(-95%)}.decor.supplies{right:30px;top:0;width:105px;transform:translateY(-95%)}.paper-bird{position:absolute;width:195px;height:160px;left:-118px;top:-45px;background:#85b8d8;clip-path:polygon(0 47%,38% 22%,27% 0,62% 33%,100% 33%,65% 60%,77% 100%,43% 76%,20% 86%,25% 61%);z-index:0}.area-feature .feature-media img{position:relative;z-index:1}.area-tabs{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-top:34px}.area-tabs a{border:1px solid var(--blue);box-shadow:inset 0 0 0 4px #fff;background:#efd4ac;padding:8px 5px;text-align:center;color:#5688a8;font:10px/1.3 Arial,sans-serif}.area-tabs a:nth-child(2){background:#dce99a}.area-tabs a:nth-child(3){background:#b6dcef}.area-tabs a:nth-child(4){background:#d8c4df}.area-tabs a:nth-child(5){background:#efe1c5}.area-tabs b{display:block;font:700 16px/1.2 "Yu Gothic",sans-serif;color:#2472a7;margin-top:5px}.feature-actions{display:flex;gap:8px;flex-wrap:wrap}.feature-actions .pill{min-width:130px}.round-decor{position:absolute;right:-35px;top:0;display:flex;gap:8px}.round-decor span{width:75px;height:75px;border-radius:50%;overflow:hidden}.round-decor img{width:100%;height:100%;object-fit:cover}.circle-pics{display:flex;gap:16px;position:absolute;left:-180px;top:-80px}.circle-pics img{width:95px;height:95px;border-radius:50%;object-fit:cover}.life-stories{background:#e1edf4;padding:80px 0 150px;position:relative;overflow:hidden}.life-stories:after{content:"";position:absolute;left:-5%;right:-5%;bottom:-68px;height:115px;background:#2e7caf;border-radius:50% 45% 0 0/55% 50% 0 0}.story-panel{background:#fff;padding:48px 44px 40px;text-align:center}.story-panel .section-heading h2{font-size:22px;letter-spacing:.1em}.story-carousel{display:grid;grid-template-columns:30px 1fr 30px;align-items:center;gap:16px;margin-top:38px}.story-carousel>button{height:70px;border:1px solid var(--blue);background:#fff;color:var(--blue);font-size:31px;line-height:1;cursor:pointer}.story-track{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;text-align:left}.story-card{background:#e6f1f4}.story-card img{width:100%;height:150px;object-fit:cover}.story-card p{margin:0;padding:10px 12px;font-size:10px;line-height:1.6}.site-footer{background:#2e7caf;color:#fff;position:relative}.footer-inner{padding:90px 0 45px}.about-us{display:grid;grid-template-columns:1.15fr .85fr;gap:60px}.footer-label{font:700 15px/1 Arial,sans-serif;letter-spacing:.18em;margin:0 0 28px}.footer-label:after{content:"";display:inline-block;width:70px;height:9px;margin-left:12px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='70' height='10'%3E%3Cpath d='M0 5 Q4 0 8 5 T16 5 T24 5 T32 5 T40 5 T48 5 T56 5 T64 5 T72 5' fill='none' stroke='white' stroke-width='2'/%3E%3C/svg%3E") center/cover}.about-us h2{font-size:18px;margin:0 0 18px}.about-us p{font-size:10px;line-height:2}.map-placeholder{background:#fff;min-height:250px}.companies{margin-top:35px}.company-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}.company-grid article{background:#fff;color:#222;padding:18px}.company-grid h3{font-size:19px;line-height:1.25;margin:0 0 8px}.company-grid h3 span{display:block;width:max-content;background:#222;color:#fff;border-radius:9px;padding:2px 8px;font-size:9px;font-weight:500}.company-grid h4{font-size:12px;margin:0}.company-grid p,.company-grid a{font-size:9px;line-height:1.7}.editor-note{font-size:9px;line-height:2;margin:28px 0 0}.footer-bottom{background:#a8d7e5;color:#222;padding:19px 0}.footer-bottom>div{display:flex;justify-content:space-between;align-items:center}.footer-bottom nav{display:flex;flex-wrap:wrap}.footer-bottom nav a{font-size:9px;padding:0 7px;border-right:1px solid #222}.footer-bottom p{font-size:9px}.sp-copy{display:none}
@media (max-width:760px){body{font-size:14px;letter-spacing:.03em}.wrap{width:min(100% - 30px,var(--wrap))}.header-main{height:108px;padding:0 53px 0 0;justify-content:center}.header-main:after{height:24px}.brand-block{margin:0;align-self:center}.brand-copy,.header-tools{display:none}.brand-main{font-size:43px}.brand-particle{font-size:8px}.brand small{font-size:5px}.menu-toggle{display:flex;position:absolute;right:0;top:0;width:50px;height:52px;background:#272425;border:0;padding:13px 10px;flex-direction:column;justify-content:space-around;cursor:pointer}.menu-toggle span{height:2px;background:#fff;width:100%}.global-nav{position:absolute;top:52px;right:0;width:min(320px,88vw);height:auto;border:0;transform:translateX(110%);transition:transform .3s ease;box-shadow:0 8px 25px rgba(0,0,0,.25)}.global-nav.is-open{transform:none}.global-nav>ul{display:block;height:auto;width:100%;padding:12px 0}.global-nav>ul>li,.global-nav>ul>li:first-child{border:0;border-bottom:1px solid #ddd}.global-nav a,.global-nav button{width:100%;text-align:left;padding:14px 22px}.dropdown{position:static;width:100%;box-shadow:none;background:#287caf}.dropdown a{padding:10px 35px}.hero-track{height:200px}.hero-slide img{object-position:center}.hero-dots{bottom:-27px;gap:9px}.hero-dots button{width:6px;height:6px}.section-pad{padding:64px 0}.topics{padding-top:57px}.section-heading>p{font-size:13px}.section-heading h2{font-size:26px;margin-top:10px}.heading-lead{font-size:14px;letter-spacing:.14em;line-height:1.8;margin-top:14px}.topic-columns{display:block;margin-top:30px}.topic-box+.topic-box{margin-top:44px}.topic-box h3{font-size:16px}.scroll-list{height:310px}.news-item{grid-template-columns:85px 1fr;gap:12px;padding:9px 0}.news-item img{width:85px;height:65px}.news-item h4{font-size:10px;line-height:1.55;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.news-item p{font-size:9px}.news-item b{padding:2px 6px}.event-box article{padding:8px 0;font-size:10px}.event-box .scroll-list{height:160px}.pill{height:34px;min-width:180px;font-size:12px}.keyword-search{display:block;margin-top:38px;padding:12px 32px 17px;text-align:center}.keyword-search label{display:block;font-size:13px;margin-bottom:6px}.keyword-search input{padding:6px 8px}.keyword-search button{width:58px}.keyword-search button:before{top:10px}.keyword-search button:after{top:27px}.mobile-promos{display:grid;gap:20px;margin:32px 52px}.promo-card{height:160px;border:15px solid var(--orange);background:linear-gradient(90deg,rgba(0,0,0,.08),rgba(0,0,0,.08)),url('../images/news-food.webp') center/cover;color:#fff;position:relative;text-shadow:0 1px 4px rgba(0,0,0,.55)}.promo-card strong{position:absolute;right:5px;top:-14px;font-size:23px}.promo-card span{position:absolute;left:-7px;bottom:-6px;font:italic 37px/1.1 cursive}.announcements{margin-top:48px}.announcements ul{padding:0;font-size:9px}.announcements li{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.announcements time{margin-right:10px}.announcements>a{position:static;float:right;margin-top:4px}.city-intro{margin-top:75px;padding:53px 0 25px;background:linear-gradient(#e2eef5 0 165px,#fff 165px)}.city-intro:before{height:55px;top:-25px}.intro-copy>.section-heading h2{font-size:28px}.intro-copy>p{font-size:13px;line-height:2.05;margin-top:35px}.photo-ribbon{grid-template-columns:repeat(3,1fr);margin-top:26px}.photo-ribbon img{height:110px}.photo-ribbon img:first-child,.photo-ribbon img:nth-child(2){display:none}.city-hero{padding:42px 0 38px;background-position:center top;min-height:700px}.mini-lead{font-size:12px}.city-hero h2{font-size:27px;line-height:1.5}.city-hero .content-wrap>p:last-of-type{margin-top:225px;font-size:12px;line-height:2}.bike-note{right:5px;top:450px}.bike-note b{font-size:8px;padding:3px 7px}.bike-note span{font-size:48px}.city-stats{margin-top:18px}.city-stats dt{font-size:7px}.city-stats dd{font-size:9px}.city-stats b{font-size:15px}.feature{padding:45px 0}.feature-inner,.feature-inner.reverse{display:flex;min-height:0;gap:28px;flex-direction:column}.feature-copy,.feature-inner.reverse .feature-copy{order:1;width:100%}.feature-media,.feature-inner.reverse .feature-media{order:2;width:74%}.feature-no{font-size:31px;margin-bottom:18px}.pc-no{display:none}.sp-no{display:inline}.eyebrow{font-size:12px}.feature h3{font-size:24px;line-height:1.45;margin-bottom:16px}.feature-copy>p:not(.eyebrow){font-size:11px;line-height:2}.feature-copy>.pill,.feature-actions{display:flex;width:max-content;margin-inline:auto}.feature-actions{flex-direction:column;gap:7px;margin-top:22px}.feature-actions .pill{margin:0;min-width:190px}.feature-media>img{height:auto;aspect-ratio:1.5/1;object-fit:cover}.paper-bird{width:165px;height:150px;right:-15px;left:auto;top:-310px}.area-tabs{grid-template-columns:repeat(6,1fr);gap:8px;width:min(100% - 56px,var(--wrap));margin-top:38px}.area-tabs a{grid-column:span 2;padding:6px 2px;font-size:8px}.area-tabs a:nth-child(4){grid-column:2/span 2}.area-tabs b{font-size:13px}.decor.bus,.decor.fisher,.decor.family,.decor.supplies{right:12px;width:88px;top:-5px;transform:translateY(-55%)}.decor.family{width:120px}.decor.supplies{width:95px}.pc-copy{display:none}.sp-copy{display:inline}.community-feature{display:none}.round-decor{display:none}.circle-pics{position:static;justify-content:center;margin-top:20px}.circle-pics img{width:85px;height:85px}.life-stories{padding:52px 0 90px;background:#fff}.story-panel{width:100%;padding:0 36px}.story-panel .section-heading h2{font-size:19px}.story-panel .heading-lead{font-size:12px}.story-carousel{grid-template-columns:22px 1fr 22px;gap:6px;margin-top:26px}.story-track{display:block}.story-card{display:none}.story-card.is-active{display:block}.story-card img{height:auto}.story-carousel>button{height:55px;font-size:24px;padding:0}.story-panel>.pill{font-size:10px;min-width:210px}.footer-inner{padding:65px 5px 35px}.about-us{grid-template-columns:1fr;gap:25px}.about-us h2{font-size:14px}.about-us p{font-size:9px}.map-placeholder{position:absolute;right:25px;top:65px;width:95px;min-height:90px}.about-us>div:first-child{padding-right:0}.footer-label{font-size:12px}.companies{margin-top:40px}.company-grid{grid-template-columns:1fr;gap:14px}.company-grid article{padding:14px}.editor-note{font-size:8px}.footer-bottom>div{display:block;text-align:center}.footer-bottom nav{justify-content:center}.footer-bottom p{margin-bottom:0}.sp-copy{display:inline}}
@media (min-width:761px) and (max-width:1050px){.global-nav a,.global-nav button{padding-inline:10px;font-size:13px}.feature-inner{gap:50px}.wrap{width:min(100% - 56px,var(--wrap))}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.hero-slide,.global-nav{transition:none}}
html,body{overflow-x:hidden}
@media (max-width:760px){.global-nav{display:none;transform:none}.global-nav.is-open{display:block}.feature-list{display:flex;flex-direction:column}.area-feature{order:1}#transit{order:2}#shops{order:3}#disaster{order:4}#children{order:5}#housing{order:6}.community-feature{display:none}}

/* Direction notes - interaction and decoration refinements */
.global-nav>ul>li>a,.global-nav>ul>li>button{transition:color .2s ease}
.global-nav>ul>li:hover>a,.global-nav>ul>li:hover>button,.global-nav>ul>li:focus-within>a,.global-nav>ul>li:focus-within>button{color:var(--blue)}
.dropdown li{transition:background-color .2s ease}
.dropdown li:hover,.dropdown li:focus-within{background:var(--yellow)}
.dropdown li:hover a,.dropdown li:focus-within a{color:#222}
.pill,.announcements>a{transition:background-color .2s ease,color .2s ease,transform .2s ease}
.pill.yellow{background:var(--blue);color:#fff}
.pill.yellow:after{color:#fff}
.pill:hover,.pill:focus-visible,.pill:active,.announcements>a:hover,.announcements>a:focus-visible{background:var(--yellow);color:#222;transform:translateY(-1px)}
.pill:hover:after,.pill:focus-visible:after,.pill:active:after{color:#222}
.announcements h3{gap:12px}
.announcements h3>span:last-child{font-size:14px;line-height:1;font-weight:700}
.announcements h3 .megaphone{position:relative;display:inline-block;width:25px;height:25px;background:none;font-size:0;line-height:1}
.announcements h3 .megaphone:before{content:"";position:absolute;left:0;top:3px;width:20px;height:19px;background:#222;clip-path:polygon(0 33%,100% 0,100% 100%,0 67%);border-radius:50% 0 0 50%}
.announcements h3 .megaphone:after{content:"";position:absolute;right:0;top:2px;width:4px;height:21px;background:var(--blue);border-radius:2px}
.photo-ribbon{display:block;overflow:hidden;white-space:nowrap}
.photo-ribbon-track{display:flex;width:max-content;will-change:transform;animation:ribbonFlow 32s linear infinite}
.photo-ribbon:hover .photo-ribbon-track{animation-play-state:paused}
.photo-ribbon-track img{display:block!important;flex:0 0 20vw;width:20vw;height:210px;object-fit:cover}
@keyframes ribbonFlow{to{transform:translateX(-50%)}}
.area-tabs a{min-height:74px;display:flex;flex-direction:column;align-items:center;justify-content:center}
.mini-lead{display:inline-flex;flex-direction:column;align-items:flex-start}
.mini-lead:after{content:"";width:116px;height:9px;margin-top:5px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='10' viewBox='0 0 120 10'%3E%3Cpath d='M0 5 Q6 0 12 5 T24 5 T36 5 T48 5 T60 5 T72 5 T84 5 T96 5 T108 5 T120 5' fill='none' stroke='%23247bb5' stroke-width='2'/%3E%3C/svg%3E") center/contain no-repeat}
.city-hero h2 span{position:relative;display:inline-block;overflow:visible}
.city-hero h2 span:before,.city-hero h2 span:after{content:"";position:absolute;top:16%;width:18px;height:68%;background:#76b5dd}
.city-hero h2 span:before{left:-13px;clip-path:polygon(100% 0,100% 100%,0 50%)}
.city-hero h2 span:after{right:-13px;clip-path:polygon(0 0,100% 50%,0 100%)}
.city-intro:before{top:-52px;height:105px;border-radius:0;transform:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 120' preserveAspectRatio='none'%3E%3Cpath fill='%23e2eef5' d='M0 70 C180 10 320 32 470 48 C650 67 810 17 1000 39 C1190 61 1320 44 1440 8 V120 H0Z'/%3E%3C/svg%3E") center/100% 100% no-repeat}
.intro-copy:after{content:"";position:absolute;right:140px;top:-20px;width:92px;height:55px;background:url('../images/seagulls.svg') center/contain no-repeat}
.city-hero:after{left:0;right:0;bottom:-1px;height:74px;border-radius:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 90' preserveAspectRatio='none'%3E%3Cpath fill='white' d='M0 42 C210 4 370 18 555 39 C760 63 920 10 1120 28 C1260 42 1360 37 1440 18 V90 H0Z'/%3E%3C/svg%3E") center bottom/100% 100% no-repeat}
.feature-no{position:relative;border:0;padding-bottom:12px}
.feature-no:after{content:"";position:absolute;left:0;right:0;bottom:0;height:10px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='12' viewBox='0 0 80 12'%3E%3Cpath d='M0 3 Q4 0 8 3 T16 3 T24 3 T32 3 T40 3 T48 3 T56 3 T64 3 T72 3 T80 3 M0 9 Q4 6 8 9 T16 9 T24 9 T32 9 T40 9 T48 9 T56 9 T64 9 T72 9 T80 9' fill='none' stroke='%23247bb5' stroke-width='1.8'/%3E%3C/svg%3E") left center/100% 10px no-repeat}
.decor-note{position:absolute;right:2px;top:-48px;z-index:3;display:flex;align-items:flex-end;gap:8px;color:#222;text-align:center;font-size:9px;line-height:1.35;font-weight:600}
.decor-note .decor{position:static!important;transform:none!important;width:auto!important;height:auto!important;object-fit:contain}
.bus-note .decor{width:90px!important}.bus-note{top:-52px;right:12px;flex-direction:column;align-items:center;gap:2px}
.fisher-note{top:-54px;right:5px}.fisher-note .decor{width:88px!important}.fisher-note small{position:absolute;right:80px;bottom:1px;font-size:8px;white-space:nowrap}
.family-note{top:-58px;right:0}.family-note .decor{width:128px!important}
.supplies-note{top:-53px;right:0}.supplies-note .decor{width:105px!important}
.round-decor{right:-38px;top:-34px;align-items:flex-start;gap:12px}
.round-decor span{width:100px;height:auto;overflow:visible;display:grid;justify-items:center;gap:5px}
.round-decor img{width:72px;height:72px;border-radius:50%;object-fit:cover}
.round-decor small{font-size:7px;line-height:1.35;text-align:center;color:#222}
.circle-pics{left:-185px;top:-95px;gap:14px;align-items:flex-start}
.circle-pics span{display:flex;flex-direction:column;align-items:center;gap:5px}
.circle-pics img{width:94px;height:94px;border-radius:50%;object-fit:cover}
.circle-pics small{font-size:7px;line-height:1.35;text-align:center;color:#222}
.bike-note{right:68px;top:auto;bottom:-2px;transform:none;z-index:3}
.bike-note b{transform:rotate(4deg)}
.bike-note img{width:105px;height:auto;margin:-3px 0 0 auto}
.city-stats dt{display:inline-block;background:var(--blue);color:#fff;border-radius:999px;padding:2px 8px}
.footer-label:after{width:68px;margin-left:12px}

@media (max-width:760px){
  .photo-ribbon-track img{flex-basis:33.333vw;width:33.333vw;height:110px}
  .area-tabs a{height:58px;min-height:58px;padding-block:4px;line-height:1.05}
  .area-tabs b{line-height:1.05}
  .intro-copy:after{right:18px;top:-22px;width:72px;height:42px}
  .city-intro:before{top:-33px;height:64px}
  .city-hero:after{height:44px}
  .bike-note{position:relative;right:auto;top:auto;bottom:auto;width:135px;margin:4px 0 -4px auto;display:flex;flex-direction:column;align-items:flex-end}
  .bike-note b{font-size:8px;white-space:nowrap;padding:3px 7px}
  .bike-note img{width:70px;margin:-1px 7px 0 0}
  .city-stats{margin-top:7px}
  .city-stats dt{padding:1px 4px;font-size:6px}
  .decor-note{right:0;top:-30px;font-size:7px;gap:4px}
  .bus-note{top:-28px}.bus-note .decor{width:78px!important}
  .fisher-note{top:-58px}.fisher-note .decor{width:78px!important}.fisher-note small{right:70px}
  .family-note{top:-48px}.family-note .decor{width:105px!important}
  .supplies-note{top:-45px}.supplies-note .decor{width:82px!important}
  .circle-pics{position:static;margin-top:18px;gap:14px;justify-content:center}
  .circle-pics img{width:82px;height:82px}
  .circle-pics small{font-size:6px}
}
@media (prefers-reduced-motion:reduce){.photo-ribbon-track{animation:none}}

/* Final comparison corrections */
@media (min-width:761px){
  .dropdown{display:block;opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-12px);transform-origin:top;transition:opacity .22s ease,transform .28s cubic-bezier(.2,.8,.2,1),visibility 0s linear .28s}
  .has-menu:hover .dropdown,.has-menu:focus-within .dropdown,.has-menu.is-open .dropdown{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0);transition-delay:0s}
}
.header-main:after{height:58px;clip-path:none;transform:translateX(-50%);background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 70' preserveAspectRatio='none'%3E%3Cpath fill='%2368afe0' d='M0 30 C120 65 210 62 300 35 C400 7 500 59 600 42 C710 23 800 65 900 39 C1000 12 1080 61 1180 43 C1290 23 1360 65 1440 35 V70 H0Z'/%3E%3C/svg%3E") center bottom/100% 100% no-repeat}
.intro-copy{padding-left:42px}
.intro-copy .section-heading{position:relative;padding-top:22px}
.intro-copy .section-heading:before{content:"";position:absolute;top:0;left:52px;width:128px;height:10px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='130' height='10' viewBox='0 0 130 10'%3E%3Cpath d='M0 5 Q6 0 12 5 T24 5 T36 5 T48 5 T60 5 T72 5 T84 5 T96 5 T108 5 T120 5 T132 5' fill='none' stroke='%23247bb5' stroke-width='2'/%3E%3C/svg%3E") center/contain no-repeat}
.intro-copy:after{right:auto;left:250px;top:3px;width:80px;height:54px}
.intro-copy>.section-heading .squiggle{width:125px}
.mini-lead{font-weight:800;color:#0878bb;text-shadow:0 1px 0 rgba(255,255,255,.35)}
.mini-lead:after{height:12px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='12' viewBox='0 0 120 12'%3E%3Cpath d='M0 4 Q6 0 12 4 T24 4 T36 4 T48 4 T60 4 T72 4 T84 4 T96 4 T108 4 T120 4 M8 10 Q14 6 20 10 T32 10 T44 10 T56 10 T68 10 T80 10 T92 10 T104 10' fill='none' stroke='%23247bb5' stroke-width='2'/%3E%3C/svg%3E") center/contain no-repeat}
.feature-no{min-width:84px;font-size:44px;padding-bottom:17px;line-height:1}
.feature-no:after{height:15px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='90' height='15' viewBox='0 0 90 15'%3E%3Cpath d='M0 4 Q5 0 10 4 T20 4 T30 4 T40 4 T50 4 T60 4 T70 4 T80 4 T90 4 M0 12 Q5 8 10 12 T20 12 T30 12 T40 12 T50 12 T60 12 T70 12 T80 12 T90 12' fill='none' stroke='%23247bb5' stroke-width='2.2'/%3E%3C/svg%3E") left center/84px 15px no-repeat}
.eyebrow{font-weight:800;font-size:15px}
.bus-note{left:142px;right:auto;top:-46px}.bus-note .decor{width:98px!important}
.fisher-note{left:92px;right:auto;top:-58px;align-items:center}.fisher-note .decor{width:105px!important}.fisher-note span{order:2;writing-mode:vertical-rl;font-size:9px;line-height:1.2}.fisher-note small{left:-8px;right:auto;bottom:3px;writing-mode:vertical-rl}
.family-note{left:120px;right:auto;top:-66px}.family-note .decor{width:150px!important}.family-note span{align-self:flex-start;margin-top:7px}
.supplies-note{left:138px;right:auto;top:-50px;flex-direction:column;align-items:center;gap:1px}.supplies-note .decor{width:135px!important}
.round-decor{right:-15px;top:-48px;gap:5px}.round-decor span{width:122px}.round-decor img{width:102px;height:102px}.round-decor small{font-size:8px;font-weight:700}
.circle-pics{left:-365px;top:-105px;gap:22px}.circle-pics img{width:120px;height:120px}.circle-pics small{font-size:8px;font-weight:700}
.bike-note img{width:125px}
.life-stories:after{left:0;right:0;bottom:-1px;height:102px;border-radius:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 110' preserveAspectRatio='none'%3E%3Cpath fill='%232e7caf' d='M0 46 C210 12 420 14 610 30 C800 47 960 61 1140 58 C1270 56 1365 49 1440 35 V110 H0Z'/%3E%3C/svg%3E") center bottom/100% 100% no-repeat}
.area-feature{position:relative;padding-top:92px}
.area-feature:before{content:"";position:absolute;left:0;right:0;top:-58px;height:78px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 90' preserveAspectRatio='none'%3E%3Cpath fill='%23e1edf4' d='M0 40 C180 8 360 14 540 29 C760 47 930 63 1110 55 C1250 49 1360 39 1440 28 V90 H0Z'/%3E%3C/svg%3E") center/100% 100% no-repeat}
.paper-bird{width:230px;height:195px;left:-145px;top:-88px}
.city-hero:after{height:86px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 95' preserveAspectRatio='none'%3E%3Cpath fill='white' d='M0 24 C210 65 390 44 570 51 C760 59 930 76 1110 62 C1240 52 1350 36 1440 16 V95 H0Z'/%3E%3C/svg%3E") center bottom/100% 100% no-repeat}
.announcements h3:after{content:"";height:1px;background:var(--blue);flex:1;margin-left:8px}
.announcements h3 .megaphone{width:56px;height:31px;background:url('../images/megaphone.svg') left center/contain no-repeat}
.announcements h3 .megaphone:before,.announcements h3 .megaphone:after{display:none}

@media (max-width:760px){
  .dropdown{display:block!important;position:static;max-height:0;overflow:hidden;opacity:0;visibility:hidden;pointer-events:none;transform:none;box-shadow:none;transition:max-height .36s cubic-bezier(.2,.8,.2,1),opacity .24s ease,visibility 0s linear .36s}
  .has-menu:not(.is-open) .dropdown{max-height:0!important;opacity:0!important;visibility:hidden!important;pointer-events:none!important}
  .has-menu.is-open .dropdown{max-height:360px!important;opacity:1!important;visibility:visible!important;pointer-events:auto!important;transition-delay:0s}
  .header-main:after{height:29px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 390 34' preserveAspectRatio='none'%3E%3Cpath fill='%2368afe0' d='M0 11 C45 27 85 27 122 14 C157 2 180 29 218 14 C255 0 280 27 316 15 C345 5 366 24 390 12 V34 H0Z'/%3E%3C/svg%3E") center bottom/100% 100% no-repeat}
  .intro-copy{padding-left:10px}
  .intro-copy .section-heading{padding-top:18px}
  .intro-copy .section-heading:before{left:30px;width:90px}
  .intro-copy:after{left:125px;top:0;width:62px;height:43px}
  .intro-copy>.section-heading .squiggle{width:98px}
  .city-hero{min-height:0;padding:36px 0 36px;background:#fff;overflow:hidden}
  .city-hero:before{content:"";position:absolute;z-index:0;left:0;right:0;top:0;height:225px;background:linear-gradient(90deg,rgba(155,207,236,.25),rgba(209,235,248,.12)),url('../images/bay.webp') center 58%/cover no-repeat}
  .city-hero:after{z-index:0;left:0;right:0;top:168px;bottom:auto;height:76px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 390 80' preserveAspectRatio='none'%3E%3Cpath fill='white' d='M0 18 C62 0 111 25 167 20 C229 14 284 43 340 29 C360 24 376 17 390 12 V80 H0Z'/%3E%3C/svg%3E") center/100% 100% no-repeat}
  .city-hero .content-wrap{z-index:1}
  .mini-lead{font-size:12px}
  .mini-lead:after{width:100px}
  .mini-lead,.city-hero h2{margin-left:13px}
  .city-hero h2{font-size:27px;line-height:1.42;margin-top:9px;max-width:337px}
  .city-hero h2 br{display:none}
  .city-hero h2 span{background:transparent;clip-path:none;padding-inline:12px;text-shadow:0 1px 2px rgba(0,70,120,.28)}
  .city-hero .content-wrap>p:last-of-type{margin-top:28px;font-size:13px;line-height:1.8;max-width:285px}
  .bike-note{width:120px;margin:-54px 0 5px auto;z-index:3}
  .bike-note img{width:82px;margin:-2px 4px 0 0}
  .city-stats{position:relative;z-index:2;margin-top:0}
  .area-feature{padding-top:62px}
  .area-feature:before{top:-32px;height:48px}
  .feature-no{min-width:72px;font-size:38px;padding-bottom:15px}
  .feature-no:after{background-size:72px 14px}
  .decor-note{left:auto;right:0}
  .bus-note{top:-25px}.bus-note .decor{width:86px!important}
  .fisher-note{top:-60px;align-items:center}.fisher-note .decor{width:88px!important}.fisher-note span,.fisher-note small{font-size:6px}
  .family-note{top:-48px}.family-note .decor{width:112px!important}
  .supplies-note{top:-43px}.supplies-note .decor{width:90px!important}
  .round-decor span{width:100px}.round-decor img{width:82px;height:82px}
  .circle-pics{gap:12px}.circle-pics img{width:88px;height:88px}
  .announcements h3 .megaphone{width:48px;height:28px}
}

/* Pixel comparison pass: match the 1440px / 390px PDF artboards. */
@media (min-width:761px){
  .topics{padding-top:74px;padding-bottom:66px}
  .topic-columns{margin-top:45px}
  .scroll-list{height:360px}
  .keyword-search{margin-top:50px}
  .announcements{margin-top:42px}
  .city-intro{margin-top:120px;padding-top:72px;padding-bottom:72px}
  .intro-copy>p{margin-top:32px;font-size:13px}
  .photo-ribbon{margin-top:32px}
  .city-hero{padding-top:82px}
  .city-hero h2{font-size:28px}
  .city-hero .content-wrap>p:last-of-type{max-width:620px;font-size:11px;line-height:1.9}
  .city-stats{max-width:600px;margin-top:34px}
  .city-stats b{font-size:20px}
  .feature{padding:45px 0}
  .feature-inner{grid-template-columns:3fr 2fr;gap:80px;min-height:350px}
  .feature-inner.reverse{grid-template-columns:2fr 3fr}
  .feature h3{font-size:23px;line-height:1.55;margin-bottom:14px}
  .feature-copy>p:not(.eyebrow){font-size:10px;line-height:1.9}
  .feature-media>img{height:235px}
  .feature-no{font-size:38px;min-width:74px;margin-bottom:15px;padding-bottom:14px}
  .feature-no:after{background-size:74px 13px}
  .eyebrow{font-size:13px;margin-bottom:7px}
  .pill{height:34px;min-width:160px;font-size:11px;margin-top:18px}
  .area-feature{padding-top:35px;padding-bottom:45px}
  .area-feature .feature-inner{min-height:385px}
  .area-tabs{margin-top:20px}
  .area-tabs a{min-height:62px}
  #shops .feature-actions>a:first-child,#children .feature-actions>a:first-child{font-size:0}
  #shops .feature-actions>a:first-child:before{content:"浦安のお店について";font-size:11px}
  #children .feature-actions>a:first-child:before{content:"子育てについて";font-size:11px}
  #shops .feature-actions>a:nth-child(n+2),#children .feature-actions>a:nth-child(n+2){display:none}
  #shops .feature-actions,#children .feature-actions{display:block}
  #transit .feature-inner{min-height:400px}
  #shops .feature-inner{min-height:434px}
  #children .feature-inner{min-height:387px}
  #disaster .feature-inner{min-height:389px}
  #housing .feature-inner{min-height:434px}
  .life-stories{padding:62px 0}
  .story-panel{max-width:1000px;padding:38px 50px 32px}
  .story-carousel{margin-top:28px}
  .story-card img{height:132px}
  .footer-inner{max-width:1000px;padding-top:100px;padding-bottom:49px}
  .map-placeholder{min-height:280px}
}

@media (max-width:760px){
  .topics{padding-top:52px;padding-bottom:50px}
  .topic-columns{margin-top:24px}
  .scroll-list{height:245px}
  .event-box .scroll-list{height:130px}
  .topic-box+.topic-box{margin-top:26px}
  .keyword-search{margin-top:22px}
  .mobile-promos{margin-top:20px;margin-bottom:20px;gap:12px}
  .announcements{margin-top:26px}
  .city-intro{margin-top:58px;padding-top:37px;padding-bottom:14px}
  .intro-copy>p{margin-top:20px}
  .photo-ribbon{margin-top:15px}
  .city-hero{padding-top:30px;padding-bottom:25px}
  .city-hero:before{height:205px}
  .city-hero:after{top:151px}
  .city-hero .content-wrap>p:last-of-type{margin-top:20px;line-height:1.72}
  .bike-note{margin-top:-60px}
  .area-feature{padding-top:36px;padding-bottom:22px}
  .area-feature .feature-inner{gap:20px}
  .area-tabs{margin-top:25px}
  .feature h3{font-size:23px}
  .life-stories{padding-top:35px;padding-bottom:38px}
  .story-panel{padding-inline:32px}
  .story-carousel{margin-top:20px}
  .footer-inner{padding-top:72px;padding-bottom:71px}
  .about-us{min-height:425px;padding-bottom:24px}
  .company-grid article{min-height:145px}
}

/* Wave / navigation / boundary-decoration fidelity pass */
@media (min-width:761px){
  .global-nav>ul.wrap{width:max-content;max-width:calc(100% - 40px);margin-inline:auto;padding-inline:0;justify-content:center}
  .global-nav>ul>li{display:flex;align-items:center;height:100%}
  .global-nav>ul>li>a,.global-nav>ul>li>button{display:flex;align-items:center;justify-content:center;height:100%;gap:5px;line-height:1.2}
  .nav-chevron{display:inline-block;font:700 18px/1 Arial,sans-serif;transform:translateY(-1px)}

  .header-main:after{height:58px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 70' preserveAspectRatio='none'%3E%3Cpath fill='%236cb0e2' d='M0 7 C80 28 160 34 260 30 C380 20 520 18 620 24 C680 28 700 46 720 46 C760 45 790 20 840 21 C930 21 1000 27 1080 41 C1140 49 1170 18 1200 18 C1270 17 1310 35 1360 36 C1400 34 1420 25 1440 22 V70 H0Z'/%3E%3C/svg%3E") center bottom/100% 100% no-repeat}

  .city-intro{background:#fff}
  .city-intro:before{top:-5px;height:150px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 150' preserveAspectRatio='none'%3E%3Cpath fill='%23e1ebf3' d='M0 50 C120 23 240 10 360 5 C480 9 600 21 720 38 C840 51 960 57 1080 58 C1200 54 1320 44 1440 30 V150 H0Z'/%3E%3C/svg%3E") center top/100% 100% no-repeat}

  .area-feature{background:linear-gradient(to bottom,transparent 0 42px,#e1ebf3 42px);overflow:visible}
  .area-feature:before{top:0;height:70px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 70' preserveAspectRatio='none'%3E%3Cpath fill='%23e1ebf3' d='M0 33 C120 19 240 11 360 9 C480 11 600 18 720 27 C840 33 960 37 1080 37 C1200 35 1320 30 1440 22 V70 H0Z'/%3E%3C/svg%3E") center top/100% 100% no-repeat}

  .life-stories:after{height:45px;bottom:-1px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 45' preserveAspectRatio='none'%3E%3Cpath fill='%232e71a7' d='M0 44 C120 29 240 21 360 19 C480 21 600 28 720 37 C840 44 960 47 1080 47 C1200 46 1320 40 1440 32 V45 H0Z'/%3E%3C/svg%3E") center bottom/100% 100% no-repeat}

  .feature-list,.feature{overflow:visible}
  #transit .bus-note{top:-105px}
  #shops .fisher-note{top:-105px}
  .community-feature .round-decor{top:-118px}
  #children .family-note{top:-125px}
  #disaster .supplies-note{top:-110px}
  #housing .circle-pics{top:-150px}
  .decor-note,.round-decor,.circle-pics,.paper-bird{z-index:5}
}

@media (max-width:760px){
  .global-nav>ul>li>a,.global-nav>ul>li>button{display:flex;align-items:center;gap:6px}
  .nav-chevron{display:inline-block;font:700 18px/1 Arial,sans-serif;transform:translateY(-1px)}
  .header-main:after{height:29px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 390 34' preserveAspectRatio='none'%3E%3Cpath fill='%236cb0e2' d='M0 15 C45 27 85 26 120 12 C165 0 195 29 240 18 C285 6 320 27 360 23 C375 21 385 17 390 15 V34 H0Z'/%3E%3C/svg%3E") center bottom/100% 100% no-repeat}
  .city-intro{background:#fff}
  .city-intro:before{top:-5px;height:150px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 390 150' preserveAspectRatio='none'%3E%3Cpath fill='%23e1ebf3' d='M0 24 C45 12 82 5 120 2 C160 1 198 16 240 26 C285 34 328 27 360 21 C374 18 383 17 390 16 V150 H0Z'/%3E%3C/svg%3E") center top/100% 100% no-repeat}
  .area-feature{background:linear-gradient(to bottom,transparent 0 32px,#e1ebf3 32px);overflow:visible}
  .area-feature:before{top:0;height:48px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 390 48' preserveAspectRatio='none'%3E%3Cpath fill='%23e1ebf3' d='M0 16 C45 9 82 4 120 3 C160 3 198 14 240 20 C285 25 328 20 360 17 C374 15 383 14 390 14 V48 H0Z'/%3E%3C/svg%3E") center top/100% 100% no-repeat}
  .life-stories:after{height:48px;bottom:-1px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 390 48' preserveAspectRatio='none'%3E%3Cpath fill='%232e71a7' d='M0 42 C42 29 80 23 120 25 C165 27 195 38 240 37 C285 36 322 24 360 31 C375 34 384 36 390 35 V48 H0Z'/%3E%3C/svg%3E") center bottom/100% 100% no-repeat}
  .feature-list,.feature{overflow:visible}
  .decor-note,.circle-pics,.paper-bird{z-index:5}
}

/* Number-wave offsets and annotation artwork composited from the approved crops. */
.feature-no:after{left:-12px;right:auto;width:92px;height:16px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='92' height='16' viewBox='0 0 92 16'%3E%3Cpath d='M15 4 Q19 0 23 4 T31 4 T39 4 T47 4 T55 4 T63 4 T71 4 T79 4 T87 4 M0 12 Q4 8 8 12 T16 12 T24 12 T32 12 T40 12 T48 12 T56 12 T64 12 T72 12' fill='none' stroke='%23177bb1' stroke-width='2.2' stroke-linecap='round'/%3E%3C/svg%3E") left center/92px 16px no-repeat}

.decor-note{display:block;font-size:0;line-height:0;background-position:center;background-size:contain;background-repeat:no-repeat}
.decor-note>*{display:none!important}
.bus-note{width:130px;height:112px;background-image:url('../images/decor-bus-note.png')}
.fisher-note{width:180px;height:150px;background-image:url('../images/parts/shop-izugin.png')}
.family-note{width:185px;height:194px;background-image:url('../images/decor-family-note.png')}
.supplies-note{width:175px;height:138px;background-image:url('../images/decor-supplies-note.png')}

.round-decor{display:block;width:261px;height:190px;background:url('../images/decor-community-note.png') center/contain no-repeat}
.round-decor>*{display:none!important}
.circle-pics{display:block;width:285px;height:220px;background:url('../images/decor-housing-note.png') center/contain no-repeat}
.circle-pics>*{display:none!important}

@media (min-width:761px){
  #transit .bus-note{top:-106px}
  #shops .fisher-note{top:-113px}
  .community-feature .round-decor{top:-128px;right:-24px}
  #children .family-note{top:-137px}
  #disaster .supplies-note{top:-118px}
  #housing .circle-pics{top:-158px;left:-380px}
}

@media (max-width:760px){
  .feature-no:after{left:-7px;width:80px;height:15px;background-size:80px 15px}
  .bus-note{width:108px;height:93px;top:-43px}
  .fisher-note{width:132px;height:110px;top:-70px}
  .family-note{width:145px;height:152px;top:-72px}
  .supplies-note{width:132px;height:104px;top:-58px}
  .circle-pics{position:static;width:170px;height:131px;margin:0 auto;background-size:contain}
}

/* Measured number underline: 68px strokes, 12px phase offset, 12px wavelength. */
.feature-no:after{left:-12px;bottom:-3px;width:82px;height:18px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='82' height='18' viewBox='0 0 82 18'%3E%3Cpath d='M12 5 q3 -5 6 0 t6 0 t6 0 t6 0 t6 0 t6 0 t6 0 t6 0 t6 0 t6 0 t6 0 M0 14 q3 -5 6 0 t6 0 t6 0 t6 0 t6 0 t6 0 t6 0 t6 0 t6 0 t6 0 t6 0' fill='none' stroke='%23177bb1' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") left center/82px 18px no-repeat}
#shops .feature-no:after{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='82' height='18' viewBox='0 0 82 18'%3E%3Cpath d='M0 5 q3 -5 6 0 t6 0 t6 0 t6 0 t6 0 t6 0 t6 0 t6 0 t6 0 t6 0 t6 0 M12 14 q3 -5 6 0 t6 0 t6 0 t6 0 t6 0 t6 0 t6 0 t6 0 t6 0 t6 0 t6 0' fill='none' stroke='%23177bb1' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E")}
@media (max-width:760px){.feature-no:after{left:-8px;width:80px;background-size:80px 18px}}

/* PDF-measured heading waves: each heading keeps its own length and wavelength. */
.topics .section-heading>.squiggle,
.intro-copy>.section-heading .squiggle{
  width:165px;
  height:10px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 10'%3E%3Cpath d='M0 5 Q7 0 14 5 T28 5' fill='none' stroke='%23247bb5' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
  background-position:left center;
  background-size:27.5px 10px;
  background-repeat:repeat-x;
}

.intro-copy .section-heading:before{
  width:122px;
  height:7px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20.33 7'%3E%3Cpath d='M0 3.5 Q5.08 0 10.17 3.5 T20.33 3.5' fill='none' stroke='%23247bb5' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
  background-position:left center;
  background-size:20.33px 7px;
  background-repeat:repeat-x;
}

.mini-lead:after{
  width:123px;
  height:8px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20.5 8'%3E%3Cpath d='M0 4 Q5.125 0 10.25 4 T20.5 4' fill='none' stroke='%23247bb5' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
  background-position:left center;
  background-size:20.5px 8px;
  background-repeat:repeat-x;
}

.story-panel .section-heading>.squiggle{
  width:188px;
  height:10px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 31.33 10'%3E%3Cpath d='M0 5 Q7.83 0 15.67 5 T31.33 5' fill='none' stroke='%23247bb5' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
  background-position:left center;
  background-size:31.33px 10px;
  background-repeat:repeat-x;
}

@media (max-width:760px){
  .topics .section-heading>.squiggle,
  .story-panel .section-heading>.squiggle{
    width:96px;
    height:6px;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 6'%3E%3Cpath d='M0 3 Q4 0 8 3 T16 3' fill='none' stroke='%23247bb5' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");
    background-size:16px 6px;
  }

  .intro-copy .section-heading:before{
    left:30px;
    width:65px;
    height:6px;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10.83 6'%3E%3Cpath d='M0 3 Q2.71 0 5.42 3 T10.83 3' fill='none' stroke='%23247bb5' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");
    background-size:10.83px 6px;
  }

  .intro-copy>.section-heading .squiggle,
  .mini-lead:after{
    width:88px;
    height:6px;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14.67 6'%3E%3Cpath d='M0 3 Q3.67 0 7.33 3 T14.67 3' fill='none' stroke='%23247bb5' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");
    background-size:14.67px 6px;
  }
}

/* City-intro details measured from the PDF. */
.intro-copy>.section-heading .squiggle{
  position:relative;
  left:-60px;
}

.city-hero h2 span{
  color:#fff;
  background:transparent;
  clip-path:none;
  padding-inline:15px;
  text-shadow:0 1px 2px rgba(0,70,120,.18);
}

.city-hero h2 span:before,
.city-hero h2 span:after{
  top:50%;
  width:12px;
  height:.9em;
  background:#247bb5;
  transform:translateY(-50%);
}

.city-hero h2 span:before{
  left:0;
  clip-path:polygon(100% 0,0 50%,100% 100%);
}

.city-hero h2 span:after{
  right:0;
  clip-path:polygon(0 0,100% 50%,0 100%);
}

@media (max-width:760px){
  .intro-copy>.section-heading .squiggle{left:-10px}
  .city-hero h2 span{padding-inline:13px}
  .city-hero h2 span:before,
  .city-hero h2 span:after{width:11px;height:.9em}
}

/* Thin, distinct child-category indicator for the global navigation. */
.nav-chevron{
  position:relative;
  display:inline-block;
  flex:0 0 14px;
  width:14px;
  height:8px;
  margin-left:1px;
  font-size:0;
  line-height:0;
  transform:translateY(2px);
  opacity:.82;
}

.nav-chevron:before,
.nav-chevron:after{
  content:"";
  position:absolute;
  top:1px;
  width:8px;
  height:1px;
  border-radius:999px;
  background:currentColor;
}

.nav-chevron:before{
  left:0;
  transform:rotate(38deg);
}

.nav-chevron:after{
  right:0;
  transform:rotate(-38deg);
}

/* Parent/child menu colors are interaction states, not default states. */
.global-nav .has-menu>button{color:var(--ink)}
.global-nav .has-menu:hover>button,
.global-nav .has-menu:focus-within>button,
.global-nav .has-menu.is-open>button{color:var(--blue)}

.dropdown li{background:transparent}
.dropdown li>a{color:#fff}
.dropdown li:hover,
.dropdown li:focus-within,
.dropdown li:active,
.dropdown li.is-selected{background:var(--yellow)}
.dropdown li:hover>a,
.dropdown li:focus-within>a,
.dropdown li:active>a,
.dropdown li.is-selected>a{color:#222}

/* Readability pass: larger content type without changing the global navigation. */
.section-heading>p{font-size:16px}
.heading-lead{font-size:15.5px;line-height:1.65}
.news-item p{font-size:12.5px;line-height:1.65}
.news-item h4{font-size:14px;line-height:1.45}
.event-box article{font-size:14px;line-height:1.6}
.keyword-search label,
.keyword-search input{font-size:14px}
.announcements h3{font-size:16px}
.announcements ul{font-size:14px;line-height:1.6}
.announcements>a{font-size:12px}
.intro-copy>p{font-size:15.5px;line-height:1.85}
.city-hero .content-wrap>p:last-of-type{font-size:14px;line-height:1.5}
.city-stats dt{font-size:11px}
.city-stats dd{font-size:14px}
.feature .eyebrow{font-size:16px}
.feature-copy>p:not(.eyebrow){font-size:14px;line-height:1.7}
.pill{font-size:14px}
.story-card p{font-size:12px;line-height:1.45}
.footer-label{font-size:16px}
.about-us p{font-size:12.5px;line-height:1.6}
.company-grid h4{font-size:13px}
.company-grid p,
.company-grid a{font-size:11px;line-height:1.4}
.editor-note{font-size:11px;line-height:1.65}
.footer-bottom nav a,
.footer-bottom p{font-size:11px}

@media (min-width:761px){
  .story-panel{padding-bottom:12px}
}

@media (max-width:760px){
  .section-heading>p{font-size:14px}
  .heading-lead{font-size:14px;line-height:1.6}
  .news-item p{font-size:11px;line-height:1.5}
  .news-item h4{font-size:12px;line-height:1.4}
  .event-box article{font-size:12px;line-height:1.5}
  .keyword-search label,
  .keyword-search input{font-size:13px}
  .announcements ul{font-size:11px;line-height:1.55}
  .intro-copy>p{font-size:15px;line-height:1.75}
  .city-hero .content-wrap>p:last-of-type{font-size:13.5px;line-height:1.6}
  .feature .eyebrow{font-size:13px}
  .feature-copy>p:not(.eyebrow){font-size:12px;line-height:1.83}
  .pill{font-size:13px}
  .story-panel .heading-lead{font-size:13.5px;line-height:1.55}
  .story-card p{font-size:11.5px;line-height:1.45}
  .footer-label{font-size:13.5px}
  .about-us p{font-size:11px;line-height:1.65}
  .company-grid h4{font-size:12px}
  .company-grid p,
  .company-grid a{font-size:10.5px;line-height:1.45}
  .editor-note{font-size:10px;line-height:1.7}
  .footer-bottom nav a,
  .footer-bottom p{font-size:10px}
}

/* Responsive typography: 1rem = 16px at the browser default. */
html{font-size:100%}
body{font-size:1rem;line-height:1.8}
p{font-size:1rem;line-height:1.8}
h1,h2,h3,h4{line-height:1.45}

/* Headings scale fluidly between the established mobile and desktop sizes. */
.brand-main{font-size:clamp(2.6875rem,1.75rem + 3vw,4.25rem)}
.section-heading h2{font-size:clamp(1.625rem,1.55rem + .35vw,1.8125rem)}
.intro-copy>.section-heading h2{font-size:clamp(1.75rem,1.7rem + .25vw,1.8125rem)}
.topic-box h3{font-size:clamp(1rem,.95rem + .25vw,1.125rem)}
.news-item h4{font-size:clamp(.75rem,.7rem + .25vw,.875rem)}
.announcements h3{font-size:clamp(.875rem,.82rem + .25vw,1rem)}
.city-hero h2{font-size:clamp(1.6875rem,1.64rem + .25vw,1.75rem)}
.feature h3{font-size:clamp(1.4375rem,1.39rem + .25vw,1.5rem)}
.story-panel .section-heading h2{font-size:clamp(1.1875rem,1.08rem + .55vw,1.375rem)}
.about-us h2{font-size:clamp(.875rem,.78rem + .5vw,1.125rem)}
.company-grid h3{font-size:clamp(1.0625rem,1rem + .3vw,1.1875rem)}
.company-grid h4{font-size:clamp(.75rem,.72rem + .15vw,.8125rem)}
.feature-no{font-size:clamp(1.9375rem,1.7rem + 1.2vw,2.375rem)}

/* Body copy keeps a consistent, readable rhythm. */
.heading-lead,
.intro-copy>p,
.city-hero .content-wrap>p:last-of-type,
.feature-copy>p:not(.eyebrow),
.event-box article p,
.about-us p,
.company-grid p,
.editor-note,
.footer-bottom p{font-size:1rem;line-height:1.8}
.story-card p{font-size:1rem;line-height:1.7;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* Compact labels and metadata remain subordinate to the body copy. */
.global-nav{font-size:.875rem}
.brand-copy{font-size:.875rem}
.news-item p{font-size:.8125rem;line-height:1.6}
.section-heading>p{font-size:clamp(.875rem,.82rem + .25vw,1rem);line-height:1.6}
.mini-lead{font-size:clamp(.875rem,.82rem + .25vw,1rem);line-height:1.8}
.feature .eyebrow{font-size:clamp(.875rem,.82rem + .25vw,.9375rem);line-height:1.8}
.footer-label{font-size:clamp(.875rem,.82rem + .25vw,1rem)}

@media (max-width:760px){
  .city-hero{padding-bottom:15px}
  .city-hero .content-wrap>p:last-of-type{margin-top:12px}
  .feature{padding:35px 0}
  .area-feature{padding-top:30px;padding-bottom:18px}
  .feature-inner,
  .feature-inner.reverse{gap:18px}
  .feature h3{margin-bottom:10px}
  .life-stories{padding-top:30px;padding-bottom:30px}
}