:root{--navy:#071c2a;--ink:#0b2c56;--cyan:#0dc8eb;--text:#455163;--wrap:1480px}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;color:var(--ink);font:16px/1.45 Arial,Helvetica,sans-serif;background:#fff}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}a,button{touch-action:manipulation}a:focus-visible,button:focus-visible{outline:3px solid #0096bd;outline-offset:4px}h1,h2,h3,p{margin:0}h1,h2,h3{line-height:1.08;letter-spacing:-.028em}.wrap{width:calc(100% - 120px);max-width:var(--wrap);margin:auto}.sr-only,.skip{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.skip:focus{position:fixed;top:8px;left:8px;clip-path:none;width:auto;height:auto;padding:10px;background:#fff;z-index:50}header{height:76px;display:flex;background:var(--navy);position:sticky;top:0;z-index:20}.logo-panel{width:39%;background:linear-gradient(120deg,#f2fbff,#e5f3fa);border-radius:0 0 58px 0;display:flex;align-items:center;padding-left:max(60px,calc((100% - 1480px)/2));padding-right:50px}.logo-panel a{display:block;width:315px;max-width:100%}.logo-panel img{display:block;width:100%;height:auto;mix-blend-mode:multiply}.nav-panel{display:flex;align-items:center;justify-content:space-between;gap:20px;flex:1;padding:0 max(60px,calc((100% - 1480px)/2)) 0 40px}nav{display:flex;align-items:center;gap:29px;font-size:13px;color:white;white-space:nowrap}nav a,nav button{font:inherit;color:inherit;background:none;border:0;padding:9px 0;position:relative}nav a:hover,nav button:hover{color:var(--cyan)}nav .active{color:var(--cyan)}nav .active:after{content:'';height:3px;position:absolute;bottom:0;left:0;right:0;background:var(--cyan)}.chevron{margin-left:5px}.button{display:inline-flex;align-items:center;justify-content:center;gap:24px;border:1px solid #05bce1;border-radius:10px;padding:12px 25px;line-height:1.3;background:var(--cyan);font-size:14px;font-weight:700;color:#041a28;transition:background .2s,transform .2s}.button:hover{background:#55dcf3;transform:translateY(-2px)}.header-cta{padding:11px 15px;font-size:12px;gap:7px;border-radius:9px;white-space:nowrap}.header-cta svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.7}.menu-toggle{display:none}.hero{background:radial-gradient(ellipse at 80% 70%,#183748 0%,#0a202f 50%,#071c2a 90%);color:#fff;overflow:hidden}.hero-grid{display:grid;grid-template-columns:45% 55%;align-items:center;position:relative;min-height:360px;padding-top:24px;padding-bottom:28px}.hero-copy{position:relative;z-index:2;padding-right:18px}.eyebrow{font-size:10px;font-weight:700;letter-spacing:.22em;line-height:1.5;margin-bottom:12px}.hero .eyebrow{font-size:10px;color:#fff;letter-spacing:.2em}.hero h1{font-size:clamp(35px,3.2vw,54px);font-weight:750;line-height:1.04;letter-spacing:-.025em}.hero h1 span,.contact h2 span{color:var(--cyan)}.hero-description{margin:17px 0 16px;font-size:18px;line-height:1.3;max-width:600px}.actions{display:flex;gap:20px}.actions .button{min-width:170px}.outline{background:transparent;color:white;border-color:var(--cyan);min-width:135px!important}.outline:hover{background:#153547}.hero-device{position:absolute;right:-60px;bottom:0;width:calc(55% + 90px);height:100%;background-image:url('assets/reference-concept.png');background-size:167.535% 271.965%;background-position:100% 9.244%;background-repeat:no-repeat;mask-image:linear-gradient(90deg,transparent,#000 4%,#000 97%,transparent);pointer-events:none}.hero-grid:after{content:'';position:absolute;left:40%;bottom:0;width:15%;height:100%;background:linear-gradient(90deg,#0b202f,transparent);z-index:1;pointer-events:none}.work{padding:27px 0 17px}.work-grid{display:grid;grid-template-columns:.9fr 1.1fr 1.1fr 1.1fr;gap:25px}.work-intro{padding:5px 5px 0 0}.work-intro .eyebrow{font-size:10px;margin-bottom:9px}.work-intro h2{font-size:28px;line-height:1.1;margin-bottom:15px}.work-intro>p:not(.eyebrow){font-size:13px;color:var(--text);line-height:1.4;margin-bottom:18px}.work-intro .button{font-size:12px;padding:10px 18px;border-radius:5px}.project{background:#fff;border-radius:7px;overflow:hidden;box-shadow:0 0 15px #102b460b;display:flex;flex-direction:column}.project-image{display:block;width:100%;border:0;padding:0;background-image:url('assets/reference-concept.png');background-repeat:no-repeat;border-radius:7px;aspect-ratio:1.917/1;transition:filter .2s}.project-image:hover{filter:brightness(1.06)}.massage{background-size:451.892% 487.565%;background-position:31.874% 56.818%}.eagles{background-size:442.328% 487.565%;background-position:62.983% 56.818%}.lodge{background-size:440% 475.253%;background-position:94.659% 57.201%}.project-copy{padding:10px 16px 10px;display:flex;flex-direction:column;flex:1}.project h3{font-size:15px;letter-spacing:-.02em;margin-bottom:7px}.project p{font-size:12px;color:var(--text);line-height:1.35;margin-bottom:8px}.detail-link,.service-link{font-size:12px;font-weight:700;color:#006fa8;background:none;border:0;padding:0;text-align:left;align-self:start}.detail-link{margin-top:auto;display:flex;gap:8px}.detail-link:hover,.service-link:hover{text-decoration:underline}.services{background:linear-gradient(90deg,#e4f3fb,#eff9fd,#e4f3fb);padding:19px 0 18px}.services-grid{display:grid;grid-template-columns:repeat(3,1fr)}.services article{display:grid;grid-template-columns:57px 1fr;gap:24px;padding:0 28px;align-items:start;border-right:1px solid #accbdf}.services article:first-child{padding-left:25px}.services article:last-child{border:0;padding-right:0}.services svg{width:48px;height:48px;stroke:#009aca;stroke-width:3.5;stroke-linejoin:round;stroke-linecap:round;fill:none;margin-top:1px}.services h2{font-size:16px;letter-spacing:-.025em;margin-bottom:6px}.services p{font-size:12px;color:#354a5e;line-height:1.35}.service-link{font-size:10px;margin-top:7px}.contact{position:relative;overflow:hidden;color:white;min-height:135px;background:#092336}.footer-scene{position:absolute;inset:0;background-image:url('assets/reference-concept.png');background-size:100% 758.871%;background-position:0 100%;background-repeat:no-repeat}.contact:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent 0%,transparent 40%,#082336 49%,#082336 100%);pointer-events:none}.contact-grid{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:28px;padding-top:40px;padding-bottom:30px;padding-left:45%;min-height:135px}.contact h2{font-size:23px;white-space:normal}.contact p{font-size:16px;margin-top:6px}.contact .button{white-space:nowrap;min-width:150px;padding:12px 20px;flex-shrink:0}footer{background:#061925;color:#a2b6c4;font-size:10px;padding:13px 0 10px}.footer-inner{display:flex;justify-content:space-between;gap:20px}.footer-inner>div{display:flex;gap:22px}footer a:hover{color:var(--cyan)}.art-note{text-align:center;font-size:9px;color:#829aaa;margin:8px 20px 0}dialog{padding:35px;border:0;border-radius:10px;max-width:580px;width:calc(100% - 40px);color:var(--ink);box-shadow:0 15px 80px #0004}dialog::backdrop{background:#041b2acc}dialog h2{font-size:28px;margin:15px 0}dialog>p:not(.eyebrow){font-size:15px;color:var(--text)}dialog ul{padding-left:20px;margin:20px 0 25px;font-size:14px}dialog li{padding:5px 0}.dialog-close{position:absolute;right:12px;top:8px;font-size:30px;background:none;border:0;line-height:1;padding:5px 10px}
@media(min-width:1700px){.hero-grid{min-height:385px}.hero-device{right:calc((1480px - 100vw)/2);width:calc(55% + (100vw - 1480px)/2)}.hero h1{font-size:54px}.project h3{font-size:17px}.project p,.work-intro>p:not(.eyebrow){font-size:14px}.contact h2{font-size:27px}}
@media(max-width:1250px){.wrap{width:calc(100% - 70px)}.logo-panel{padding-left:35px;width:32%;padding-right:35px}.nav-panel{padding-left:25px;padding-right:35px;gap:15px}nav{gap:20px;font-size:12px}.logo-panel a{width:285px}.header-cta{font-size:11px;padding:10px}.hero-device{right:-35px}.hero .eyebrow{font-size:8px}.hero h1{font-size:39px}.hero-description{font-size:16px}.hero-grid{min-height:350px}.work-grid{gap:18px}.work-intro h2{font-size:23px}.work-intro>p:not(.eyebrow){font-size:12px}.project h3{font-size:14px}.project-copy{padding:10px 12px}.project p{font-size:11px}.services article{grid-template-columns:42px 1fr;gap:14px;padding:0 20px}.services article:first-child{padding-left:0}.services svg{width:40px;height:40px}.services h2{font-size:14px}.services p{font-size:11px}.contact-grid{padding-left:40%;gap:15px}.contact h2{font-size:20px}.contact p{font-size:14px}.contact .button{min-width:120px}}
@media(max-width:1000px){header{height:78px}.logo-panel{width:37%}.nav-panel{justify-content:flex-end}.menu-toggle{display:flex;align-items:center;gap:10px;background:none;color:white;border:1px solid #315266;border-radius:5px;padding:8px 12px;font-size:12px}.nav-panel nav{display:none;position:absolute;right:0;left:0;top:78px;background:var(--navy);padding:15px 35px;border-top:1px solid #274454;box-shadow:0 12px 20px #0003}nav.open{display:flex;flex-direction:column;align-items:stretch;gap:5px}nav a,nav button{text-align:left;padding:12px 0}.active:after{display:none}.hero h1{font-size:34px}.hero-description{font-size:15px}.hero-grid{grid-template-columns:48% 52%;min-height:350px}.hero-copy{padding-right:0}.hero-device{width:58%;mask-image:linear-gradient(90deg,transparent,#000 12%,#000);background-size:200% 271.965%;background-position:100% 9.244%}.hero-grid:after{display:none}.actions{gap:12px}.actions .button{font-size:12px;min-width:145px;padding:11px 16px}.actions .outline{min-width:110px!important}.work-grid{grid-template-columns:repeat(3,1fr);gap:20px}.work-intro{grid-column:1/-1;display:grid;grid-template-columns:1fr 1.4fr;gap:0 40px;align-items:start}.work-intro .eyebrow{grid-column:1}.work-intro h2{grid-column:1;grid-row:2/4;font-size:28px}.work-intro>p:not(.eyebrow){grid-column:2;grid-row:1/3;margin-bottom:12px;font-size:13px}.work-intro .button{grid-column:2;justify-self:start;margin-bottom:7px}.project h3{font-size:15px}.project p{font-size:12px}.services article{grid-template-columns:1fr;gap:12px}.services svg{width:36px;height:36px}.contact-grid{padding-left:30%}.contact h2{font-size:20px}.footer-inner{flex-wrap:wrap}.footer-inner>div{flex-wrap:wrap;gap:15px}}
@media(max-width:700px){.wrap{width:calc(100% - 40px)}html{scroll-padding-top:74px}header{height:74px}.logo-panel{width:60%;padding-left:20px;padding-right:28px;border-radius:0 0 30px 0}.logo-panel a{width:260px}.nav-panel{padding:0 20px;gap:8px}.header-cta{display:none}.nav-panel nav{top:74px;padding:15px 20px}.hero-grid{display:flex;flex-direction:column;align-items:stretch;padding:30px 0 0;min-height:0}.hero-copy{padding:0}.hero .eyebrow{font-size:8px;max-width:340px;line-height:1.7}.hero h1{font-size:clamp(32px,7.5vw,45px);line-height:1.08}.hero-description{max-width:500px;margin:16px 0 20px;font-size:16px;line-height:1.4}.actions .button{font-size:13px}.hero-device{position:relative;right:auto;bottom:auto;width:calc(100% + 40px);margin:20px -20px 0;height:auto;aspect-ratio:998/346;mask-image:none;background-size:167.535% 271.965%}.work{padding:25px 0}.work-grid{grid-template-columns:1fr;gap:22px}.work-intro{display:block}.work-intro h2{font-size:29px;margin-bottom:12px}.work-intro>p:not(.eyebrow){font-size:14px;max-width:500px}.work-intro .button{font-size:13px}.project{display:grid;grid-template-columns:1fr 1fr;gap:0;align-items:stretch;border:1px solid #edf1f4}.project-image{aspect-ratio:1.3/1;background-size:451.892% 487.565%}.eagles{background-size:442.328% 487.565%}.lodge{background-size:440% 475.253%}.project-copy{padding:15px}.project h3{font-size:17px;line-height:1.15}.project p{font-size:12px;line-height:1.4}.services{padding:25px 0}.services-grid{grid-template-columns:1fr;gap:23px}.services article,.services article:first-child{grid-template-columns:45px 1fr;gap:19px;border-right:0;border-bottom:1px solid #bad4e4;padding:0 0 20px}.services article:last-child{padding-bottom:0}.services svg{width:42px;height:42px}.services h2{font-size:18px}.services p{font-size:13px}.service-link{font-size:11px}.contact{min-height:260px}.footer-scene{background-size:220% 758.871%;background-position:0 100%}.contact:after{background:linear-gradient(180deg,transparent 0%,#08233600 12%,#082336e8 45%,#082336 85%)}.contact-grid{padding:80px 0 28px;min-height:260px;flex-direction:column;align-items:flex-start;gap:18px}.contact h2{font-size:27px;max-width:440px;line-height:1.15}.contact p{font-size:15px}.contact .button{font-size:14px;padding:12px 24px;align-self:flex-end}.footer-inner{flex-direction:column;font-size:10px;gap:9px}.footer-inner>div{gap:8px 16px}.art-note{text-align:left;margin-left:20px;margin-top:13px;font-size:8px}dialog{padding:30px 24px}}
@media(max-width:440px){.logo-panel{width:68%;padding-right:25px}.nav-panel{padding-left:5px;padding-right:15px}.menu-toggle{padding:7px 9px;font-size:11px;gap:7px}.hero h1{font-size:32px}.hero-description{font-size:15px}.project{display:flex}.project-image{aspect-ratio:1.917/1}.project-copy{padding:13px 17px 17px}.project h3{font-size:18px}.project p{font-size:13px;margin-bottom:10px}.detail-link{font-size:13px}.contact h2{font-size:25px}.footer-scene{background-size:300% 758.871%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
@media(min-width:701px){.hero-device{height:auto;aspect-ratio:998/346;bottom:0}}
@media(min-width:1100px){.hero-device{width:calc(65% + 90px)}.work-intro h2{font-size:26px}}
@media(min-width:1100px){.hero-device{mask-image:linear-gradient(90deg,transparent 0%,transparent 8%,#000 16%,#000 97%,transparent)}.work-intro h2{font-size:24px}}

/* Website Development internal page */
.inner-hero{background:radial-gradient(ellipse at 82% 55%,#183748 0%,#0a202f 48%,#071c2a 88%);color:#fff;overflow:hidden}.inner-hero-grid{min-height:430px;display:grid;grid-template-columns:52% 48%;align-items:center;position:relative}.inner-hero h1{font-size:clamp(38px,4vw,62px);max-width:780px}.inner-hero h1 span,.contact h2 span{color:var(--cyan)}.inner-hero p:not(.eyebrow){font-size:18px;line-height:1.55;color:#d5e3eb;max-width:690px;margin:22px 0 26px}.inner-hero .outline{background:transparent;color:#fff;border-color:#6d8795}.inner-hero .outline:hover{background:#ffffff12}.inner-hero-art{position:absolute;right:-3%;top:0;width:48%;height:100%;background:url('assets/reference-concept.png') no-repeat 100% 8%;background-size:205% auto;mask-image:linear-gradient(90deg,transparent,#000 20%,#000 95%,transparent)}
.dev-intro{padding:70px 0 55px}.intro-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:80px}.intro-grid h2,.section-heading h2{font-size:clamp(30px,3vw,46px)}.intro-grid>div{color:var(--text);font-size:17px;line-height:1.7}.intro-grid>div p+p{margin-top:18px}.dev-paths{background:#f2f8fb;padding:55px 0 65px}.path-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px}.path-grid article{background:#fff;border-radius:10px;padding:38px;box-shadow:0 8px 35px #0b2c560d;border-top:4px solid var(--cyan)}.path-number{font-size:12px;letter-spacing:.18em;color:#008fb8;font-weight:700}.path-grid h2{font-size:27px;margin:10px 0 14px}.path-grid p{color:var(--text);line-height:1.6}.path-grid ul{color:#354a5e;line-height:1.7;padding-left:20px;margin:20px 0 22px}.dev-services{padding:70px 0}.section-heading{max-width:760px;margin-bottom:38px}.section-heading>p:not(.eyebrow){color:var(--text);font-size:17px;line-height:1.6;margin-top:15px}.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.feature-grid article{border:1px solid #dbe8ef;border-radius:9px;padding:27px;background:#fff}.feature-grid h3{font-size:19px;margin-bottom:10px}.feature-grid p,.mini-work-grid p{color:var(--text);font-size:14px;line-height:1.55}.process{padding:65px 0;background:var(--navy);color:#fff}.process .eyebrow{color:var(--cyan)}.process-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:25px}.process-grid article{border-top:1px solid #3c5969;padding-top:20px}.process-grid b{display:inline-grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--cyan);color:var(--navy);margin-bottom:18px}.process-grid h3{font-size:20px;margin-bottom:8px}.process-grid p{color:#b9ccd6;font-size:14px;line-height:1.55}.dev-work{padding:65px 0 75px}.mini-work-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-bottom:28px}.mini-work-grid article{background:#edf7fb;border-radius:9px;padding:25px}.mini-work-grid h3{font-size:18px;margin-bottom:9px}
@media(max-width:1000px){.inner-hero-grid{grid-template-columns:60% 40%;min-height:390px}.inner-hero-art{width:45%}.intro-grid{gap:40px}.feature-grid{grid-template-columns:repeat(2,1fr)}.process-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.inner-hero-grid{display:block;padding:42px 0 180px;min-height:0}.inner-hero h1{font-size:38px}.inner-hero p:not(.eyebrow){font-size:16px}.inner-hero-art{top:auto;bottom:0;right:-20px;width:calc(100% + 40px);height:170px;background-size:180% auto;mask-image:linear-gradient(180deg,transparent,#000 35%)}.dev-intro,.dev-services,.process,.dev-work{padding:45px 0}.intro-grid,.path-grid,.feature-grid,.process-grid,.mini-work-grid{grid-template-columns:1fr}.intro-grid{gap:22px}.dev-paths{padding:40px 0}.path-grid article{padding:28px}.section-heading{margin-bottom:28px}}

/* Our Work internal page */
.work-hero{background:radial-gradient(ellipse at 80% 45%,#17394b 0%,#0b2332 48%,#071c2a 88%);color:#fff;padding:70px 0 66px}.work-hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:70px;align-items:center}.work-hero h1{font-size:clamp(42px,4.5vw,68px);max-width:760px}.work-hero h1 span{color:var(--cyan)}.work-hero p:not(.eyebrow){font-size:18px;line-height:1.6;color:#d5e3eb;max-width:700px;margin-top:22px}.work-hero-note{border-left:3px solid var(--cyan);padding:22px 0 22px 28px;color:#c6d9e3;font-size:16px;line-height:1.65}.portfolio{padding:70px 0 78px}.portfolio-heading{display:grid;grid-template-columns:.8fr 1.2fr;gap:70px;align-items:end;margin-bottom:45px}.portfolio-heading h2{font-size:clamp(30px,3vw,46px)}.portfolio-heading>div:last-child{color:var(--text);font-size:17px;line-height:1.65}.case-grid{display:grid;gap:34px}.case-study{display:grid;grid-template-columns:1.05fr .95fr;min-height:355px;border:1px solid #dce8ee;border-radius:12px;overflow:hidden;background:#fff;box-shadow:0 10px 38px #0b2c560d}.case-study:nth-child(even){grid-template-columns:.95fr 1.05fr}.case-study:nth-child(even) .case-visual{order:2}.case-visual{background-image:url('assets/reference-concept.png');background-repeat:no-repeat;min-height:355px;background-color:#edf5f8}.case-visual.massage{background-size:280% auto;background-position:24% 56%}.case-visual.eagles{background-size:280% auto;background-position:56% 56%}.case-visual.lodge{background-size:280% auto;background-position:88% 56%}.case-copy{padding:44px 46px;display:flex;flex-direction:column;justify-content:center}.case-copy .eyebrow{margin-bottom:10px}.case-copy h2{font-size:30px;margin-bottom:16px}.case-copy>p{color:var(--text);font-size:16px;line-height:1.65}.case-tags{display:flex;flex-wrap:wrap;gap:8px;margin:22px 0}.case-tags span{background:#eaf7fb;color:#075a76;border-radius:999px;padding:7px 11px;font-size:11px;font-weight:700}.case-points{padding-left:19px;margin:0 0 24px;color:#354a5e;line-height:1.65}.case-copy .detail-link{align-self:flex-start}.work-principles{background:#f2f8fb;padding:65px 0}.principles-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:70px}.principles-grid h2{font-size:clamp(30px,3vw,44px)}.principle-cards{display:grid;grid-template-columns:1fr 1fr;gap:18px}.principle-cards article{background:#fff;border-radius:9px;padding:24px}.principle-cards h3{font-size:18px;margin-bottom:8px}.principle-cards p{color:var(--text);font-size:14px;line-height:1.55}
@media(max-width:1000px){.work-hero-grid,.portfolio-heading,.principles-grid{grid-template-columns:1fr;gap:28px}.case-study,.case-study:nth-child(even){grid-template-columns:1fr 1fr}.case-study:nth-child(even) .case-visual{order:0}.case-copy{padding:34px}.case-visual{min-height:320px}}
@media(max-width:700px){.work-hero{padding:45px 0}.work-hero h1{font-size:40px}.work-hero p:not(.eyebrow){font-size:16px}.work-hero-note{font-size:14px}.portfolio{padding:45px 0}.portfolio-heading{margin-bottom:28px}.case-study,.case-study:nth-child(even){display:flex;flex-direction:column;min-height:0}.case-study:nth-child(even) .case-visual{order:0}.case-visual{min-height:220px}.case-visual.massage,.case-visual.eagles,.case-visual.lodge{background-size:300% auto}.case-copy{padding:28px}.case-copy h2{font-size:25px}.principles-grid{gap:25px}.principle-cards{grid-template-columns:1fr}.work-principles{padding:45px 0}}

/* v6: About uses only existing v3 layout components */
.work-hero-note strong{font-size:1.15rem;line-height:1.35}

/* v7 Contact */
.contact-section{padding:72px 0 88px;background:#f7f9fb}
.contact-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:64px;align-items:start}
.contact-intro h2{font-size:clamp(30px,3.2vw,44px);line-height:1.08;margin:8px 0 18px}
.contact-intro>p{font-size:17px;line-height:1.7}
.contact-points{margin-top:34px;display:grid;gap:18px}
.contact-points div{padding-top:18px;border-top:1px solid rgba(13,41,68,.12)}
.contact-points strong,.contact-points span{display:block}.contact-points strong{font-size:17px;margin-bottom:4px}.contact-points span{color:#5c6b78;line-height:1.5}
.contact-form{background:#fff;border:1px solid rgba(13,41,68,.09);border-radius:22px;padding:34px;box-shadow:0 16px 42px rgba(13,41,68,.07)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.field{margin-bottom:19px}.field label{display:block;font-weight:700;margin-bottom:7px;font-size:14px}.field label span,.consent strong{color:#168f87}
.field input,.field select,.field textarea{box-sizing:border-box;width:100%;font:inherit;color:#0d2944;background:#fff;border:1px solid #cbd5dc;border-radius:9px;padding:12px 13px;outline:none;transition:border-color .15s,box-shadow .15s}
.field textarea{resize:vertical;min-height:150px}.field input:focus,.field select:focus,.field textarea:focus{border-color:#168f87;box-shadow:0 0 0 3px rgba(22,143,135,.12)}
.consent{display:flex;gap:10px;align-items:flex-start;font-size:13px;line-height:1.5;color:#526271;margin:2px 0 22px}.consent input{margin-top:3px;flex:0 0 auto}
.form-submit{border:0;cursor:pointer}.form-submit[disabled]{opacity:.65;cursor:wait}.form-status{margin:14px 0 0;font-weight:600;min-height:1.4em}
.form-status.success{color:#08776f}.form-status.error{color:#a43131}.form-hp{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important}
.work-hero-note a{color:inherit;text-decoration:none}.work-hero-note a:hover{text-decoration:underline}
@media(max-width:800px){.contact-section{padding:52px 0 64px}.contact-grid,.form-row{grid-template-columns:1fr}.contact-grid{gap:34px}.contact-form{padding:24px}}


/* v8 — Contact lower-section alignment fix only */
.contact-section .contact-grid{
  grid-template-columns:minmax(0, .82fr) minmax(460px, 1.18fr);
  gap:72px;
  align-items:start;
}

.contact-section .contact-intro{
  max-width:520px;
}

.contact-section .contact-form{
  width:100%;
  max-width:620px;
  justify-self:end;
}

@media (max-width:1000px){
  .contact-section .contact-grid{
    grid-template-columns:minmax(0, .9fr) minmax(400px, 1.1fr);
    gap:42px;
  }
}

@media (max-width:800px){
  .contact-section .contact-grid{
    grid-template-columns:1fr;
    gap:34px;
  }
  .contact-section .contact-intro,
  .contact-section .contact-form{
    max-width:none;
    width:100%;
    justify-self:stretch;
  }
}


/* v9 — definitive Contact layout fix.
   Explicitly size the contact wrapper so inherited .wrap rules cannot collapse it. */
.contact-section > .contact-grid{
  box-sizing:border-box;
  width:min(1340px, calc(100% - 64px)) !important;
  max-width:1340px !important;
  margin-left:auto !important;
  margin-right:auto !important;
  padding-left:0 !important;
  padding-right:0 !important;
  display:grid !important;
  grid-template-columns:minmax(360px, 0.85fr) minmax(520px, 1.15fr) !important;
  column-gap:80px !important;
  align-items:start !important;
}

.contact-section > .contact-grid > .contact-intro{
  width:auto !important;
  max-width:500px !important;
  min-width:0 !important;
  justify-self:start !important;
}

.contact-section > .contact-grid > .contact-form{
  box-sizing:border-box;
  width:100% !important;
  max-width:650px !important;
  min-width:0 !important;
  justify-self:end !important;
}

@media(max-width:1050px){
  .contact-section > .contact-grid{
    width:min(940px, calc(100% - 48px)) !important;
    grid-template-columns:minmax(300px,.8fr) minmax(440px,1.2fr) !important;
    column-gap:44px !important;
  }
}

@media(max-width:800px){
  .contact-section > .contact-grid{
    width:calc(100% - 36px) !important;
    grid-template-columns:1fr !important;
    row-gap:34px !important;
  }
  .contact-section > .contact-grid > .contact-intro,
  .contact-section > .contact-grid > .contact-form{
    width:100% !important;
    max-width:none !important;
    justify-self:stretch !important;
  }
}


/* v10 — branded in-page form confirmation */
.contact-success{
  background:#fff;
  border:1px solid rgba(13,41,68,.09);
  border-radius:22px;
  padding:46px 42px;
  box-shadow:0 16px 42px rgba(13,41,68,.07);
  align-self:start;
}
.contact-success h2{
  font-size:clamp(30px,3vw,44px);
  line-height:1.08;
  margin:8px 0 16px;
}
.contact-success p:not(.eyebrow){
  font-size:17px;
  line-height:1.7;
  margin-bottom:28px;
}
.contact-success[hidden]{display:none!important}


/* v12 — Website Audits */
.audit-intro,.audit-output,.audit-not-rebuild{padding:78px 0}
.audit-intro{background:#fff}
.audit-intro-grid,.audit-output-grid,.audit-not-rebuild-grid{
  display:grid;grid-template-columns:.85fr 1.15fr;gap:80px;align-items:start
}
.audit-intro h2,.audit-output h2,.audit-not-rebuild h2,.audit-checks h2,.audit-cta h2{
  font-size:clamp(30px,3.2vw,46px);line-height:1.08;margin:8px 0 18px
}
.audit-intro-grid>div:last-child p,.audit-output-grid>div:first-child>p:last-child,
.audit-not-rebuild-grid>div:last-child p{font-size:17px;line-height:1.72;margin-top:0}
.audit-checks{padding:78px 0 88px;background:#f7f9fb}
.audit-card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:34px}
.audit-card{background:#fff;border:1px solid rgba(13,41,68,.09);border-radius:18px;padding:28px;box-shadow:0 10px 28px rgba(13,41,68,.045)}
.audit-card>span{display:block;color:#12b9d8;font-weight:800;font-size:13px;letter-spacing:.12em;margin-bottom:22px}
.audit-card h3{font-size:21px;margin:0 0 10px}.audit-card p{color:#526271;line-height:1.62;margin:0}
.audit-output{background:#fff}
.audit-priority{display:grid;gap:12px}
.audit-priority div{border-left:4px solid #12b9d8;background:#f7f9fb;padding:20px 22px}
.audit-priority strong,.audit-priority span{display:block}.audit-priority strong{font-size:18px;margin-bottom:5px}.audit-priority span{color:#526271;line-height:1.5}
.audit-not-rebuild{background:#eaf5f8}
.audit-cta{padding:70px 0;background:#082333;color:#fff}
.audit-cta-inner{display:flex;align-items:center;justify-content:space-between;gap:50px}
.audit-cta h2{color:#fff}.audit-cta p:not(.eyebrow){max-width:720px;font-size:17px;line-height:1.65;margin-bottom:0}
.audit-cta .button{white-space:nowrap}
@media(max-width:900px){
  .audit-card-grid{grid-template-columns:repeat(2,1fr)}
  .audit-intro-grid,.audit-output-grid,.audit-not-rebuild-grid{gap:42px}
}
@media(max-width:700px){
  .audit-intro,.audit-output,.audit-not-rebuild,.audit-checks{padding:54px 0}
  .audit-intro-grid,.audit-output-grid,.audit-not-rebuild-grid,.audit-card-grid{grid-template-columns:1fr}
  .audit-intro-grid,.audit-output-grid,.audit-not-rebuild-grid{gap:20px}
  .audit-cta-inner{display:block}.audit-cta .button{display:inline-block;margin-top:28px}
}


/* v13 — refined site-wide eyebrow typography */
.eyebrow{
  font-family:inherit !important;
  font-size:13px !important;
  font-weight:800 !important;
  letter-spacing:.11em !important;
  line-height:1.35 !important;
}
@media(max-width:700px){
  .eyebrow{font-size:12px !important;letter-spacing:.09em !important;}
}


/* v14 — services navigation */
.nav-dropdown{position:relative;display:flex;align-items:center}
.nav-dropdown-toggle{
  appearance:none;background:transparent;border:0;color:inherit;font:inherit;
  font-weight:inherit;cursor:pointer;padding:inherit;margin:0;
}
.nav-dropdown-toggle span{font-size:.75em;margin-left:4px}
.nav-dropdown-menu{
  display:none;position:absolute;top:calc(100% + 18px);left:50%;
  transform:translateX(-50%);min-width:230px;background:#082333;
  border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:9px;
  box-shadow:0 18px 42px rgba(0,0,0,.22);z-index:100;
}
.nav-dropdown.open .nav-dropdown-menu{display:block}
.nav-dropdown-menu a,.nav-dropdown-menu .nav-coming-soon{
  display:block;padding:11px 12px;border-radius:8px;white-space:nowrap;
  text-decoration:none;color:#fff;font-size:14px;
}
.nav-dropdown-menu a:hover,.nav-dropdown-menu a:focus,.nav-dropdown-menu a.active{
  background:rgba(18,185,216,.14);color:#18c3df
}
.nav-coming-soon{opacity:.55;cursor:default}
.nav-coming-soon small{font-size:10px;text-transform:uppercase;letter-spacing:.06em;margin-left:7px}
.nav-dropdown-toggle.active{color:#18c3df}
.audit-home-link{padding:62px 0;background:#eaf5f8}
.audit-home-link-inner{display:flex;align-items:center;justify-content:space-between;gap:48px}
.audit-home-link h2{font-size:clamp(28px,3vw,42px);margin:6px 0 10px}
.audit-home-link p:not(.eyebrow){margin:0;max-width:720px;line-height:1.6}
.audit-home-link .button{white-space:nowrap}
@media(max-width:800px){
  .nav-dropdown{display:block}
  .nav-dropdown-toggle{width:100%;text-align:left}
  .nav-dropdown-menu{
    position:static;transform:none;box-shadow:none;border:0;
    background:rgba(255,255,255,.04);margin:7px 0 4px;min-width:0;
  }
  .audit-home-link-inner{display:block}
  .audit-home-link .button{display:inline-block;margin-top:24px}
}


/* v17 — actual client screenshots supplied by Richard */
.hero-device{
  background-image:url('assets/hero-real-projects.jpg') !important;
  background-size:cover !important;
  background-position:center !important;
  mask-image:linear-gradient(90deg,transparent 0%,#000 10%,#000 98%,transparent) !important;
}
.project-image,
.case-visual{
  background-repeat:no-repeat !important;
  background-size:cover !important;
  background-position:center !important;
}
.project-image.massage,.case-visual.massage{background-image:url('assets/portfolio-lvm.jpg') !important}
.project-image.eagles,.case-visual.eagles{background-image:url('assets/portfolio-eagles.jpg') !important}
.project-image.lodge,.case-visual.lodge{background-image:url('assets/portfolio-capilano.jpg') !important}

@media(max-width:700px){
  .hero-device{
    background-size:cover !important;
    background-position:center !important;
    aspect-ratio:1800/760 !important;
  }
  .project-image.massage,.case-visual.massage,
  .project-image.eagles,.case-visual.eagles,
  .project-image.lodge,.case-visual.lodge{
    background-size:cover !important;
    background-position:center !important;
  }
}


/* v18 — quieter homepage hero */
.hero-device{
  background-image:url('assets/hero-lvm-simple.jpg') !important;
  background-size:contain !important;
  background-repeat:no-repeat !important;
  background-position:center !important;
  mask-image:none !important;
  -webkit-mask-image:none !important;
}
@media(max-width:700px){
  .hero-device{
    background-size:contain !important;
    background-position:center !important;
  }
}


/* v19 — genuine Capilano mobile screenshot + Website Development hero */
.project-image.lodge,.case-visual.lodge{
  background-image:url('assets/portfolio-capilano.jpg') !important;
}

/* The Website Development page previously retained its original concept artwork. */
.website-development-page .hero-device,
.website-development-page .development-visual,
.website-development-page .page-visual,
.website-development-page .device-showcase{
  background-image:url('assets/hero-development-real.jpg') !important;
  background-size:contain !important;
  background-repeat:no-repeat !important;
  background-position:center !important;
  mask-image:none !important;
  -webkit-mask-image:none !important;
}

/* If the page uses the generic .page-hero visual column, put the genuine work there too. */
.website-development-page .page-hero .hero-visual{
  background-image:url('assets/hero-development-real.jpg') !important;
  background-size:contain !important;
  background-repeat:no-repeat !important;
  background-position:center !important;
}


/* v20 — fix the ACTUAL Website Development hero element (.inner-hero-art) */
.website-development-page .inner-hero-art{
  background-image:url('assets/hero-development-real.jpg') !important;
  background-repeat:no-repeat !important;
  background-size:contain !important;
  background-position:center !important;
  mask-image:linear-gradient(90deg,transparent 0%,#000 12%,#000 96%,transparent) !important;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 12%,#000 96%,transparent) !important;
}
@media(max-width:700px){
  .website-development-page .inner-hero-grid{
    padding-bottom:230px !important;
  }
  .website-development-page .inner-hero-art{
    right:-10px !important;
    bottom:10px !important;
    width:calc(100% + 20px) !important;
    height:220px !important;
    background-size:contain !important;
    background-position:center bottom !important;
    mask-image:linear-gradient(180deg,transparent 0%,#000 20%,#000 100%) !important;
    -webkit-mask-image:linear-gradient(180deg,transparent 0%,#000 20%,#000 100%) !important;
  }
}


/* v21 — consistent real responsive previews */
.project-image.massage,.case-visual.massage{
  background-image:url('assets/portfolio-lvm-v21.jpg') !important;
}
.project-image.eagles,.case-visual.eagles{
  background-image:url('assets/portfolio-eagles-v21.jpg') !important;
}
.project-image.lodge,.case-visual.lodge{
  background-image:url('assets/portfolio-capilano-v21.jpg') !important;
}

/* Website Development: desktop and mobile must be the SAME client site. */
.website-development-page .inner-hero-art{
  background-image:url('assets/hero-development-v21.jpg') !important;
}


/* v22 — Website Support */
.support-hero-art{
  min-height:420px;
  background:
    radial-gradient(circle at 72% 32%,rgba(19,195,229,.22),transparent 24%),
    url('assets/portfolio-lvm-v21.jpg') center/contain no-repeat;
  mask-image:linear-gradient(90deg,transparent 0%,#000 16%,#000 96%,transparent);
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 16%,#000 96%,transparent);
}
.narrow-copy{max-width:900px}
.support-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:22px;
  margin-top:34px;
}
.support-card{
  background:#fff;
  border:1px solid rgba(8,38,54,.1);
  border-radius:16px;
  padding:28px;
  box-shadow:0 12px 34px rgba(8,38,54,.06);
}
.support-card h3{margin-top:0}
.support-card p{margin-bottom:0}
.support-split{
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(320px,.9fr);
  gap:70px;
  align-items:start;
}
.support-panel{
  background:#eaf5f8;
  border-radius:18px;
  padding:32px;
}
.support-panel h3{margin-top:0}
.support-panel li{margin:.65em 0}
@media(max-width:900px){
  .support-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .support-split{grid-template-columns:1fr;gap:30px}
}
@media(max-width:700px){
  .support-hero-art{min-height:240px}
  .support-grid{grid-template-columns:1fr}
}


/* v23 — polish Website Support lower sections */
.website-support-page .support-intro{
  padding-top:72px !important;
  padding-bottom:64px !important;
}
.website-support-page #support-options{
  padding-top:72px !important;
  padding-bottom:82px !important;
}
.website-support-page #support-options .support-grid{
  margin-top:38px !important;
  row-gap:24px !important;
}

/* Give Flexible Support a deliberate section of its own */
.website-support-page #support-options + .content-section{
  background:#f3f8fa !important;
  padding-top:82px !important;
  padding-bottom:82px !important;
  margin:0 !important;
}
.website-support-page .support-split{
  align-items:center !important;
}
.website-support-page .support-split > div:first-child{
  max-width:680px;
}
.website-support-page .support-panel{
  padding:38px 40px !important;
  box-shadow:0 14px 34px rgba(8,38,54,.06);
}
.website-support-page .support-panel ul{
  margin-bottom:0;
  padding-left:22px;
}

/* Strong finishing CTA rather than another white content block */
.website-support-page .cta-band{
  background:#082334 !important;
  color:#fff !important;
  padding:66px 0 !important;
  margin:0 !important;
}
.website-support-page .cta-band .cta-band-inner{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) auto !important;
  gap:60px !important;
  align-items:center !important;
}
.website-support-page .cta-band h2{
  color:#fff !important;
  margin:.18em 0 .3em !important;
}
.website-support-page .cta-band p{
  color:rgba(255,255,255,.86) !important;
  max-width:800px;
  margin-bottom:0;
}
.website-support-page .cta-band .eyebrow{
  color:#16c5e8 !important;
}
.website-support-page .cta-band .button{
  white-space:nowrap;
  min-width:210px;
  text-align:center;
}

@media(max-width:800px){
  .website-support-page .support-intro,
  .website-support-page #support-options,
  .website-support-page #support-options + .content-section{
    padding-top:54px !important;
    padding-bottom:54px !important;
  }
  .website-support-page .cta-band{
    padding:52px 0 !important;
  }
  .website-support-page .cta-band .cta-band-inner{
    grid-template-columns:1fr !important;
    gap:28px !important;
  }
  .website-support-page .cta-band .button{
    width:max-content;
  }
}


/* v24 — dropdown active-state cleanup */
.nav-dropdown-menu a.active{
  background:rgba(19,195,229,.12) !important;
  color:#18c5e8 !important;
  border-bottom:2px solid #18c5e8 !important;
}
.nav-dropdown-menu a:not(.active){
  background:transparent !important;
  color:inherit;
  border-bottom:2px solid transparent !important;
}


/* v26 — Pricing page */
.pricing-hero-note{align-self:center;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);border-radius:18px;padding:30px;max-width:460px;color:#fff}
.pricing-hero-note .pricing-kicker{display:block;color:#18c5e8;font-size:12px;font-weight:800;letter-spacing:.12em;margin-bottom:12px}
.pricing-hero-note strong{display:block;font-size:25px;line-height:1.18;margin-bottom:12px}
.pricing-hero-note p{margin:0;color:rgba(255,255,255,.78);line-height:1.65}
.pricing-intro{padding:76px 0 54px}
.pricing-intro .content-narrow,.pricing-extras .content-narrow{max-width:900px;margin:0 auto}
.pricing-section{padding:20px 0 86px}
.pricing-grid{max-width:1450px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.price-card{border:1px solid #dbe6eb;border-radius:18px;padding:32px;background:#fff;display:flex;flex-direction:column;box-shadow:0 8px 28px rgba(8,35,52,.05)}
.price-card.featured{border-top:5px solid #18c5e8;padding-top:28px}
.price-card h3{font-size:24px;line-height:1.2;margin:7px 0 18px;color:#082334}
.price-card .price{font-size:15px;color:#55717e;margin-bottom:20px}
.price-card .price strong{display:block;font-size:36px;line-height:1.1;color:#082334;margin-top:3px}
.price-card ul{padding-left:20px;margin:18px 0 22px;line-height:1.75}
.price-card .price-note{font-size:14px;background:#f3f8fa;padding:14px 16px;border-radius:10px}
.price-card .text-link{font-weight:800;color:#008eb3;text-decoration:none;margin-top:auto;padding-top:14px}
.support-pricing{background:#f3f8fa;padding:78px max(5vw,40px);display:grid;grid-template-columns:1.15fr .85fr;gap:70px;align-items:center}
.support-price-copy{max-width:650px;margin-left:auto}
.support-rate-card{max-width:560px;background:#fff;border-radius:18px;padding:30px;box-shadow:0 12px 32px rgba(8,35,52,.08)}
.support-rate-card>div{display:flex;justify-content:space-between;gap:24px;padding:17px 0;border-bottom:1px solid #e4ecef}
.support-rate-card>div:first-child{padding-top:0}
.support-rate-card strong{color:#082334;white-space:nowrap}
.support-rate-card .btn{margin-top:24px}
.pricing-extras{padding:82px 0}
.pricing-details{display:grid;grid-template-columns:1fr 1fr;gap:26px 50px;margin-top:36px}
.pricing-details strong{color:#082334;font-size:18px}
.pricing-details p{margin:7px 0 0;line-height:1.6}
.pricing-cta{background:#082334;color:#fff;padding:62px max(6vw,60px);display:flex;justify-content:center;align-items:center;gap:90px}
.pricing-cta>div{max-width:700px}
.pricing-cta h2{color:#fff;margin:5px 0 8px}
.pricing-cta p:not(.eyebrow){color:rgba(255,255,255,.78);margin:0}
.pricing-cta .eyebrow{color:#18c5e8}
.pricing-cta .btn{white-space:nowrap}
@media(max-width:900px){
  .pricing-grid{grid-template-columns:1fr}
  .support-pricing{grid-template-columns:1fr;gap:30px;padding:60px 24px}
  .support-price-copy{margin:0}
  .pricing-details{grid-template-columns:1fr}
  .pricing-cta{display:block;padding:54px 24px}
  .pricing-cta .btn{margin-top:24px}
  .pricing-hero-note{margin-top:28px;max-width:none}
}


/* v27 — Website Care */
.care-hero-panel{align-self:center;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);border-radius:18px;padding:32px;max-width:470px;color:#fff}
.care-hero-panel .eyebrow{color:#18c5e8}
.care-hero-panel strong{display:block;font-size:26px;line-height:1.2;margin:8px 0 13px}
.care-hero-panel p:last-child{color:rgba(255,255,255,.8);line-height:1.65;margin-bottom:0}
.care-intro{padding:76px 0 50px}
.care-intro .content-narrow,.care-boundaries .content-narrow{max-width:920px;margin:0 auto}
.care-plans-section{padding:20px 0 86px}
.care-plan-grid{max-width:1120px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:26px}
.care-plan-card{position:relative;border:1px solid #dbe6eb;border-radius:20px;padding:36px;background:#fff;box-shadow:0 10px 30px rgba(8,35,52,.06);display:flex;flex-direction:column}
.care-plan-card.featured{border-top:5px solid #18c5e8;padding-top:32px}
.care-badge{position:absolute;right:24px;top:20px;background:#e7f8fc;color:#007e9d;border-radius:999px;padding:7px 11px;font-size:11px;font-weight:800;letter-spacing:.07em}
.care-plan-card h3{font-size:27px;margin:8px 0 12px;color:#082334}
.care-price{display:flex;align-items:baseline;gap:5px;margin:4px 0 20px;color:#55717e}
.care-price strong{font-size:42px;color:#082334}
.care-plan-card ul{padding-left:20px;line-height:1.75;margin:20px 0 28px}
.care-plan-card .btn{margin-top:auto;align-self:flex-start}
.care-example{background:#f3f8fa;padding:76px max(6vw,60px);display:grid;grid-template-columns:1.15fr .85fr;gap:70px;align-items:center}
.care-example-copy{max-width:680px;margin-left:auto}
.care-example-panel{max-width:520px;background:#fff;border-radius:18px;padding:30px;box-shadow:0 10px 30px rgba(8,35,52,.07)}
.care-example-panel strong{font-size:20px;color:#082334}
.care-example-panel p{line-height:1.65}
.care-example-panel p strong{font-size:inherit}
.care-boundaries{padding:82px 0}
.care-detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px 50px;margin-top:34px}
.care-detail-grid strong{font-size:18px;color:#082334}
.care-detail-grid p{line-height:1.6;margin:7px 0 0}
.new-site-care{background:#e8f7fb;padding:66px max(7vw,70px);display:flex;justify-content:center;align-items:center;gap:90px}
.new-site-care>div{max-width:760px}
.new-site-care .btn{white-space:nowrap}
.care-cta{background:#082334;color:#fff;padding:62px max(6vw,60px);display:flex;justify-content:center;align-items:center;gap:90px}
.care-cta>div{max-width:700px}
.care-cta h2{color:#fff;margin:5px 0 8px}
.care-cta p:not(.eyebrow){color:rgba(255,255,255,.78);margin:0}
.care-cta .eyebrow{color:#18c5e8}
.care-cta .btn{white-space:nowrap}
@media(max-width:900px){
  .care-plan-grid{grid-template-columns:1fr}
  .care-example{grid-template-columns:1fr;gap:28px;padding:58px 24px}
  .care-example-copy{margin:0}
  .care-detail-grid{grid-template-columns:1fr}
  .new-site-care,.care-cta{display:block;padding:54px 24px}
  .new-site-care .btn,.care-cta .btn{margin-top:24px}
  .care-hero-panel{margin-top:28px;max-width:none}
}


/* v28 — Pricing/Care hero structural fix.
   These pages now use .wrap + .inner-hero-grid + .actions + .button,
   exactly like the working Website Development hero. */
.pricing-hero-grid,
.care-hero-grid{
  grid-template-columns:minmax(0,1.12fr) minmax(340px,.88fr);
  gap:70px;
}
.pricing-hero-note,
.care-hero-panel{
  position:relative;
  justify-self:end;
  width:100%;
  max-width:470px;
  margin:0;
}
.pricing-hero .actions,
.care-hero .actions{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}
@media(max-width:1000px){
  .pricing-hero-grid,
  .care-hero-grid{
    grid-template-columns:minmax(0,1fr) minmax(300px,.75fr);
    gap:36px;
  }
}
@media(max-width:700px){
  .pricing-hero-grid,
  .care-hero-grid{
    display:block;
    padding:42px 0;
  }
  .pricing-hero-note,
  .care-hero-panel{
    margin-top:30px;
    max-width:none;
  }
}


/* v29 — top navigation active-state fix */
body.pricing-page .nav-dropdown-toggle.active,
body.pricing-page .nav-dropdown-toggle[aria-current="page"]{
  color:inherit !important;
  border-bottom-color:transparent !important;
}


/* v30 — mobile dropdown tap behaviour */
@media (max-width:900px){
  .nav-dropdown.open .nav-dropdown-menu{
    display:block !important;
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
    transform:none !important;
  }
  .nav-dropdown .nav-dropdown-toggle{
    cursor:pointer;
    touch-action:manipulation;
  }
  .nav-dropdown.open .nav-dropdown-toggle::after{
    transform:rotate(180deg);
  }
}


/* v31 — mobile dropdown is an accordion inside the open mobile menu */
@media(max-width:1000px){
  #navigation .nav-dropdown{width:100%}
  #navigation .nav-dropdown-toggle{display:block;width:100%}
  #navigation .nav-dropdown-menu{
    position:static !important;
    display:none !important;
    width:100%;
    min-width:0;
    margin:0;
    padding:2px 0 7px 18px;
    background:#0b2637;
    border:0;
    border-left:2px solid rgba(13,200,235,.45);
    border-radius:0;
    box-shadow:none;
    opacity:1 !important;
    visibility:visible !important;
    transform:none !important;
    pointer-events:auto !important;
  }
  #navigation .nav-dropdown.open .nav-dropdown-menu{display:block !important}
  #navigation .nav-dropdown-menu a{
    display:block;
    width:100%;
    padding:10px 12px;
    border-bottom:0 !important;
  }
}

/* Phone and tablet footer: keep text below the proportional scene. */
@media (max-width:1000px) {
  .contact .footer-scene {
    inset:0 0 auto;
    height:150px;
    background-size:auto 758.871%;
    background-position:left bottom;
  }
  .contact::after {
    background:none;
  }
  .contact > .contact-grid {
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:18px;
    min-height:0;
    padding:174px 0 30px;
  }
}

/* Preserve the footer image's aspect ratio at every viewport width. */
.contact .footer-scene {
  background-size:auto 758.871%;
  background-position:left bottom;
}

/* Shared scenic footer on every page; isolate it from contact-form grid styles. */
@media (min-width:1001px) {
  .contact > .contact-grid {
    display:flex;
    flex-direction:row;
    align-items:center;
    justify-content:space-between;
    gap:28px;
  }
}

.contact-form > .form-note {
  margin:0 0 22px;
  color:#455163;
  font-size:14px;
  line-height:1.6;
}
