/* contact.css: contra-04. Page layer on system.css. */
.con{overflow-x:clip}
/* hero */
.c-hero{padding-top:calc(var(--hdr) + clamp(40px,9vh,120px));padding-bottom:clamp(56px,10vh,120px)}
.c-kick{color:var(--sign);margin-bottom:10px}
.c-hero h1{margin:0 0 clamp(16px,3vh,32px);color:var(--brick)}
.c-callrow{display:flex;align-items:center;gap:clamp(12px,3vw,48px)}
.c-sig{flex:0 0 clamp(56px,11vw,190px);height:auto}
.c-sig .hs{fill:var(--sign)}
.c-sig .arcs path{fill:none;stroke:var(--brick);stroke-width:8;stroke-linecap:square}
.js .c-sig .arcs path{opacity:0;animation:c-in 1.2s var(--ease-ramp) forwards}
.js .c-sig .arcs path:nth-child(1){animation-delay:.5s}.js .c-sig .arcs path:nth-child(2){animation-delay:.8s}.js .c-sig .arcs path:nth-child(3){animation-delay:1.1s}
@keyframes c-in{to{opacity:1}}
.c-tel{display:block;min-width:0;color:var(--brick)}
.c-tel .label{display:block;color:var(--steel);margin-bottom:8px}
.c-num{display:block;font-size:clamp(2.3rem,10.4vw,12rem);color:var(--sign);white-space:nowrap;letter-spacing:-.02em}
.c-num b{font-weight:800;color:var(--brick)}
a.c-tel:hover{text-decoration:none}
a.c-tel:hover .c-num{text-decoration:underline;text-decoration-thickness:.06em;text-underline-offset:.1em}
.c-now{display:flex;align-items:center;gap:12px;margin:clamp(20px,3vh,36px) 0 0;color:var(--brick)}
.c-now::before{content:"";width:14px;height:14px;flex:none;background:var(--steel)}
.c-now.is-open::before{background:var(--sign)}
.c-now.is-shut::before{background:var(--oxide)}

/* hours: brick section; each day is a bar on an 8 am–5:30 pm scale */
.c-hours{padding-block:calc(var(--sp-scene) + 6vw) var(--sp-scene);clip-path:polygon(0 6vw,100% 0,100% 100%,0 100%);margin-top:-6vw;position:relative}
.c-hhd h2{font-size:clamp(4rem,16vw,17rem);line-height:.8}
.c-tabw{position:relative}
.c-nowline{position:absolute;top:0;bottom:0;width:3px;background:var(--oxide);z-index:2;pointer-events:none}
.c-nowline::before{content:"Now (UK)";position:absolute;top:-24px;left:50%;transform:translateX(-50%);white-space:nowrap;font-stretch:75%;font-weight:650;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--oxide)}
.c-hhd{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:12px 28px;margin-bottom:clamp(24px,4vh,48px)}
.c-hhd h2{margin:0}
.c-tab{width:100%;border-collapse:collapse}
.c-tab tr{border-top:1px solid var(--line-l)}
.c-tab tr:last-child{border-bottom:1px solid var(--line-l)}
.c-tab th{text-align:left;font-size:clamp(1.2rem,2.6vw,2.6rem);padding:18px 18px 18px 0;width:24%;white-space:nowrap;line-height:1}
.c-tab td{padding:18px 0}
.c-bar span{display:block;position:relative;height:clamp(22px,3.4vh,34px);
  /* hour ticks: SVG tile, one 1px line per hour (8 am–5:30 pm) */
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25'%3E%3Crect width='1' height='100%25' fill='rgba(13,15,20,.16)'/%3E%3C/svg%3E") 0 0/10.5263% 100% repeat-x}
.c-bar i{position:absolute;top:0;bottom:0;background:var(--fascia);transform-origin:0 50%;transform:scaleX(min(1, calc(var(--p,1) * 2.2)))}
.c-tx{text-align:right;padding-left:18px!important;width:26%;white-space:nowrap;font-stretch:112%;font-weight:650;font-size:clamp(.95rem,1.4vw,1.15rem)}
.c-tab tr.is-today{background:var(--ink);color:var(--brick)}
.c-tab tr.is-today th{padding-left:14px;color:var(--sign)}
.c-tab tr.is-today .c-tx{padding-right:14px}
.c-tab tr.is-today .c-bar span{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25'%3E%3Crect width='1' height='100%25' fill='rgba(236,233,225,.14)'/%3E%3C/svg%3E") 0 0/10.5263% 100% repeat-x}
.c-tab tr.is-today .c-bar i{background:var(--sign)}
.c-tab tr.is-today th::after{content:"Today";display:inline-block;margin-left:12px;vertical-align:middle;padding:4px 7px;background:var(--sign);color:var(--ink);
  font-stretch:75%;font-weight:650;font-size:.75rem;letter-spacing:.08em;text-transform:uppercase}
.c-axis{position:relative;height:20px;margin:0 26% 6px 24%;color:#4d515a}
.c-axis span{position:absolute;transform:translateX(-50%);white-space:nowrap}
@media (max-width:699px){
  .c-tab,.c-tab tbody{display:block}
  .c-tab tr{display:grid;grid-template-columns:1fr auto;grid-template-areas:"d x" "b b";padding:14px 0}
  .c-tab th{grid-area:d;width:auto;padding:0 0 10px}
  .c-tx{grid-area:x;width:auto;padding:0!important}
  .c-bar{grid-area:b;padding:0!important}
  .c-tab tr.is-today{padding-inline:12px}
  .c-tab tr.is-today th,.c-tab tr.is-today .c-tx{padding-inline:0!important}
  .c-axis{margin:0 0 6px}
  .c-tab th{font-size:1.1rem}
  .c-tx{font-size:.9rem;padding-left:12px!important}
  .c-nowline::before{display:none}
}

/* find us: the address sits over a big doorway photo, locator behind */
.c-find{position:relative;display:grid;gap:28px;padding-block:var(--sp-scene)}
.c-find h2{margin-bottom:clamp(18px,3vh,32px)}
.c-find address{font-style:normal;font-size:clamp(2.2rem,6vw,7rem);line-height:.86;margin-bottom:22px}
.c-find address span{display:block}
@media (min-width:700px){.c-find address span{white-space:nowrap}}
.c-find .c-pc{color:var(--sign)}
.c-find .muted{margin-bottom:24px}
.c-fart{position:absolute;z-index:0;top:4%;right:-12%;width:min(90vw,620px);opacity:.9;pointer-events:none}
.c-loc{width:100%;height:auto;overflow:visible}
.c-loc .cross line{stroke:var(--line-d);stroke-width:1}
.c-loc .rings circle{fill:none;stroke:var(--steel);stroke-width:1;transform-origin:120px 120px;transform:scale(calc(.4 + min(1, var(--p,1) * 1.6) * .6))}
.c-loc .sweep{transform-origin:120px 120px;transform:rotate(calc(var(--p,1) * 300deg - 60deg))}
.c-loc .sweep path{fill:var(--sign);opacity:.16}
.c-loc .pin{fill:var(--sign);stroke:var(--ink);stroke-width:3}
.c-ftxt{position:relative;z-index:2}
.c-door{position:relative;z-index:1;margin:0}
.c-door .aperture{display:block;aspect-ratio:4/3}
.c-door img{transform:scale(calc(1.18 - var(--p,1) * .18))!important;transition:none}
.c-door figcaption{margin-top:12px}
@media (min-width:900px){
  .c-find{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gutter);align-items:center}
  .c-ftxt{grid-column:1/span 8;grid-row:1}
  .c-door{grid-column:6/-1;grid-row:1;margin-right:calc(var(--edge) * -1)}
  .c-door .aperture{aspect-ratio:.9}
  .c-door .aperture::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--ink) 0,rgba(13,15,20,.55) 45%,transparent 80%)}
  .c-fart{top:-6%;left:-10%;right:auto;width:46vw;opacity:.5}
  .c-find address{text-shadow:none}
}

/* before you call: the one fascia-blue field on this page */
.c-before{padding-block:calc(var(--sp-scene) + 5vw);clip-path:polygon(0 0,100% 5vw,100% 100%,0 calc(100% - 5vw))}
.c-bgrid{display:grid;gap:28px}
.c-bgrid h2{color:var(--sign)}
.c-own{margin:0;font-size:clamp(1.6rem,4.2vw,4.4rem);line-height:.95}
.c-own p{margin:0}
.c-acc h3{color:var(--sign);margin-bottom:12px}
.c-acc ul{list-style:none;margin:0;padding:0}
.c-acc li{padding:14px 0;border-top:1px solid rgba(236,233,225,.3);font-stretch:112%;font-weight:650}
@media (min-width:1000px){
  .c-bgrid{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gutter)}
  .c-bgrid h2{grid-column:1/-1}
  .c-own{grid-column:1/span 8}
  .c-acc{grid-column:10/span 3;align-self:end}
}

/* two reviews */
.c-said{padding-block:var(--sp-scene)}
.c-said h2{color:var(--steel);margin-bottom:28px}
.c-qs{display:grid;gap:clamp(40px,6vw,72px);margin-bottom:40px}
.c-qs .quote{font-size:var(--t-3);line-height:1.2}
.c-qs .quote p{margin:0}
.g-by{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;margin-top:16px}
.g-by cite{margin:0;color:var(--brick)}
@media (min-width:900px){
  .c-qs{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gutter)}
  .c-qs .quote:nth-child(1){grid-column:1/span 6}
  .c-qs .quote:nth-child(2){grid-column:8/span 5;margin-top:clamp(60px,8vw,140px)}
}

@media (prefers-reduced-motion:reduce){
  .c-door img{transform:none!important}
  .js .c-sig .arcs path{opacity:1}
  .c-bar i{transform:none}
  .c-loc .rings circle,.c-loc .sweep{transform:none}
}