﻿/* Interior pages share the homepage palette, type, navigation, and motion. */
.site-theme.interior-page { --card:#fff; }
.site-theme .page-hero { padding:75px 0 68px; background:radial-gradient(ellipse at 85% 35%,#e6eff780,transparent 58%); }
.page-hero-grid { display:grid; grid-template-columns:1.1fr 1fr; align-items:center; gap:65px; }
.site-theme .page-hero h1 { font:800 clamp(37px,4.2vw,58px)/1.15 'Manrope',sans-serif; letter-spacing:-2.6px; margin:0 0 23px; }
.page-hero h1 span { color:#47769a; }
.page-lead { color:var(--muted); font-size:16px; line-height:1.85; max-width:530px; margin:0 0 28px; }
.about-vignette { position:relative; min-height:355px; display:grid; place-items:center; padding:28px; background:linear-gradient(145deg,#e4edf4,#f3f7fa); border:1px solid #d9e5ed; border-radius:8px; box-shadow:0 22px 60px -40px #315f8555; }
.tech-check { position:relative; width:min(100%,390px); overflow:hidden; background:#fff; border:1px solid #cbdbe6; border-radius:5px; box-shadow:0 18px 38px -25px #19344f55; }
.tech-check-head { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:10px; padding:14px 16px; background:#19344f; color:#fff; font-size:11px; }
.tech-check-head>span:last-child { color:#bfe0c9; font-size:9px; letter-spacing:1.2px; text-transform:uppercase; }
.status-light { width:8px; height:8px; background:#79b68d; box-shadow:0 0 0 4px #79b68d20; }
.tech-check-row { display:grid; grid-template-columns:34px 1fr; align-items:center; gap:13px; padding:17px; border-bottom:1px solid #e0e8ef; }
.tech-check-row div { display:flex; align-items:baseline; justify-content:space-between; gap:16px; }.tech-check-row strong { font:800 13px 'Manrope',sans-serif; }.tech-check-row div span { color:var(--muted); font-size:10px; text-align:right; }
.check-symbol { width:28px; height:28px; display:grid; place-items:center; background:#e9f3ec; color:#477157; font-weight:800; }
.tech-check-foot { display:flex; justify-content:space-between; gap:18px; padding:13px 17px; color:#52677b; font-size:9px; letter-spacing:1px; text-transform:uppercase; }
.tech-check-foot span::before { content:''; display:inline-block; width:12px; height:2px; margin:0 7px 3px 0; background:#c92d3a; }
.tech-scan { position:absolute; left:0; right:0; top:44px; height:2px; background:linear-gradient(90deg,transparent,#6d9ab9,transparent); opacity:0; }
.values-section { background:#fff; }
.values-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.site-theme .values-grid .home-service-card { background:#f8fafc; padding:30px; }
.site-theme .values-grid h3 { min-height:0; }
.story-section { padding:78px 0; }.story-grid { display:grid; grid-template-columns:1fr 1fr; gap:90px; }.site-theme .story-section h2 { font:800 clamp(28px,3vw,39px)/1.25 'Manrope',sans-serif; letter-spacing:-1.4px; margin:0; }.story-section h2 span { color:#47769a; }.story-copy p { margin:0 0 18px; color:var(--muted); font-size:14px; line-height:1.9; }
.site-theme.interior-page .local-neighbourhood { padding:15px 0 65px; }
.service-toolkit { background:#eaf1f6; border:1px solid #dce6ee; border-radius:20px; padding:28px; box-shadow:0 15px 40px -30px #19344f30; }
.service-toolkit>.eyebrow { margin-bottom:17px; }.toolkit-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.toolkit-link { position:relative; display:flex; flex-direction:column; background:#fff; border:1px solid #dce6ee; border-radius:12px; padding:17px; font-size:12px; font-weight:700; line-height:1.5; transition:transform var(--motion-normal) var(--ease-settle),box-shadow var(--motion-normal) var(--ease-ui); }
.site-theme .toolkit-link .service-icon { width:36px; height:36px; margin-bottom:16px; }.site-theme .toolkit-link svg { width:21px; height:21px; }.toolkit-link>span:last-child { position:absolute; top:17px; right:17px; color:#6d8da7; }
.toolkit-link:hover { box-shadow:0 8px 18px #19344f0b; }.toolkit-note { font-size:11px; line-height:1.8; margin:17px 0 0; color:var(--muted); }.toolkit-note a { text-decoration:underline; text-underline-offset:3px; }
.site-theme .service-catalogue { padding-top:12px; }
.service-detail-grid { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.site-theme .service-detail { padding:32px; display:flex; flex-direction:column; scroll-margin-top:120px; }
.site-theme .service-detail>.eyebrow { font-size:10px; margin-bottom:9px; }
.site-theme .service-detail h2 { font-size:26px; letter-spacing:-.9px; margin:0 0 15px; }
.site-theme .service-detail>.service-icon { margin-bottom:25px; }.site-theme .service-detail>p:not(.eyebrow) { font-size:14px; }
.service-includes { list-style:none; padding:20px 0; margin:0; }.service-includes li { padding:6px 0 6px 23px; position:relative; font-size:13px; color:var(--muted); line-height:1.6; }.service-includes li::before { content:'\2713'; color:#62856e; position:absolute; left:0; }
.service-detail>.text-link { margin-top:auto; padding-top:13px; border-top:1px solid var(--border); }
#small-business { scroll-margin-top:100px; }.business-detail { display:grid; grid-template-columns:1.2fr 1fr; align-items:center; gap:75px; }.business-detail .btn { margin-top:10px; }.business-list { padding:0; list-style:none; margin:0; }.business-list li { padding:16px 0; border-bottom:1px solid #ffffff26; font-size:14px; }.business-list li:last-child { border:0; }
.site-theme .contact-intro { padding-bottom:36px; }.contact-intro .page-lead { max-width:610px; margin-bottom:0; }
.contact-section { padding:10px 0 78px; }.contact-grid { display:grid; grid-template-columns:.8fr 1.2fr; gap:90px; align-items:start; }
.contact-mail-art { max-width:245px; margin:0 auto 10px; }.contact-mail-art svg { display:block; width:100%; height:auto; }
.site-theme .contact-aside h2 { font:800 25px/1.3 'Manrope',sans-serif; letter-spacing:-.7px; margin:0 0 14px; text-align:center; }.contact-aside>p { font-size:14px; color:var(--muted); line-height:1.85; margin:0 auto 12px; max-width:350px; text-align:center; }
.email-link,.phone-link { display:block; width:fit-content; max-width:100%; margin:0 auto; font-size:13px; font-weight:600; padding:8px 0; overflow-wrap:anywhere; text-align:center; }
.phone-link { color:var(--accent); font-size:14px; }
.contact-expectations { margin-top:30px; padding-top:28px; border-top:1px solid var(--border); }.contact-expectations .process-steps h3 { font-size:14px; }.contact-expectations .process-steps p { font-size:12px; color:var(--muted); line-height:1.8; }.contact-expectations .process-steps li { gap:15px; }
.contact-form { position:relative; background:#fff; padding:35px; border:1px solid var(--border); border-radius:18px; box-shadow:0 12px 40px -24px #19344f28; }
.site-theme .contact-form h2 { font:800 23px/1.35 'Manrope',sans-serif; letter-spacing:-.7px; margin:0 0 7px; }.form-intro { font-size:12px; color:var(--muted); margin:0 0 25px; }
.form-field { margin-bottom:20px; }.form-field label { display:block; font-weight:700; font-size:13px; margin-bottom:9px; }.form-field input,.form-field select,.form-field textarea { width:100%; min-height:47px; padding:12px 14px; border:1px solid #cad8e3; border-radius:7px; background:#f8fafc; color:var(--fg); font:400 14px/1.5 'DM Sans',sans-serif; transition:border-color var(--motion-fast),box-shadow var(--motion-fast); }.form-field textarea { resize:vertical; min-height:130px; }.form-field input::placeholder,.form-field textarea::placeholder { color:#687c8d; }.form-field input:focus,.form-field select:focus,.form-field textarea:focus { outline:2px solid #47769a; outline-offset:2px; border-color:#47769a; background:#fff; }.field-help { color:var(--muted); font-size:11px; line-height:1.7; margin:-3px 0 9px; }
.form-honeypot { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.form-actions { display:flex; align-items:center; justify-content:space-between; gap:15px; }.form-actions>span { font-size:10px; color:var(--muted); }.form-actions button { cursor:pointer; font-family:inherit; }.form-actions button:disabled { cursor:wait; opacity:.65; transform:none; }
#form-status { font-size:13px; line-height:1.7; margin:18px 0 0; }#form-status:empty { display:none; }#form-status[data-state="success"] { color:#2f6b45; }#form-status[data-state="error"] { color:#b02432; }
@media(prefers-reduced-motion:no-preference) {
 .page-hero-copy>*,.contact-intro .container>* { animation:home-enter var(--motion-enter) var(--ease-settle) both; }.page-hero-copy h1,.contact-intro h1 { animation-delay:40ms; }.page-hero-copy .page-lead,.contact-intro .page-lead { animation-delay:80ms; }.page-hero-copy .btn { animation-delay:120ms; }.about-vignette,.service-toolkit { animation:scene-settle 450ms var(--ease-settle) both; }
 .tech-check-row { animation:check-row-arrive 520ms var(--ease-settle) both; }.tech-check-row:nth-child(3) { animation-delay:90ms; }.tech-check-row:nth-child(4) { animation-delay:180ms; }
 .tech-scan { animation:tech-scan 3.8s ease-in-out 700ms infinite; }
 .status-light { animation:status-pulse 2.4s ease-in-out infinite; }
 .contact-mail-art { animation:mail-drift 4.8s ease-in-out infinite; }
}
@keyframes check-row-arrive { from { opacity:0; transform:translateX(24px); } to { opacity:1; transform:translateX(0); } }
@keyframes tech-scan { 0%,15% { opacity:0; transform:translateY(0); } 25% { opacity:.7; } 72% { opacity:.2; transform:translateY(188px); } 73%,100% { opacity:0; transform:translateY(188px); } }
@keyframes status-pulse { 0%,100% { opacity:.55; } 50% { opacity:1; box-shadow:0 0 0 6px #79b68d18; } }
@keyframes mail-drift { 0%,100% { transform:translateY(0) rotate(0); } 50% { transform:translateY(-8px) rotate(-1.2deg); } }
@media(max-width:1000px) { .page-hero-grid { gap:35px; }.contact-grid { gap:40px; }.story-grid { gap:45px; }.site-theme .values-grid .home-service-card { padding:23px; } }
@media(max-width:760px) {
 .site-theme .page-hero { padding:45px 0; }.page-hero-grid,.story-grid,.contact-grid,.business-detail { grid-template-columns:1fr; gap:35px; }.site-theme .page-hero h1 { font-size:clamp(35px,7.5vw,48px); letter-spacing:-1.8px; }.page-lead { font-size:15px; }.about-vignette { width:100%; max-width:450px; margin:auto; min-height:320px; padding:20px; }.values-grid { grid-template-columns:1fr; }.story-section { padding:50px 0; }.service-detail-grid { grid-template-columns:1fr; }.site-theme .service-detail { padding:25px; }.site-theme .service-detail h2 { font-size:25px; }.service-toolkit { padding:22px; }.site-theme .contact-intro { padding-bottom:20px; }.contact-grid { display:flex; flex-direction:column; gap:35px; }.contact-form { order:-1; width:100%; padding:25px; }.contact-aside { width:100%; }.contact-mail-art { max-width:190px; }.contact-aside>p { max-width:100%; }.contact-expectations { margin-top:20px; }.contact-section { padding-bottom:45px; }.site-theme.interior-page .local-neighbourhood { padding-bottom:45px; }
}
@media(max-width:380px) { .service-toolkit { padding:16px; }.toolkit-link { padding:12px; font-size:11px; }.toolkit-link>span:last-child { top:12px; right:12px; }.form-actions { flex-direction:column-reverse; align-items:stretch; }.form-actions .btn { justify-content:center; }.form-actions>span { text-align:center; }.contact-form { padding:20px; }.site-theme .contact-form h2 { font-size:21px; }.tech-check-row div { display:block; }.tech-check-row div span { display:block; margin-top:4px; text-align:left; } }
.form-actions .btn { flex-shrink:0; white-space:nowrap; }
@media(max-width:420px) { .form-actions { flex-direction:column-reverse; align-items:stretch; }.form-actions .btn { justify-content:center; }.form-actions>span { text-align:center; } }
/* Expanded computer support stays easy to scan and keyboard accessible. */
.site-theme .computer-feature { grid-column:1 / -1; display:grid; grid-template-columns:.85fr 1.15fr; gap:45px; align-items:start; }
.computer-intro { position:sticky; top:120px; }.site-theme .computer-intro>.eyebrow { margin-bottom:10px; font-size:10px; }.site-theme .computer-intro>p:not(.eyebrow) { font-size:14px; margin-bottom:22px; }.computer-intro .text-link { border-top:1px solid var(--border); padding-top:15px; }
.computer-services details { border-bottom:1px solid var(--border); }.computer-services details:last-child { border-bottom:0; }
.computer-services summary { display:flex; align-items:center; justify-content:space-between; gap:18px; list-style:none; padding:18px 0; cursor:pointer; font:700 14px/1.6 'Manrope',sans-serif; }
.computer-services summary::-webkit-details-marker { display:none; }.computer-services summary::after { content:'+'; color:#47769a; font-size:22px; font-weight:400; flex-shrink:0; }.computer-services details[open] summary::after { content:'\2212'; }.computer-services summary:hover { color:#47769a; }.computer-services summary:focus-visible { outline:2px solid #47769a; outline-offset:3px; border-radius:3px; }
.site-theme .computer-services details p { padding:0 30px 19px 0; font-size:13px; line-height:1.85; }
@media(prefers-reduced-motion:no-preference) { .computer-services details[open] p { animation:home-enter 280ms var(--ease-settle); } }
@media(max-width:760px) { .site-theme .computer-feature { grid-template-columns:1fr; gap:22px; }.computer-intro { position:static; }.computer-services summary { font-size:13px; gap:12px; }.site-theme .computer-services details p { padding-right:0; } }
/* Native disclosures keep all seven services compact until requested. */
.service-disclosures { display:flex; flex-direction:column; gap:14px; }
.service-disclosure-hint { color:var(--muted); font-size:13px; margin:0 0 9px; }
.site-theme .service-disclosure { padding:0; scroll-margin-top:115px; }
.service-disclosure>summary { display:flex; align-items:center; gap:23px; cursor:pointer; padding:25px 30px; list-style:none; }
.service-disclosure>summary::-webkit-details-marker { display:none; }
.site-theme .service-disclosure>summary .service-icon { margin:0; flex-shrink:0; width:50px; height:50px; }
.service-summary-copy { flex:1; min-width:0; }.site-theme .service-summary-copy .eyebrow { display:block; margin-bottom:5px; font-size:9px; }
.site-theme .service-summary-copy h2 { font:800 23px/1.3 'Manrope',sans-serif; letter-spacing:-.7px; margin:0; }
.service-expander { width:30px; height:30px; border:1px solid #cbdce8; border-radius:50%; position:relative; flex-shrink:0; }
.service-expander::before,.service-expander::after { content:''; position:absolute; width:10px; height:2px; background:#47769a; top:13px; left:9px; }.service-expander::after { transform:rotate(90deg); transition:transform var(--motion-normal) var(--ease-settle); }.service-disclosure[open]>.service-expander::after,.service-disclosure[open]>summary .service-expander::after { transform:rotate(0); }
.service-disclosure>summary:focus-visible { outline:2px solid #47769a; outline-offset:4px; border-radius:12px; }
.site-theme .service-disclosure:hover { transform:none; }
.site-theme .service-disclosure[open] { border-color:#a9c1d3; }
.service-expanded { padding:0 30px 28px 103px; }
.site-theme .service-overview { padding:20px 0; border-top:1px solid var(--border); font-size:14px; line-height:1.85; }
.service-explanation-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; padding:8px 0 25px; }
.site-theme .service-explanation-grid h3 { font:800 15px/1.5 'Manrope',sans-serif; min-height:0; margin:0 0 10px; }
.site-theme .service-explanation-grid p { font-size:13px; line-height:1.85; }
.service-expanded>.text-link { margin-top:12px; }
@media(prefers-reduced-motion:no-preference) { .service-disclosure[open]>.service-expanded { animation:detail-swipe 420ms var(--ease-settle); } }
@keyframes detail-swipe { from { opacity:0; transform:translateX(26px); } to { opacity:1; transform:translateX(0); } }
@media(max-width:760px) { .service-disclosure>summary { padding:20px; gap:15px; }.site-theme .service-disclosure>summary .service-icon { width:40px; height:40px; }.site-theme .service-summary-copy h2 { font-size:18px; letter-spacing:-.4px; }.site-theme .service-summary-copy .eyebrow { font-size:8px; letter-spacing:1px; }.service-expanded { padding:0 20px 20px; }.service-explanation-grid { grid-template-columns:1fr; gap:22px; }.service-expander { width:26px; height:26px; }.service-expander::before,.service-expander::after { top:11px; left:7px; } }
@media(max-width:380px) { .service-disclosure>summary { padding:17px 14px; gap:10px; }.site-theme .service-summary-copy h2 { font-size:16px; }.site-theme .service-summary-copy .eyebrow { letter-spacing:.5px; }.site-theme .service-disclosure>summary .service-icon { width:34px; height:34px; } }
