/* TUNNEL: editorial service menu, original monochrome identity. */
:root{--ink:#f5f5f2;--quiet:#b7b7b4;--surface:#101010;--ease:cubic-bezier(.2,.7,.2,1);--space:clamp(64px,8vw,120px)}
body{color:var(--ink);text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
h2,h3,h4,.price-row strong,.signature-title>strong,.info-face strong{font-family:TunnelDisplay,"Arial Narrow",sans-serif;letter-spacing:-.015em}
.section{width:calc(100% - clamp(40px,8vw,112px));max-width:1360px}
.site-header{padding-inline:clamp(20px,4vw,56px)}

.hero-info{border-left-color:#a9a9a4}
.hero-actions .action{min-height:52px;border-radius:0;transition:background .25s,color .25s,transform .25s var(--ease)}
.hero-actions .primary,.base-book,.offer-button{background:var(--ink);box-shadow:none;border:0;color:#080808}
.hero-actions .secondary{background:#141414;border:0}
.action span,.outline-link span,.portrait-link span,.more-services span{display:inline-block;transition:transform .3s var(--ease)}
.services{padding-top:var(--space);padding-bottom:var(--space)}
.section-rule{display:none}
.services-heading{font-size:clamp(44px,5.5vw,76px);line-height:.98;margin-bottom:16px;max-width:18ch}
.services-guide{font-size:16px;line-height:1.6;margin-bottom:48px;color:var(--quiet)}
.services-grid{grid-template-columns:1fr 1.04fr;gap:clamp(32px,6vw,96px);align-items:start}
.other-services{font-size:30px;margin-bottom:24px;letter-spacing:0}
.price-row{border:0;border-bottom:0;background:#0a0a0a;margin-bottom:8px;padding:20px;grid-template-columns:72px 1fr auto;gap:20px;min-height:116px;transition:background .3s,transform .3s var(--ease)}
.service-thumb{width:72px;height:80px;transition:transform .5s var(--ease),filter .5s}
.service-name>span{font-family:TunnelDisplay,"Arial Narrow",sans-serif;font-size:29px;letter-spacing:0;line-height:1.1}
.service-name small{font-size:13px;line-height:1.5;color:var(--quiet)}
.choose-hint{font-size:11px;margin-top:10px;letter-spacing:.01em;color:#ddd}
.price-row strong{font-size:32px;font-variant-numeric:tabular-nums;white-space:nowrap}
.signature{padding:0;background:transparent;border:0;box-shadow:none}
.signature-photo{width:100%;height:clamp(340px,38vw,540px);max-height:none;object-fit:cover;object-position:center 60%;filter:grayscale(1);border:0}
.signature-title{padding-top:28px;gap:20px}.signature-title h3{font-size:clamp(32px,3.6vw,48px)}.signature-title>strong{font-size:48px}
.signature-includes{color:var(--quiet);font-size:15px;line-height:1.65;margin:12px 0 24px;max-width:40ch}
.base-book{width:100%;min-height:52px;margin:0;padding:16px 20px;font-size:13px;transition:background .25s,transform .25s var(--ease)}
.return-offer{border:0;margin-top:20px;padding:0;background:#101010}.return-offer>summary{padding:18px;font-size:13px}.offer-details{padding:0 20px 20px}.return-label{border:0;color:#eee;padding:0;text-transform:none;letter-spacing:0}.offer-total{border:0}
.more-services{padding-top:22px;border:0}.colour-services{border:0;margin-top:24px}.colour-services>summary{padding:20px;background:#101010}.photo-note{margin-top:32px}
.team-section{padding:24px 0 var(--space)}.team-heading{gap:32px;margin-bottom:48px;align-items:end}.team-heading h2{font-size:clamp(42px,5vw,68px);line-height:1;max-width:16ch}.team-heading p{font-size:15px;line-height:1.6;color:var(--quiet)}
.portrait-grid{gap:clamp(24px,5vw,72px)}.portrait-card{border:0;background:transparent;transition:transform .45s var(--ease)}
.portrait-caption{padding-top:24px;border:0}.portrait-caption h3{font-size:34px;line-height:1.05;letter-spacing:0}.portrait-link{min-height:44px;display:inline-flex;align-items:center;gap:32px;border:0;font-size:13px}.barber-experience{font-size:13px;color:var(--quiet)}
.portrait-ring:before{display:none}.portrait-ring img{transition:filter .6s var(--ease);filter:grayscale(1)}
.about{gap:clamp(32px,7vw,100px);padding-block:48px var(--space);align-items:center;border:0}.about-copy{padding:0}.about-copy>.micro{font-size:16px;letter-spacing:0;text-transform:none;color:var(--ink)}.about-copy p{font-size:17px;line-height:1.75;color:#dededb;max-width:47ch}.about-photo{min-height:420px}.about-photo img{height:100%;object-fit:cover}.about-photo figcaption{font-size:11px;color:var(--quiet)}
.outline-link{background:#171717;border:0;min-height:52px;font-size:14px;letter-spacing:.02em;transition:background .25s,transform .25s var(--ease)}
.faq{padding-block:0 var(--space);display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(32px,7vw,110px)}.faq h2{font-size:clamp(44px,5vw,68px);line-height:1;margin:0}.faq-list{margin:0}.faq-list details{border:0;background:#101010;margin-bottom:8px;padding-inline:24px}.faq-list summary{font-size:16px;padding-block:24px;line-height:1.4}.faq-list p{font-size:15px;line-height:1.7;color:#ddd;padding-bottom:20px}
.location{border:0;padding-block:0 64px;gap:40px}.location .micro{font-size:16px;text-transform:none;letter-spacing:0}.location h2{font-size:clamp(34px,3.7vw,52px);line-height:1.1;max-width:24ch}.contact-box p,.location p{font-size:15px;line-height:1.7}.contact-box{background:#101010;padding:28px}.map-visual{border:0}.location a{overflow-wrap:anywhere}
footer.section{padding-block:32px 48px;border-top:0;align-items:center}
.service-modal{padding:clamp(24px,4vw,44px);max-width:560px;width:calc(100% - 32px);max-height:90dvh;border:0;background:#0c0c0c;box-shadow:0 24px 100px #000c}.service-modal::backdrop{background:#000c;backdrop-filter:none}.service-modal h2{font-size:40px;line-height:1.05;padding-right:20px}.modal-close{width:44px;height:44px;background:#202020;border:0;right:12px;top:12px}.service-modal .micro{font-size:13px;letter-spacing:0;text-transform:none}.barber-choice legend{font-size:16px}.barber-choice .barber-option{border:0;background:#171717;box-shadow:none;border-radius:0;padding:12px;min-height:92px}.barber-choice .barber-option:has(input:checked){background:#282828;box-shadow:inset 3px 0 #eee;border:0}.modal-book,.copy-booking{min-height:48px;border-radius:0}.booking-help{font-size:13px;line-height:1.6}.service-modal[open]{animation:modal-enter .32s var(--ease)} /* taste-skill-ignore: actual modal overlay; blur disabled. */
button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible{outline:2px solid #f2f2f0;outline-offset:5px}
@media(hover:hover) and (pointer:fine){.price-row:hover{background:#181818;transform:translateX(4px)}.price-row:hover .service-thumb{transform:scale(1.035);filter:grayscale(1) brightness(1.1)}.portrait-card:hover{transform:translateY(-5px)}.portrait-card:hover .portrait-ring img{filter:grayscale(1) brightness(1.09)}.action:hover span,.outline-link:hover span,.portrait-link:hover span{transform:translate(3px,-2px)}.action:hover,.base-book:hover,.offer-button:hover{transform:translateY(-2px)}.outline-link:hover{background:#292929}.hero-actions .secondary:hover{background:#292929}.portrait-link:hover{color:#fff}}
@keyframes modal-enter{from{opacity:0;transform:translateY(12px) scale(.985)}to{opacity:1;transform:none}}
@media(min-width:1100px){.signature{position:sticky;top:32px}}
@media(max-width:900px){.services-grid{gap:28px}.price-row{padding:16px;gap:12px;grid-template-columns:52px 1fr auto}.service-thumb{width:52px;height:64px}.service-name>span{font-size:25px}.price-row strong{font-size:29px}.team-heading{align-items:start}.faq{grid-template-columns:1fr;gap:28px}}
@media(max-width:700px){.section{width:calc(100% - 40px)}.services-grid{grid-template-columns:1fr;gap:40px}.services{padding-block:56px 64px}.services-guide{margin-bottom:28px}.signature-photo{height:300px;max-height:none}.signature-title h3{font-size:36px}.signature-title>strong{font-size:42px}.price-row{padding:18px 14px;min-height:104px;grid-template-columns:58px 1fr auto;gap:14px}.service-thumb{width:58px;height:70px}.service-name>span{font-size:26px}.price-row strong{font-size:30px}.services-heading{font-size:44px}.team-heading{margin-bottom:28px;gap:20px}.team-heading h2{font-size:42px}.team-identity{gap:16px}.team-emblem{flex:none}.team-heading p{font-size:15px}.portrait-grid{gap:36px}.portrait-caption h3{font-size:32px}.team-section{padding-bottom:72px}.about{padding-block:0 72px;gap:32px}.about-copy p{font-size:16px}.about-photo{height:320px;min-height:320px}.faq{padding-bottom:64px}.faq-list details{padding-inline:18px}.location{padding-bottom:32px}.location h2{font-size:36px}.contact-box{padding:24px}.service-modal{max-height:88dvh}.hero-actions .action{min-height:50px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation:none!important;transition:none!important}.signature{position:static}.portrait-card:hover,.price-row:hover{transform:none}}
/* Cover the baked-in mark in the tablet crop as well as the wide hero. */
@media(min-width:701px) and (max-width:1000px){.hero-visual:after{background:linear-gradient(to right,transparent 12%,#000 18%,#000 100%)}} /* taste-skill-ignore: neutral image scrim. */

/* Keep service names and prices inside the phone's content width. */
.services-grid > *, .price-row > *, .signature-title > * { min-width:0; }
@media(max-width:700px){
 .services-grid{grid-template-columns:minmax(0,1fr)}
 .price-row{width:100%;grid-template-columns:58px minmax(0,1fr) auto;gap:10px}
 .service-name>span{overflow-wrap:anywhere}
 .signature-title{flex-wrap:wrap;gap:8px 16px}
 .signature-title h3{font-size:clamp(28px,8vw,36px)}
 .signature-title>strong{flex:none;white-space:nowrap}
 .price-row strong{font-size:clamp(25px,7vw,30px);white-space:nowrap}
}

/* Responsive content geometry, including phones in landscape. */
.services-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.04fr)}
.price-row{grid-template-columns:72px minmax(0,1fr) auto}
.price-row .service-name{min-width:0}
.price-row .service-name>span{display:block;overflow-wrap:normal;white-space:normal}
.about .about-photo{height:auto;min-height:0;align-self:start;margin:0}
.about .about-photo img{display:block;position:static;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover}
.about .about-photo figcaption{position:static;padding:14px 16px;line-height:1.5}
.signature-title{flex-wrap:wrap}
@media(max-width:1100px){
 .services-grid{grid-template-columns:minmax(0,1fr);gap:40px}
 .signature{position:static;min-width:0}
 .price-row{grid-template-columns:64px minmax(0,1fr) auto;gap:16px;width:100%}
 .service-name>span{font-size:clamp(24px,3.5vw,32px)}
 .price-row strong{font-size:30px}
 .about{grid-template-columns:minmax(0,1fr);gap:28px;align-items:start}
 .about-copy p{max-width:65ch}
 .about-photo{width:100%;max-width:720px}
 .location{grid-template-columns:minmax(0,1fr)}
 .signature-photo{height:auto;aspect-ratio:16/10;max-height:440px}
}
@media(max-width:700px){
 .price-row{grid-template-columns:58px minmax(0,1fr);gap:6px 14px;align-items:start;padding:16px}
 .price-row .service-thumb{grid-row:1/3;width:58px;height:76px}
 .price-row .service-name{grid-column:2;grid-row:1}
 .price-row>strong{grid-column:2;grid-row:2;justify-self:start;font-size:27px;line-height:1.15;margin-top:6px}
 .price-row .service-name>span{font-size:26px}
 .section{width:calc(100% - 40px);min-width:0}
}
@media(orientation:landscape) and (max-height:600px) and (max-width:1100px){
 .hero{min-height:380px}
 .hero-content{min-height:380px;width:60%;margin-left:36%;padding:24px 0;gap:18px}
 .hero-content h1{width:75%;max-width:320px}
 .hero-image,.hero-video{object-fit:contain;object-position:left center}
 .hero-info{position:relative;inset:auto;height:166px;width:100%}
 .hero-actions{gap:10px}
 .hero-actions .action{min-height:44px;padding:12px 16px}
 .site-header{height:80px}
}