/* James Woolford Design — all-services video hero, contact rebuild and JW circle mark v44 */

:root{
  --jw44-blue:#2458ff;
  --jw44-dark:#080a11;
  --jw44-panel:#111522;
  --jw44-paper:#f5f3ee;
  --jw44-line:rgba(16,16,16,.14);
}

/* -------------------------------------------------------------------------- */
/* Brand mark — circle only, no visible wordmark                              */
/* -------------------------------------------------------------------------- */
.site-header__brand,
.mobile-menu__brand,
.jw-footer__wordmark,
.slider-brand{
  width:54px!important;
  min-width:54px!important;
  max-width:54px!important;
  height:54px!important;
  padding:0!important;
  border:0!important;
  border-radius:50%!important;
  background-color:transparent!important;
  background-image:url("./images/jw-circle-negative-white.png")!important;
  background-repeat:no-repeat!important;
  background-position:center!important;
  background-size:contain!important;
  overflow:visible!important;
  color:transparent!important;
  font-size:0!important;
  line-height:0!important;
  flex:0 0 54px!important;
  filter:drop-shadow(0 9px 22px rgba(0,0,0,.18));
}
.site-header__brand>*,
.mobile-menu__brand>*,
.jw-footer__wordmark>*,
.slider-brand>*{display:none!important}
.jw-footer__wordmark{width:64px!important;min-width:64px!important;max-width:64px!important;height:64px!important;flex-basis:64px!important}

/* -------------------------------------------------------------------------- */
/* Services overview — same visual language as the individual service heroes  */
/* -------------------------------------------------------------------------- */
.services-page .services-hero.jw44-services-hero{
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
  min-height:clamp(690px,82vh,940px)!important;
  padding:clamp(142px,12vw,194px) 0 clamp(82px,8vw,126px)!important;
  color:#fff!important;
  background:linear-gradient(135deg,#080a11,#111c3c)!important;
}
.services-page .services-hero.jw44-services-hero::before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  z-index:1!important;
  display:block!important;
  pointer-events:none!important;
  background:
    linear-gradient(90deg,rgba(5,7,13,.93) 0%,rgba(5,7,13,.82) 42%,rgba(5,7,13,.55) 70%,rgba(5,7,13,.72) 100%),
    linear-gradient(180deg,rgba(3,4,9,.14),rgba(3,4,9,.62))!important;
}
.services-page .jw44-services-video{
  position:absolute;
  inset:0;
  z-index:0;
  overflow:hidden;
  pointer-events:none;
}
.services-page .jw44-services-video video{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
  filter:saturate(.82) contrast(1.08) brightness(.66);
  transform:scale(1.025);
}
.services-page .jw44-services-hero .services-hero__grid{
  position:relative!important;
  z-index:2!important;
  display:grid!important;
  grid-template-columns:minmax(0,1.18fr) minmax(310px,.72fr) minmax(340px,.68fr)!important;
  gap:clamp(40px,5vw,82px)!important;
  align-items:end!important;
  width:min(1500px,calc(100% - clamp(40px,8vw,150px)))!important;
  max-width:none!important;
  margin:0 auto!important;
  padding:0 0 clamp(34px,4vw,52px)!important;
  border-bottom:1px solid rgba(255,255,255,.22)!important;
}
.services-page .jw44-services-title .section-kicker{color:#9cb0ff!important}
.services-page .jw44-services-title h1{
  margin:0!important;
  max-width:9ch!important;
  color:#fff!important;
  font-size:clamp(66px,6.2vw,104px)!important;
  line-height:.88!important;
  letter-spacing:-.075em!important;
  text-shadow:0 4px 34px rgba(0,0,0,.30)!important;
  text-wrap:balance!important;
}
.services-page .jw44-services-details{
  align-self:end!important;
  padding-bottom:4px!important;
}
.services-page .jw44-services-details p{
  margin:0!important;
  max-width:43ch!important;
  color:rgba(255,255,255,.76)!important;
  font-size:clamp(16px,1.1vw,19px)!important;
  line-height:1.72!important;
}
.services-page .jw44-services-cta{
  display:inline-flex!important;
  align-items:center!important;
  gap:18px!important;
  margin-top:30px!important;
  padding:17px 22px!important;
  background:var(--jw44-blue)!important;
  color:#fff!important;
  font-size:11px!important;
  font-weight:800!important;
  letter-spacing:.08em!important;
  text-transform:uppercase!important;
  box-shadow:0 18px 42px rgba(36,88,255,.34)!important;
  transition:transform .25s ease,box-shadow .25s ease!important;
}
.services-page .jw44-services-cta:hover{transform:translateY(-3px)!important;box-shadow:0 24px 54px rgba(36,88,255,.45)!important}
.services-page .jw44-services-panel{
  align-self:end!important;
  min-height:360px!important;
  padding:clamp(28px,3vw,42px)!important;
  border:1px solid rgba(255,255,255,.20)!important;
  background:linear-gradient(145deg,rgba(10,12,20,.82),rgba(25,38,82,.68))!important;
  color:#fff!important;
  box-shadow:0 34px 90px rgba(0,0,0,.34)!important;
  backdrop-filter:blur(18px)!important;
  -webkit-backdrop-filter:blur(18px)!important;
}
.services-page .jw44-services-panel__eyebrow{
  display:block;
  margin-bottom:28px;
  color:#9cb0ff;
  font-size:10px;
  font-weight:800;
  letter-spacing:.18em;
  text-transform:uppercase;
}
.services-page .jw44-services-panel h2{
  margin:0 0 30px!important;
  color:#fff!important;
  font-size:clamp(38px,3.2vw,54px)!important;
  line-height:.9!important;
  letter-spacing:-.065em!important;
}
.services-page .jw44-services-panel__list{border-top:1px solid rgba(255,255,255,.14)}
.services-page .jw44-services-panel__list>div{
  display:grid;
  grid-template-columns:34px 1fr;
  gap:14px;
  align-items:center;
  padding:18px 0;
  border-bottom:1px solid rgba(255,255,255,.14);
}
.services-page .jw44-services-panel__list span{color:#8fa7ff;font-size:10px;font-weight:800;letter-spacing:.12em}
.services-page .jw44-services-panel__list strong{font-size:15px;font-weight:700;color:#fff}

/* -------------------------------------------------------------------------- */
/* Contact page — rebuilt editorial hero and working project enquiry form      */
/* -------------------------------------------------------------------------- */
.contact-page .contact-hero.jw44-contact-hero{
  padding:clamp(118px,10vw,168px) 0 clamp(72px,7vw,112px)!important;
  background:
    radial-gradient(circle at 83% 14%,rgba(36,88,255,.20),rgba(36,88,255,.05) 32%,transparent 64%),
    linear-gradient(180deg,#f5f3ee,#efeee9)!important;
  color:#101010!important;
  border-bottom:1px solid var(--jw44-line)!important;
}
.contact-page .jw44-contact-hero__grid{
  display:grid!important;
  grid-template-columns:minmax(0,1.16fr) minmax(360px,.84fr)!important;
  gap:clamp(60px,8vw,126px)!important;
  align-items:end!important;
  width:min(1450px,calc(100% - clamp(40px,8vw,150px)))!important;
  max-width:none!important;
  margin:0 auto!important;
}
.contact-page .jw44-contact-copy .section-kicker{color:var(--jw44-blue)!important}
.contact-page .jw44-contact-copy h1{
  margin:0!important;
  max-width:11ch!important;
  color:#101010!important;
  font-size:clamp(62px,6vw,98px)!important;
  line-height:.9!important;
  letter-spacing:-.075em!important;
  text-wrap:balance!important;
}
.contact-page .jw44-contact-copy p{
  max-width:54ch!important;
  margin:30px 0 0!important;
  color:#625e57!important;
  font-size:clamp(16px,1.08vw,19px)!important;
  line-height:1.72!important;
}
.contact-page .jw44-contact-quick{
  min-height:360px!important;
  padding:clamp(30px,3vw,46px)!important;
  border:1px solid rgba(16,16,16,.12)!important;
  background:linear-gradient(145deg,#0b0d15,#172248)!important;
  color:#fff!important;
  box-shadow:0 30px 80px rgba(26,31,52,.16)!important;
}
.contact-page .jw44-contact-quick .contact-quick__label{color:#9cb0ff!important}
.contact-page .jw44-contact-quick h2{color:#fff!important;font-size:clamp(38px,3.5vw,56px)!important;line-height:.94!important;letter-spacing:-.06em!important}
.contact-page .jw44-contact-quick p{color:rgba(255,255,255,.68)!important;line-height:1.7!important}
.contact-page .jw44-contact-quick>a{background:var(--jw44-blue)!important;color:#fff!important;border:0!important}
.contact-page .jw44-contact-quick .contact-quick__location{color:rgba(255,255,255,.62)!important;border-top-color:rgba(255,255,255,.13)!important}

.contact-page .project-form-section.jw44-contact-form-section{
  padding:clamp(88px,9vw,144px) 0!important;
  background:
    radial-gradient(circle at 86% 8%,rgba(36,88,255,.24),transparent 36%),
    #080a11!important;
  color:#fff!important;
}
.contact-page .jw44-contact-form-section .project-form-layout{
  display:grid!important;
  grid-template-columns:minmax(290px,.58fr) minmax(0,1.42fr)!important;
  gap:clamp(54px,7vw,110px)!important;
  align-items:start!important;
}
.contact-page .jw44-contact-form-intro{position:sticky!important;top:130px!important}
.contact-page .jw44-contact-form-intro .section-kicker{color:#9cb0ff!important}
.contact-page .jw44-contact-form-intro h2{
  max-width:9ch!important;
  color:#fff!important;
  font-size:clamp(48px,4.6vw,76px)!important;
  line-height:.92!important;
  letter-spacing:-.065em!important;
}
.contact-page .jw44-contact-form-intro p{max-width:36ch!important;color:rgba(255,255,255,.62)!important;line-height:1.72!important}
.jw44-project-form{
  padding:clamp(28px,4vw,52px);
  border:1px solid rgba(255,255,255,.16);
  background:linear-gradient(145deg,rgba(255,255,255,.07),rgba(255,255,255,.025));
  box-shadow:0 30px 90px rgba(0,0,0,.25);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}
.jw44-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.jw44-project-form label>span,.jw44-form-group legend{display:block;margin-bottom:10px;color:#fff;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.jw44-project-form input[type="text"],
.jw44-project-form input[type="email"],
.jw44-project-form input[type="tel"],
.jw44-project-form textarea{
  width:100%;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(4,6,11,.58);
  color:#fff;
  outline:none;
  padding:16px 17px;
  font:inherit;
  transition:border-color .2s,box-shadow .2s;
}
.jw44-project-form input:focus,.jw44-project-form textarea:focus{border-color:#5d7cff;box-shadow:0 0 0 3px rgba(36,88,255,.14)}
.jw44-form-group{margin:32px 0 0;padding:0;border:0}
.jw44-choice-grid{display:flex;flex-wrap:wrap;gap:10px}
.jw44-choice-grid--services{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.jw44-choice{
  min-height:50px;
  padding:13px 15px;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(255,255,255,.035);
  color:rgba(255,255,255,.72);
  font-size:12px;
  font-weight:700;
  cursor:pointer;
  transition:background .2s,border-color .2s,color .2s,transform .2s;
}
.jw44-choice:hover,.jw44-choice.is-selected{border-color:#5d7cff;background:rgba(36,88,255,.22);color:#fff;transform:translateY(-2px)}
.jw44-form-split{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.jw44-message{display:block;margin-top:32px}
.jw44-consent{display:flex!important;align-items:flex-start;gap:12px;margin-top:20px;color:rgba(255,255,255,.65)!important;font-size:13px!important;line-height:1.5!important}
.jw44-consent input{margin-top:3px;accent-color:var(--jw44-blue)}
.jw44-consent span{margin:0!important;color:inherit!important;font-size:inherit!important;font-weight:400!important;letter-spacing:0!important;text-transform:none!important}
.jw44-honeypot{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;overflow:hidden!important}
.jw44-submit-row{display:flex;align-items:center;justify-content:space-between;gap:28px;margin-top:30px;padding-top:26px;border-top:1px solid rgba(255,255,255,.13)}
.jw44-submit-row p{max-width:42ch;margin:0;color:rgba(255,255,255,.54);font-size:13px;line-height:1.6}
.jw44-submit-row button{display:inline-flex;align-items:center;gap:18px;border:0;background:var(--jw44-blue);color:#fff;padding:17px 22px;font-size:11px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;cursor:pointer;box-shadow:0 18px 44px rgba(36,88,255,.34)}
.jw44-submit-row button:disabled{opacity:.6;cursor:wait}
.jw44-form-status{margin-top:18px;padding:0;color:rgba(255,255,255,.72);font-size:14px}
.jw44-form-status.is-success,.jw44-form-status.is-error{padding:14px 16px;border:1px solid rgba(255,255,255,.15)}
.jw44-form-status.is-success{border-color:rgba(67,214,132,.45);background:rgba(67,214,132,.1);color:#baf3d2}
.jw44-form-status.is-error{border-color:rgba(255,100,100,.42);background:rgba(255,100,100,.09);color:#ffd0d0}

.contact-page .contact-next.jw44-contact-next{
  padding:clamp(84px,8vw,126px) 0!important;
  background:#eef0f8!important;
  color:#101010!important;
}
.contact-page .jw44-contact-next .contact-next__head h2{color:#101010!important}
.contact-page .jw44-contact-next .contact-next__grid article{border:1px solid rgba(16,16,16,.12)!important;background:rgba(255,255,255,.68)!important;box-shadow:0 18px 44px rgba(21,31,64,.06)!important}
.contact-page .jw44-contact-next .contact-next__grid h3{color:#101010!important}
.contact-page .jw44-contact-next .contact-next__grid p{color:#625e57!important}

/* -------------------------------------------------------------------------- */
/* Responsive                                                                  */
/* -------------------------------------------------------------------------- */
@media(max-width:1180px){
  .services-page .jw44-services-hero .services-hero__grid{grid-template-columns:minmax(0,1fr) minmax(330px,.72fr)!important}
  .services-page .jw44-services-details{grid-column:1!important}
  .services-page .jw44-services-panel{grid-column:2!important;grid-row:1 / span 2!important}
  .contact-page .jw44-contact-hero__grid{grid-template-columns:1fr minmax(330px,.72fr)!important}
}

@media(max-width:900px){
  .site-header__brand{width:48px!important;min-width:48px!important;max-width:48px!important;height:48px!important;flex-basis:48px!important}
  .mobile-menu__brand{width:52px!important;min-width:52px!important;max-width:52px!important;height:52px!important;flex-basis:52px!important}
  .services-page .services-hero.jw44-services-hero{min-height:0!important;padding:122px 0 76px!important}
  .services-page .jw44-services-hero::before{background:linear-gradient(180deg,rgba(5,7,13,.68),rgba(5,7,13,.90) 58%,rgba(5,7,13,.96))!important}
  .services-page .jw44-services-hero .services-hero__grid,
  .contact-page .jw44-contact-hero__grid,
  .contact-page .jw44-contact-form-section .project-form-layout{grid-template-columns:1fr!important}
  .services-page .jw44-services-panel{grid-column:auto!important;grid-row:auto!important;width:min(100%,620px)!important}
  .services-page .jw44-services-title h1{max-width:10ch!important;font-size:clamp(58px,10vw,84px)!important}
  .contact-page .jw44-contact-form-intro{position:static!important}
  .jw44-choice-grid--services{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:640px){
  .site-header__brand{width:44px!important;min-width:44px!important;max-width:44px!important;height:44px!important;flex-basis:44px!important}
  .services-page .services-hero.jw44-services-hero{padding:108px 0 56px!important}
  .services-page .jw44-services-hero .services-hero__grid,
  .contact-page .jw44-contact-hero__grid{width:calc(100% - 36px)!important;gap:30px!important}
  .services-page .jw44-services-title h1{font-size:clamp(48px,14vw,66px)!important;max-width:9ch!important}
  .services-page .jw44-services-panel{min-height:0!important;padding:26px 22px!important}
  .services-page .jw44-services-details p{font-size:15px!important}
  .contact-page .contact-hero.jw44-contact-hero{padding:106px 0 62px!important}
  .contact-page .jw44-contact-copy h1{font-size:clamp(48px,13vw,66px)!important;max-width:9ch!important}
  .contact-page .jw44-contact-quick{min-height:0!important;padding:28px 22px!important}
  .contact-page .jw44-contact-form-section .project-form-layout{gap:32px!important}
  .jw44-project-form{padding:24px 18px}
  .jw44-form-grid,.jw44-form-split{grid-template-columns:1fr}
  .jw44-choice-grid--services{grid-template-columns:1fr 1fr}
  .jw44-submit-row{align-items:stretch;flex-direction:column}
  .jw44-submit-row button{justify-content:center;width:100%}
}

@media(prefers-reduced-motion:reduce){
  .services-page .jw44-services-video video{display:none!important}
  .services-page .jw44-services-hero{background:linear-gradient(135deg,#080a11,#182652)!important}
}