/* PEP-927 — /plumber-notting-hill route stylesheet. Self-sufficient: loaded
   after the shared sitewide stylesheet, contains every .notting-hill-hub*
   rule this route needs so the page renders correctly even against a browser
   cache that predates this file. Scoped entirely under .notting-hill-hub so
   no other route is visually affected. Structure/rhythm mirrors the proven
   PEP-925 /plumber-chiswick stylesheet.
   Note: every accent text colour inside the stone-100 intro band (the lead
   paragraph, the ".kicker" override, the "related project" proof line + its
   link, and the sketch caption — 4 usages) is --muted/--copper-ink darkened
   slightly toward black (#606863 / #885b3a respectively), not a new brand
   colour — var(--stone-100) is darker than the var(--stone-050) those
   tokens were proven against elsewhere on the site, which otherwise drops
   every one of them under the 4.5:1 AA text-contrast threshold (4.28:1/
   4.07:1 measured for the undarkened tokens, confirmed live via computed
   styles for this route, including for ".kicker" itself once a real CSS
   specificity bug — an over-broad ">p" selector that was also silently
   overriding the kicker's font-size/colour — was found and fixed here);
   the darkened pair hits 4.87:1/4.94:1 with a safety margin throughout. */
.notting-hill-hub-main{background:var(--stone-050);min-width:0}

.notting-hill-hub{
--nh-icon-house: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23fff%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M4%2011.5%2012%204l8%207.5%27%2F%3E%3Cpath%20d%3D%27M6%2010v9h12v-9%27%2F%3E%3Cpath%20d%3D%27M10%2019v-5h4v5%27%2F%3E%3C%2Fsvg%3E");
--nh-icon-drop: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23fff%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M12%203.5c-3.2%204.4-5.6%207.7-5.6%2010.8a5.6%205.6%200%200%200%2011.2%200c0-3.1-2.4-6.4-5.6-10.8Z%27%2F%3E%3C%2Fsvg%3E");
--nh-icon-check: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23fff%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M4.5%2012.5%209.5%2017.5%2019.5%206.5%27%2F%3E%3C%2Fsvg%3E");
--nh-icon-route: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23fff%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M5%2019v-8a4%204%200%200%201%204-4h6a4%204%200%200%201%204%204v8%27%2F%3E%3Cpath%20d%3D%27M9%2019v-4M15%2019v-4%27%2F%3E%3C%2Fsvg%3E");
--nh-icon-cylinder: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23fff%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M8%205a4%204%200%200%201%208%200v14a4%204%200%200%201-8%200Z%27%2F%3E%3Cpath%20d%3D%27M8%2010.5h8%27%2F%3E%3Ccircle%20cx%3D%2712%27%20cy%3D%2715%27%20r%3D%271.15%27%2F%3E%3C%2Fsvg%3E");
--nh-icon-bath: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23fff%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M4%2012.5V6.2A2.2%202.2%200%200%201%207.6%204.5%27%2F%3E%3Cpath%20d%3D%27M3%2012.5h18v1.8A5.2%205.2%200%200%201%2015.8%2019.5H8.2A5.2%205.2%200%200%201%203%2014.3Z%27%2F%3E%3Cpath%20d%3D%27M7.3%2019.5V21M16.7%2019.5V21%27%2F%3E%3C%2Fsvg%3E");
--nh-icon-people: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23fff%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Ccircle%20cx%3D%279%27%20cy%3D%278%27%20r%3D%272.4%27%2F%3E%3Cpath%20d%3D%27M4.5%2019v-1.5A3.5%203.5%200%200%201%208%2014h2a3.5%203.5%200%200%201%203.5%203.5V19%27%2F%3E%3Ccircle%20cx%3D%2717%27%20cy%3D%279%27%20r%3D%271.9%27%2F%3E%3Cpath%20d%3D%27M14.5%2019v-1.2a3%203%200%200%201%203-3h.4a3%203%200%200%201%203%203V19%27%2F%3E%3C%2Fsvg%3E");
--nh-icon-radiator: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23fff%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Crect%20x%3D%274%27%20y%3D%276%27%20width%3D%2716%27%20height%3D%2713%27%20rx%3D%271.6%27%2F%3E%3Cpath%20d%3D%27M8%206v13M12%206v13M16%206v13%27%2F%3E%3C%2Fsvg%3E");
--nh-icon-bolt: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23fff%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M13%203%205%2014h5l-1%207%208-11h-5l1-7Z%27%20fill%3D%27%23fff%27%20stroke%3D%27none%27%2F%3E%3C%2Fsvg%3E");
--nh-icon-chat: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23fff%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Crect%20x%3D%274%27%20y%3D%275.5%27%20width%3D%2716%27%20height%3D%2710.5%27%20rx%3D%273%27%2F%3E%3Cpath%20d%3D%27M8.5%2016v3.2L12.2%2016%27%2F%3E%3C%2Fsvg%3E");
}

/* Hero */
.notting-hill-hub-hero{isolation:isolate;color:var(--cream);background:var(--green-1000);min-height:min(88vh,800px);align-items:center;display:flex;position:relative;overflow:hidden}
.notting-hill-hub-hero-media{z-index:0;position:absolute;inset:0}
.notting-hill-hub-hero-media img{object-fit:cover;width:100%;height:100%;display:block}
.notting-hill-hub-hero-shade{z-index:1;pointer-events:none;background:linear-gradient(100deg,#03120de3 0%,#03120d8c 33%,#03120d24 56%,transparent 70%);position:absolute;inset:0}
.notting-hill-hub-hero-panel{z-index:2;width:min(560px,46%);min-width:300px;color:var(--cream);flex-direction:column;justify-content:center;gap:0;margin:0;padding:0 clamp(24px,4.4vw,64px);display:flex;position:relative}
.notting-hill-hub-hero-panel>.kicker{color:var(--brass);margin-bottom:16px}
.notting-hill-hub-hero-panel h1{font:500 clamp(36px,4.4vw,56px)/1.05 var(--display);letter-spacing:-.03em;color:var(--cream);margin-bottom:18px}
.notting-hill-hub-hero-rule{width:60px;height:1px;background:var(--brass);opacity:.75;margin-bottom:20px}
.notting-hill-hub-hero-support{color:#ffffffc4;font-size:clamp(13px,1.05vw,15.5px);line-height:1.6;max-width:40ch;margin-bottom:28px}
.notting-hill-hub-hero-actions{align-items:center;gap:16px 22px;flex-wrap:wrap;display:flex}
.notting-hill-hub-cta{color:var(--green-1000);background:var(--brass);border-color:var(--brass)}
.notting-hill-hub-cta:hover{color:var(--green-1000);background:var(--cream);border-color:var(--cream)}
.notting-hill-hub-hero-actions .button-quiet:hover{border-color:var(--copper)}

@media (width<=1040px){
.notting-hill-hub-hero-panel{width:min(460px,52%);min-width:280px}
}

/* Capability strip: 4-item dark bar directly beneath the hero */
.notting-hill-hub-strip{background:var(--green-1000);border-top:1px solid var(--line-light);grid-template-columns:repeat(4,minmax(0,1fr));display:grid}
.notting-hill-hub-strip-item{border-left:1px solid var(--line-light);align-items:center;gap:13px;padding:20px clamp(16px,2.4vw,28px);display:flex}
.notting-hill-hub-strip-item:first-child{border-left:0}
.notting-hill-hub-strip-icon{flex:none;width:26px;height:26px;background:var(--brass);display:inline-block;-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:contain;mask-size:contain}
.notting-hill-hub-icon-house{-webkit-mask-image:var(--nh-icon-house);mask-image:var(--nh-icon-house)}
.notting-hill-hub-icon-drop{-webkit-mask-image:var(--nh-icon-drop);mask-image:var(--nh-icon-drop)}
.notting-hill-hub-icon-cylinder{-webkit-mask-image:var(--nh-icon-cylinder);mask-image:var(--nh-icon-cylinder)}
.notting-hill-hub-icon-bath{-webkit-mask-image:var(--nh-icon-bath);mask-image:var(--nh-icon-bath)}
.notting-hill-hub-icon-route{-webkit-mask-image:var(--nh-icon-route);mask-image:var(--nh-icon-route)}
.notting-hill-hub-icon-people{-webkit-mask-image:var(--nh-icon-people);mask-image:var(--nh-icon-people)}
.notting-hill-hub-icon-radiator{-webkit-mask-image:var(--nh-icon-radiator);mask-image:var(--nh-icon-radiator)}
.notting-hill-hub-icon-bolt{-webkit-mask-image:var(--nh-icon-bolt);mask-image:var(--nh-icon-bolt)}
.notting-hill-hub-icon-chat{-webkit-mask-image:var(--nh-icon-chat);mask-image:var(--nh-icon-chat)}
.notting-hill-hub-strip-item span{color:var(--cream);font:620 12px/1.32 var(--body);letter-spacing:.005em}

@media (width<=1040px){
.notting-hill-hub-strip{grid-template-columns:repeat(2,minmax(0,1fr))}
.notting-hill-hub-strip-item:nth-child(3){border-left:0}
}

/* Intro: cream/stone band, copy + checklist left, decorative sketch right */
.notting-hill-hub-intro{background:var(--stone-100);grid-template-columns:minmax(0,1.1fr) minmax(230px,.7fr);align-items:center;gap:clamp(30px,5.5vw,72px);padding:clamp(48px,6.4vw,84px) clamp(26px,5vw,64px);display:grid}
.notting-hill-hub-intro-copy>.kicker{color:#885b3a;margin-bottom:14px}
.notting-hill-hub-intro-copy h2{font:500 clamp(26px,2.9vw,40px)/1.14 var(--display);letter-spacing:-.03em;color:var(--ink);text-wrap:balance;margin-bottom:14px}
.notting-hill-hub-intro-lead{color:#606863;font-size:clamp(12px,1.05vw,14.5px);line-height:1.7;max-width:56ch;margin-bottom:22px}
.notting-hill-hub-intro-list{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.notting-hill-hub-intro-list li{border-bottom:1px solid var(--line);color:var(--ink);font:600 12.5px/1.4 var(--body);letter-spacing:.002em;align-items:flex-start;gap:12px;padding:11px 2px;display:flex}
.notting-hill-hub-intro-list li:before{content:"";flex:none;margin-top:2px;width:16px;height:16px;background:var(--copper);-webkit-mask:var(--nh-icon-check) center/10px no-repeat;mask:var(--nh-icon-check) center/10px no-repeat;border-radius:50%}
.notting-hill-hub-intro-proof{color:#606863;font-size:11.5px;line-height:1.6;margin-top:16px}
.notting-hill-hub-intro-proof a{color:#885b3a;text-decoration:underline;text-underline-offset:2px}
.notting-hill-hub-intro-proof a:hover{color:var(--copper)}
.notting-hill-hub-intro-visual{flex-direction:column;align-items:center;justify-content:center;gap:16px;display:flex}
.notting-hill-hub-sketch{width:100%;max-width:clamp(240px,30vw,340px);height:auto;opacity:.92}
.notting-hill-hub-sketch-caption{flex-direction:column;align-items:center;gap:10px;display:flex}
.notting-hill-hub-sketch-caption span{width:40px;height:1px;background:var(--copper);opacity:.6}
.notting-hill-hub-sketch-caption strong{color:#885b3a;font:640 10px/1.4 var(--display);letter-spacing:.06em;text-transform:uppercase;text-align:center}

@media (width<=900px){
.notting-hill-hub-intro{grid-template-columns:1fr;text-align:left}
.notting-hill-hub-intro-visual{margin-top:8px}
}

/* Four dark capability cards */
.notting-hill-hub-capabilities{background:var(--green-1000);border-top:1px solid var(--line-light);grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(14px,1.6vw,18px);padding:clamp(40px,5.4vw,60px) clamp(26px,5vw,64px);display:grid}
.notting-hill-hub-capabilities article{border:1px solid #cfb37a3d;border-radius:4px;text-align:center;flex-direction:column;align-items:center;gap:13px;padding:clamp(26px,2.8vw,34px) clamp(16px,2vw,22px);display:flex}
.notting-hill-hub-capability-icon{width:38px;height:38px;background:var(--brass);display:inline-block;-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:contain;mask-size:contain}
.notting-hill-hub-capabilities h3{font:600 14.5px/1.3 var(--display);letter-spacing:-.015em;color:var(--cream)}
.notting-hill-hub-capabilities p{color:#ffffffb0;font-size:12px;line-height:1.58;max-width:30ch}

@media (width<=1040px){
.notting-hill-hub-capabilities{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* Four compact lower cards — generated decorative artwork cropped from the
   approved template (see content.js header comment / task ABSOLUTE IMAGE RULE) */
.notting-hill-hub-cards{background:var(--stone-050);grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(16px,1.8vw,22px);padding:clamp(10px,1.6vw,18px) clamp(26px,5vw,64px) clamp(48px,6vw,68px);display:grid}
.notting-hill-hub-cards article{min-width:0;display:grid;gap:3px}
.notting-hill-hub-card-media{width:100%;aspect-ratio:6/5;border-radius:6px;overflow:hidden;margin-bottom:11px;background:var(--stone-200)}
.notting-hill-hub-card-media img{width:100%;height:100%;object-fit:cover;display:block}
.notting-hill-hub-cards h3{font:600 13.5px/1.25 var(--display);letter-spacing:-.015em;color:var(--ink)}
.notting-hill-hub-cards p{color:var(--muted);font-size:11.5px;line-height:1.55}

@media (width<=1040px){
.notting-hill-hub-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* Related services — inset stone-100 card with centred heading + a row of
   icon/label links, matching the approved template's light "Explore related
   services" band (distinct from the dark hero/strip/capability sections). */
.notting-hill-hub-related{background:var(--stone-050);padding:0 clamp(26px,5vw,64px) clamp(48px,6vw,68px)}
.notting-hill-hub-related-card{background:var(--stone-100);border-radius:16px;text-align:center;flex-direction:column;align-items:center;padding:clamp(30px,4vw,44px) clamp(20px,4vw,40px);display:flex}
.notting-hill-hub-related-heading{color:var(--ink);font:500 clamp(21px,2.3vw,28px)/1.3 var(--display);letter-spacing:-.015em;margin:0}
.notting-hill-hub-related-rule{width:52px;height:1px;background:var(--copper);opacity:.7;margin:14px 0 22px}
.notting-hill-hub-related-links{color:var(--ink);font:600 13px/1.4 var(--body);letter-spacing:.002em;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px clamp(20px,3vw,36px);display:flex}
.notting-hill-hub-related-links a{color:inherit;align-items:center;gap:9px;padding:6px 0;display:inline-flex}
.notting-hill-hub-related-links a:not(:last-child){border-right:1px solid var(--line);padding-right:clamp(20px,3vw,36px);margin-right:-4px}
.notting-hill-hub-related-links a:hover{color:var(--copper-ink)}
.notting-hill-hub-related-icon{flex:none;width:19px;height:19px;background:var(--copper);display:inline-block;-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:contain;mask-size:contain}

/* =====================================================================
   Compact mobile treatment, following the PEP-922/923/924/925 lessons:
   composed hero, readable body copy, 2x2 grids for icon-cards, a
   touch-friendly scroll-snap rail for the photo cards, 44px CTAs,
   no body overflow. Fully self-sufficient against any cached shared CSS.
   ===================================================================== */
@media (width<=760px){
  .notting-hill-hub-hero{min-height:clamp(560px,150vw,660px);align-items:flex-end}
  .notting-hill-hub-hero-media img{object-position:32% 50%}
  .notting-hill-hub-hero-shade{background:linear-gradient(190deg,#03120d1a 0%,#03120d59 26%,#03120ddb 54%,#03120d 100%)}
  .notting-hill-hub-hero-panel{width:100%;min-width:0;padding:22px 20px clamp(28px,7.4vw,36px)}
  .notting-hill-hub-hero-panel>.kicker{margin-bottom:10px}
  .notting-hill-hub-hero-rule{display:none}
  .notting-hill-hub-hero-support{font-size:15px;line-height:1.55;max-width:none;margin-bottom:20px}
  .notting-hill-hub-hero-actions{gap:12px 16px}
  .notting-hill-hub-hero-actions .button{min-height:44px}

  .notting-hill-hub-strip{grid-template-columns:repeat(2,minmax(0,1fr))}
  .notting-hill-hub-strip-item{padding:15px 14px;gap:11px}
  .notting-hill-hub-strip-item:nth-child(3){border-left:0}
  .notting-hill-hub-strip-item:nth-child(3),.notting-hill-hub-strip-item:nth-child(4){border-top:1px solid var(--line-light)}
  .notting-hill-hub-strip-icon{width:23px;height:23px}
  .notting-hill-hub-strip-item span{font-size:13px}

  .notting-hill-hub-intro{padding:36px 20px 8px;gap:26px}
  .notting-hill-hub-intro-lead{font-size:15px;line-height:1.6;max-width:none}
  .notting-hill-hub-intro-list li{font-size:14.5px;padding:10px 0}
  .notting-hill-hub-intro-proof{font-size:13px}
  .notting-hill-hub-sketch{max-width:280px}

  .notting-hill-hub-capabilities{grid-template-columns:repeat(2,minmax(0,1fr));padding:8px 20px 32px}
  .notting-hill-hub-capabilities article{padding:20px 14px}
  .notting-hill-hub-capabilities h3{font-size:14.5px}
  .notting-hill-hub-capabilities p{font-size:13.5px;line-height:1.5}

  .notting-hill-hub-cards{display:flex;grid-template-columns:unset;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scroll-padding-left:20px;gap:14px;padding:6px 20px 18px;margin:0}
  .notting-hill-hub-cards article{flex:0 0 auto;width:74%;max-width:300px;min-width:215px;scroll-snap-align:start}
  .notting-hill-hub-cards h3{font-size:15px}
  .notting-hill-hub-cards p{font-size:14px;line-height:1.5}

  .notting-hill-hub-related{padding:0 16px 40px}
  .notting-hill-hub-related-card{padding:28px 20px;border-radius:14px}
  .notting-hill-hub-related-links{flex-direction:column;gap:4px}
  .notting-hill-hub-related-links a{width:100%;justify-content:center;padding:11px 0;font-size:14.5px}
  .notting-hill-hub-related-links a:not(:last-child){border-right:0;border-bottom:1px solid var(--line);padding-right:0;margin-right:0}
}

@media (width<=380px){
  .notting-hill-hub-hero{min-height:580px}
  .notting-hill-hub-cards article{width:80%}
}