/* Websites and digital support, within the approved Volts colour palette. */
.web-teaser{padding-top:0}
.web-teaser-panel{display:grid;grid-template-columns:70px minmax(0,1fr) auto;gap:28px;align-items:center;background:var(--pale);border:1px solid #d6e1f0;border-left:4px solid var(--red);border-radius:10px;padding:38px 40px}
.web-teaser-symbol{display:grid;place-items:center;width:70px;height:70px;background:#fff;border-radius:16px;color:var(--blue)}
.web-teaser-symbol>.icon{width:38px;height:38px}
.web-teaser-copy h2{font-size:30px;letter-spacing:-1px}
.web-teaser-copy .eyebrow{font-size:10px;margin-bottom:12px}
.web-teaser-copy p:not(.eyebrow){font-size:14px;margin-top:16px;max-width:660px}
.web-teaser-panel>.button{white-space:nowrap}
.web-hero{padding-block:68px 80px;overflow:hidden}
.web-hero-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:72px;align-items:center}
.web-hero-copy h1{font-size:clamp(42px,4.6vw,64px)}
.web-hero-copy .lead{font-size:22px;margin-bottom:20px}
.web-local-note{font-size:12px;color:var(--blue);margin-top:25px}
.web-hero-art{position:relative;background:var(--pale);border-radius:24px;padding:35px 20px 80px;border:1px solid #dce6f3;min-width:0}
.web-browser{background:#fff;border-radius:10px;overflow:hidden;box-shadow:0 16px 35px #142b5015;transform:rotate(-3deg);border:1px solid #d0dbeb}
.web-browser-bar{height:33px;display:flex;align-items:center;gap:5px;background:var(--soft);padding:0 12px;border-bottom:1px solid var(--line)}
.web-browser-bar>i{width:5px;height:5px;border-radius:100%;background:#a7b8d0}
.web-browser-bar>i:first-child{background:var(--red)}
.web-browser-bar>span{font-size:7px;letter-spacing:1px;color:var(--muted);margin-left:7px;line-height:1.4}
.web-browser-content{padding:24px}
.web-browser-mark{width:28px;height:5px;background:var(--red);border-radius:4px}
.web-browser-lines{display:flex;justify-content:flex-end;gap:8px;margin-top:-3px}
.web-browser-lines>i{height:3px;width:30px;background:#d1deee}
.web-browser-layout{display:grid;grid-template-columns:1.2fr 1fr;align-items:center;gap:20px;margin-top:30px}
.web-browser-heading{color:var(--navy);font-size:25px;line-height:1.2;letter-spacing:-1px;font-weight:700}
.web-browser-window{background:var(--pale);border-radius:15px;min-height:100px;display:grid;place-items:center;color:var(--blue)}
.web-browser-window>.icon{width:55px;height:55px}
.web-browser-action{width:80px;height:11px;background:var(--red);border-radius:3px;margin-top:12px}
.web-browser-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;border-top:1px solid var(--line);margin-top:25px;padding-top:20px}
.web-browser-tiles>span{display:flex;flex-direction:column;align-items:center;gap:8px;font-size:9px;color:var(--blue)}
.web-browser-tiles .icon{width:24px;height:24px}
.web-art-caption{position:absolute;right:22px;bottom:22px;padding-left:15px;border-left:3px solid var(--red);color:var(--blue);font-size:16px;line-height:1.4;font-weight:700}
.web-services{background:var(--soft)}
.web-service-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.web-service-card{padding:30px;background:#fff;border:1px solid var(--line);border-radius:10px}
.web-service-card>.icon{width:34px;height:34px;color:var(--blue);margin-bottom:25px}
.web-service-card h3{font-size:22px;margin-bottom:17px}
.web-service-card p{font-size:14px}
.web-quote-note{display:grid;grid-template-columns:1fr 2fr;gap:35px;border-top:1px solid #d6dee9;padding-top:28px;margin-top:32px;align-items:start}
.web-quote-note strong{font-size:19px;color:var(--blue);line-height:1.4}
.web-quote-note p{font-size:13px}
.web-work-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}
.web-work-card{border:1px solid var(--line);border-radius:12px;overflow:hidden;display:flex;flex-direction:column;background:#fff}
.web-client-logo{height:210px;display:flex;align-items:center;justify-content:center;padding:35px 45px;background:#f8fafc;border-bottom:1px solid var(--line)}
.web-client-logo img{width:100%;height:100%;object-fit:contain;max-width:340px}
.web-work-copy{padding:30px;display:flex;flex:1;flex-direction:column;align-items:flex-start}
.web-work-copy .eyebrow{font-size:10px;margin-bottom:15px}
.web-work-copy h3{font-size:28px;margin-bottom:18px}
.web-work-copy p:not(.eyebrow){font-size:14px}
.web-project-tags{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:8px;margin:23px 0 18px}
.web-project-tags>li{font-size:10px;color:var(--blue);background:var(--pale);padding:5px 10px;border-radius:4px}
.web-work-copy>.text-link{margin-top:auto}
.web-work-note{margin-top:20px}
.web-process{padding-top:0}
.web-enquiry{background:var(--pale)}
.web-enquiry-grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:85px;align-items:start}
.web-enquiry-grid>div>p:not(.eyebrow){margin-top:20px}
.web-enquiry-grid .phone-link{margin-top:24px}
.web-enquiry-panel{background:#fff;border:1px solid #d3dfed;border-radius:12px;padding:35px;min-width:0}
.web-enquiry-panel h3{font-size:26px}
.web-enquiry .form-hint a{text-decoration:underline;text-underline-offset:3px}
@media(min-width:951px) and (max-width:1100px){.header-inner{gap:18px}.nav-links{gap:17px}.header-phone{padding-left:16px}}
@media(min-width:651px) and (max-width:950px){
 .header-inner{min-height:84px}.header-phone span{display:inline}.header-phone{margin-left:0}
 html.js .menu-toggle{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--line);border-radius:4px;font-size:13px;padding:10px 13px;color:var(--blue);cursor:pointer;min-height:44px}
 html.js .nav-links{display:none}
 html.js .nav-links.is-open{display:flex;flex-direction:column;align-items:stretch;position:absolute;left:0;right:0;top:100%;background:#fff;border:1px solid var(--line);padding:15px 24px;box-shadow:0 12px 18px #142b5010;gap:0}
 html.js .nav-links>a{padding:13px 0;font-size:15px}
 html:not(.js) .header-inner{flex-wrap:wrap}html:not(.js) .header-inner>nav{order:3;width:100%}html:not(.js) .nav-links{flex-wrap:wrap}
}
@media(max-width:1100px){.web-teaser-panel{grid-template-columns:60px minmax(0,1fr);padding:30px;gap:22px}.web-teaser-symbol{width:60px;height:60px}.web-teaser-panel>.button{grid-column:2;justify-self:start}.web-hero-grid{gap:40px}.web-enquiry-grid{gap:40px}.web-enquiry-panel{padding:28px}.web-browser-content{padding:20px}.web-browser-heading{font-size:21px}}
@media(max-width:850px){.web-hero-grid{grid-template-columns:1fr;gap:40px}.web-hero-copy{max-width:660px}.web-hero-art{max-width:520px;width:100%;justify-self:center}.web-service-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.web-enquiry-grid{grid-template-columns:1fr;gap:35px}.web-enquiry-grid>div:first-child{max-width:620px}.web-browser-heading{font-size:27px}}
@media(max-width:650px){.web-teaser-panel{width:calc(100% - 36px);padding:25px;grid-template-columns:1fr;gap:20px}.web-teaser-panel>.button{grid-column:auto;white-space:normal}.web-teaser-symbol{width:52px;height:52px;border-radius:12px}.web-teaser-symbol>.icon{width:30px;height:30px}.web-teaser-copy h2{font-size:28px}.web-hero{padding-block:40px 48px}.web-hero-copy h1{font-size:44px;letter-spacing:-2px}.web-hero-copy .lead{font-size:20px}.web-hero-art{padding:25px 15px 80px;border-radius:18px}.web-browser-content{padding:20px}.web-browser-heading{font-size:22px}.web-browser-window{min-height:90px}.web-browser-layout{gap:15px}.web-service-grid,.web-work-grid,.web-quote-note{grid-template-columns:1fr}.web-service-card{padding:26px}.web-quote-note{gap:14px}.web-client-logo{height:180px;padding:30px}.web-work-copy{padding:26px}.web-process{padding-top:0}.web-enquiry-panel{padding:25px 20px}.web-enquiry-panel h3{font-size:24px}.web-enquiry-panel .form-pair{grid-template-columns:1fr}.web-enquiry-panel .button{width:100%}}
@media(prefers-reduced-motion:reduce){.web-browser{transform:none}}

/* Real portfolio snapshots and the lightweight booking illustration. */
.web-device-scene{padding:34px 24px 58px;border-radius:22px;min-height:390px;overflow:visible;isolation:isolate}
.web-desktop-device{position:relative;background:#16243b;border:8px solid #16243b;border-bottom-width:12px;border-radius:12px;box-shadow:0 20px 35px #142b5023;transform:rotate(-3deg);overflow:hidden;margin:8px 18px 18px 0}
.web-device-toolbar{height:21px;display:flex;align-items:center;gap:4px;background:#16243b;padding:0 4px;color:#dce5f2}
.web-device-toolbar>span{width:4px;height:4px;border-radius:50%;background:#7e91ad}
.web-device-toolbar>span:first-child{background:#ef5e5e}
.web-device-toolbar>small{font-size:7px;letter-spacing:.4px;margin-left:8px;line-height:1.3}
.web-desktop-device>img{width:100%;height:auto;aspect-ratio:1200/824;object-fit:cover}
.web-phone-illustration{position:absolute;right:8px;bottom:58px;z-index:1;width:144px;min-height:266px;border:6px solid #17263e;border-radius:23px;background:#fff;box-shadow:0 15px 24px #142b5025;padding:16px 10px 15px;transform:rotate(5deg);color:var(--navy)}
.web-phone-speaker{width:36px;height:4px;background:#17263e;border-radius:5px;margin:-9px auto 15px}
.web-phone-brand{font-size:7px;font-weight:700;letter-spacing:.6px;color:var(--blue)}
.web-phone-title{font-size:21px;line-height:1.15;font-weight:700;letter-spacing:-.8px;margin-top:20px}
.web-phone-month{font-size:6px;font-weight:700;letter-spacing:.6px;color:var(--muted);margin-top:16px}
.web-phone-dates{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin-top:7px}
.web-phone-dates>i{display:grid;place-items:center;background:var(--pale);border-radius:3px;min-height:20px;font:normal 8px Arial,sans-serif;color:var(--blue)}
.web-phone-dates>i:nth-child(2){background:var(--blue);color:#fff}
.web-phone-slot{font-size:7px;margin-top:12px;color:var(--blue)}
.web-phone-line{height:3px;background:#dfe7f2;border-radius:3px;margin-top:9px;width:100%}
.web-phone-line.short{width:65%;margin-top:6px}
.web-phone-button{background:var(--red);border-radius:4px;text-align:center;padding:7px 3px;color:#fff;font-size:8px;font-weight:700;margin-top:14px}
.web-device-caption{position:relative;margin:25px 0 0;max-width:295px;font-size:11px;line-height:1.65;color:var(--muted);padding-right:12px}
.web-project-preview{display:block;overflow:hidden;background:var(--pale);border-bottom:1px solid var(--line)}
.web-preview-bar{height:34px;display:flex;align-items:center;gap:5px;padding:0 17px;background:#eaf0f8;border-bottom:1px solid #d8e2f0}
.web-preview-bar>i{width:5px;height:5px;border-radius:50%;background:#a5b5cc}
.web-preview-bar>i:first-child{background:var(--red)}
.web-preview-bar>span{margin-left:10px;font-size:10px;color:var(--blue);line-height:1.5}
.web-project-preview>img{width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;object-position:top}
.web-work-card{transition:box-shadow .18s ease,transform .18s ease}
.web-work-card:hover,.web-work-card:focus-within{box-shadow:0 14px 35px #142b5010;transform:translateY(-3px)}
.web-work-card>.web-client-logo{height:102px;padding:22px 30px;background:#fff;border-bottom:0;justify-content:flex-start}
.web-work-card>.web-client-logo>img{max-width:190px;object-position:left center}
.web-work-copy{padding-top:10px}
.web-local-note{font-weight:700;padding-left:13px;border-left:3px solid var(--red);font-size:13px}
@media(max-width:1100px){.web-device-scene{padding:26px 18px 54px;min-height:345px}.web-phone-illustration{width:130px;right:0;bottom:50px}.web-phone-title{font-size:19px}.web-device-caption{max-width:230px;font-size:10px}}
@media(max-width:850px){.web-device-scene{max-width:560px;min-height:410px;padding:34px 28px 60px}.web-phone-illustration{width:150px;right:5px;bottom:55px}.web-device-caption{max-width:320px;font-size:11px}}
@media(max-width:650px){.web-device-scene{min-height:350px;padding:24px 16px 66px;border-radius:17px}.web-desktop-device{border-width:6px;border-bottom-width:9px;margin-right:5px;border-radius:9px}.web-phone-illustration{width:116px;min-height:237px;border-width:5px;border-radius:19px;right:2px;bottom:47px;padding-inline:8px}.web-phone-title{font-size:17px;margin-top:17px}.web-phone-brand{font-size:6px}.web-phone-month{font-size:5px;margin-top:13px}.web-phone-dates{gap:4px}.web-phone-dates>i{font-size:7px;min-height:18px}.web-phone-slot{font-size:6px;margin-top:10px}.web-phone-button{font-size:7px;padding:6px 2px}.web-device-caption{max-width:calc(100% - 100px);margin-top:25px;font-size:10px;padding-right:0}.web-work-card>.web-client-logo{height:94px;padding:20px 26px}.web-work-card>.web-client-logo>img{max-width:175px}.web-work-copy{padding-top:8px}}
@media(prefers-reduced-motion:reduce){.web-desktop-device,.web-phone-illustration,.web-work-card:hover,.web-work-card:focus-within{transform:none}.web-work-card{transition:none}}
