/* Vanguard v2 visual layer — modern & bold (2026-11-09).
   Signature: brand-gradient "block" tiles (green→blue from the logo) used for icons, primary buttons and numbers.
   Everything else stays calm: deep ink sections, light concrete sections, generous radius only where it means "card". */
:root{
  --ink:#0d1b21;--ink-2:#13262d;--ink-3:#1b3239;
  --paper:#f1f4f2;--card:#ffffff;
  --brand-a:#12c48b;--brand-b:#4f95ec;
  --grad:linear-gradient(120deg,#3fc79a,#4fb3b8,#6b9be0,#4fb3b8,#3fc79a);
  --radius-l:28px;--radius-m:18px;--radius-s:12px;
  --lift:0 1px 0 #ffffff14 inset,0 18px 40px -18px #04101480,0 6px 14px -8px #04101466;
  --tile-shadow:none;
}
body{background:var(--ink)}
body h1,body h2{font-weight:800;letter-spacing:0}
body h3{font-weight:700}

/* ---------- Buttons: minimal, with one slow drifting colour line ---------- */
@property --spin{syntax:'<angle>';inherits:false;initial-value:0deg}
.btn{position:relative;display:inline-flex;align-items:center;gap:12px;min-height:52px;padding:0 24px 0 16px;border-radius:999px;font-size:15px;font-weight:600;line-height:1;white-space:nowrap;isolation:isolate;transition:background .25s,color .25s}
.btn .btn-ico{display:grid;place-items:center;flex-shrink:0}
.btn .btn-ico svg{width:20px;height:20px}
.btn-primary{background:#f4f6f3;color:var(--ink)}
.btn-primary:before{content:'';position:absolute;inset:-1px;padding:1.5px;border-radius:inherit;pointer-events:none;background:conic-gradient(from var(--spin),#3fc79a,#6b9be0,transparent 38%,transparent 62%,#3fc79a);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:v2-spin 9s linear infinite}
.btn-primary:hover{background:#fff}
.btn-glass{background:transparent;color:#fff;border:1px solid #ffffff3d}
.btn-glass:hover{background:#ffffff12}
.light-section .btn-glass{color:var(--ink);border-color:#0d1b2133}
@keyframes v2-spin{to{--spin:360deg}}
@keyframes v2-drift{0%{background-position:0% 50%}100%{background-position:100% 50%}}
body .text-link{gap:10px;padding:6px 0;border:0;border-bottom:1px solid var(--line);border-radius:0;font-weight:600;background-image:var(--grad);background-size:0% 1px;background-repeat:no-repeat;background-position:100% 100%;transition:background-size .4s ease,color .2s}
body .text-link:hover{background-size:100% 1px;color:inherit}
body .text-link .icon{width:22px;height:22px}

/* ---------- Header ---------- */
body .site-header,body .site-header.is-scrolled{background:#0d1b21d9;backdrop-filter:blur(14px) saturate(140%);border-bottom:1px solid #ffffff12}
body .desktop-nav a{font-size:14px;font-weight:500;padding:8px 14px;border-radius:999px;transition:background .2s,color .2s}
body .desktop-nav a:after{display:none}
body .desktop-nav a:hover{background:#ffffff12;color:#fff}
body .desktop-nav a[aria-current=page]{background:#ffffff1a;color:#fff}
body .header-contact{position:relative;display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:0 20px 0 14px;border-radius:999px;color:#fff;font-size:14px;font-weight:600;border:1px solid #ffffff33;transition:background .2s}
body .header-contact:hover{background:#ffffff12}
body .header-contact .icon{width:20px;height:20px}
@media(max-width:1100px){body .header-contact{display:none}}

/* ---------- Hero ---------- */
body .hero-shade{background:linear-gradient(0deg,#0d1b21f2 0%,#0d1b2199 38%,#0d1b2133 70%,#0d1b2166 100%),radial-gradient(70% 60% at 85% 60%,#12c48b14,transparent 70%)}
body .hero-copy h1{font-weight:800;line-height:1.45;text-wrap:balance}
body .hero-description{color:#dbe5e0;font-size:17px;max-width:520px}
.hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:6px}
body .hero .outline-link{display:none}
.hero-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:44px;max-width:720px}
.hero-stat{display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:var(--radius-m);background:#0d1b2166;border:1px solid #ffffff1f;backdrop-filter:blur(12px)}
.hero-stat strong{display:block;font-size:22px;font-weight:800;color:#fff;line-height:1.4}
.hero-stat span{display:block;font-size:12px;color:#b9c7c2;line-height:1.6}
body .hero-bottom{display:none}
@media (prefers-reduced-motion:reduce){.btn-primary:before,body .contact-cta .round-link:before,.tile,body .service-index,body .principles strong{animation:none}}
@media (prefers-reduced-motion:no-preference){
  .hero-copy>*{animation:v2-rise .8s cubic-bezier(.2,.7,.2,1) both}
  .hero-copy>*:nth-child(2){animation-delay:.08s}.hero-copy>*:nth-child(3){animation-delay:.16s}
  .hero-copy>*:nth-child(4){animation-delay:.24s}.hero-copy>*:nth-child(5){animation-delay:.34s}
  @keyframes v2-rise{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
}

/* ---------- Brand tile (signature) ---------- */
.tile,body .service-index{position:relative;display:grid;place-items:center;width:68px;height:68px;border-radius:20px;background:var(--grad);background-size:300% 100%;color:#fff;flex-shrink:0;animation:v2-drift 14s ease-in-out infinite alternate}
.tile svg,body .service-index svg{position:relative;width:46%;height:46%;stroke:#fff;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.tile-sm{width:46px;height:46px;border-radius:14px}
.tile-sm svg{width:52%;height:52%}

/* ---------- Light sections ---------- */
body .light-section{background:var(--paper)}

/* ---------- Services ---------- */
body .services-list{gap:22px}
body .services-list article{position:relative;border:0;padding:30px 26px 32px;border-radius:var(--radius-l);background:var(--card);box-shadow:0 1px 0 #0d1b2108,0 22px 48px -30px #0d1b2140;transition:transform .25s ease,box-shadow .25s ease;overflow:hidden}
body .services-list article:after{content:'';position:absolute;inset:auto 26px 0;height:4px;border-radius:4px 4px 0 0;background:var(--grad);opacity:0;transition:opacity .25s}
body .services-list article:hover{transform:translateY(-3px);box-shadow:0 26px 50px -30px #0d1b2155}
body .services-list article:hover:after{opacity:1}
body .service-index{margin:0 0 26px}
body .services-list h3{color:var(--ink)}

/* ---------- Stats band (numbers now live in the hero; the band stays available when the hero is hidden) ---------- */
body.has-hero-stats .principles{display:none}
body .principles{background:var(--ink);border:0}
body .principles-grid{gap:20px}
body .principles-grid>div{display:flex;flex-direction:column;align-items:flex-start;gap:14px;padding:30px 28px;border:1px solid #ffffff14;border-radius:var(--radius-l);background:linear-gradient(160deg,#16303a,#0f2128)}
body .principles-grid>div:first-child{padding-inline-start:28px;border:1px solid #ffffff14}
body .principles strong{font-weight:800;font-size:clamp(34px,3.2vw,48px);line-height:1.3;background:var(--grad);background-size:300% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:v2-drift 14s ease-in-out infinite alternate}
body .principles span{font-size:15px;line-height:2;color:#b9c7c2}

/* ---------- Projects ---------- */
body .project-visual{border-radius:var(--radius-l)}
body .project-visual:after{inset:40% 0 0;background:linear-gradient(transparent,#0d1b21b3)}
body .project-caption h3{font-weight:800}
body .carousel-controls button{border-radius:50%;border-color:#ffffff2e;background:#ffffff0d}
body .carousel-controls button:not(:disabled):hover{background:#ffffff14;border-color:#ffffff66}
body .carousel-progress span{background:var(--grad)}

/* ---------- Statement & editorial ---------- */
body .statement{margin:0 var(--gutter);border-radius:var(--radius-l);overflow:hidden}
body .editorial-image img{border-radius:var(--radius-l)}

/* ---------- CTA ---------- */
body .contact-cta{background:transparent;padding-block:90px}
body .contact-cta .container{position:relative;padding:64px clamp(28px,5vw,80px);border-radius:32px;background:radial-gradient(90% 120% at 0% 100%,#4f95ec26,transparent 60%),radial-gradient(80% 120% at 100% 0%,#12c48b22,transparent 55%),var(--ink-2);border:1px solid #ffffff17;overflow:hidden;max-width:calc(1800px - 2 * var(--gutter));width:calc(100% - 2 * var(--gutter))}
body .contact-cta .round-link{position:relative;isolation:isolate;width:auto;height:auto;border:0;border-radius:999px;background:transparent;color:var(--ink);padding:14px 24px 14px 16px;display:inline-flex;align-items:center;gap:12px;font-weight:600;font-size:15px}
body .contact-cta .round-link:before{content:'';position:absolute;inset:-1px;padding:1.5px;border-radius:inherit;pointer-events:none;background:conic-gradient(from var(--spin),#3fc79a,#6b9be0,transparent 38%,transparent 62%,#3fc79a);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:v2-spin 9s linear infinite}
body .contact-cta .round-link:after{content:'گفت‌وگو درباره پروژه';white-space:nowrap}
body .contact-cta .round-link .icon{width:20px;height:20px}
body .contact-cta .round-link{background:#f4f6f3}
body .contact-cta .round-link:hover{background:#fff;color:var(--ink)}

/* ---------- Forms & cards on inner pages ---------- */
body .form-row input,body .form-row textarea,body .form-row select{border-radius:var(--radius-s);background:#ffffff08;border-color:#ffffff2b;transition:border-color .2s,box-shadow .2s}
body .form-row input:focus,body .form-row textarea:focus,body .form-row select:focus{border-color:var(--brand-a);box-shadow:0 0 0 4px #12c48b2b;outline:0}
body .contact-form button[type=submit],body form button[type=submit]{border-radius:999px;background:#f4f6f3;color:var(--ink);border:0;font-weight:600;min-height:52px;padding-inline:28px}
body .article-card{padding:26px;border:1px solid var(--line);border-top:1px solid var(--line);border-radius:var(--radius-l);background:var(--ink-2)}
body .vg-diagram svg{border-radius:var(--radius-m)}

/* ---------- Footer ---------- */
body .contact-detail{display:flex;align-items:center;gap:10px}
body .social-links a{display:inline-flex;align-items:center;gap:8px}

/* ---------- Quick contact ---------- */


/* ---------- Responsive ---------- */
@media(max-width:900px){
  .hero-stats{gap:8px;margin-top:28px}
  .hero-stat{flex-direction:column;align-items:flex-start;gap:10px;padding:12px}
  .hero-stat strong{font-size:17px}
  .hero-stat span{font-size:11px}
  .hero-actions .btn{flex:1 1 100%;justify-content:flex-start}
  body .services-list article{padding:24px 22px}
  .tile:not(.tile-sm),body .service-index{width:64px;height:64px;border-radius:18px}
  body .principles-grid>div{padding:24px 22px}
  body .statement{margin:0 16px}
  body .contact-cta .container{padding:44px 24px;width:calc(100% - 32px)}
  .btn{min-height:50px;font-size:14px}
}

/* ---------- Cards: centred, titles on one line ---------- */
body .services-list article{text-align:center}
body .services-list .service-index{margin:0 auto 24px}
body .services-section .services-list h3{font-size:clamp(17px,1.35vw,21px);line-height:1.6;white-space:nowrap;margin-bottom:12px}
body .services-section .services-list p{font-size:14.5px;line-height:2.1}
.hero-stat{flex-direction:column;align-items:center;text-align:center;gap:10px;padding:16px 12px}
.hero-stat strong{white-space:nowrap}

/* ---------- Faint paper grain (whole page, barely visible) ---------- */
body:after{content:'';position:fixed;inset:0;z-index:9999;pointer-events:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E") repeat;background-size:220px;opacity:.05;mix-blend-mode:soft-light}

/* ---------- Footer ---------- */
body .site-footer{background-color:#0a161b;position:relative;padding-top:80px}
body .site-footer:before{content:'';position:absolute;inset:0 0 auto;height:1px;background:var(--grad);background-size:300% 100%;opacity:.55;animation:v2-drift 14s ease-in-out infinite alternate}
body .footer-top{padding-bottom:44px}
body .footer-top>p{font-size:16px;line-height:2.1;max-width:520px;color:#c3cfca}
body .footer-grid{gap:48px;padding-block:48px}
body .footer-label{display:flex;align-items:center;gap:10px;font-size:15px;font-weight:700;color:#eef3ef;margin-bottom:18px}
body .footer-label:before{content:'';width:18px;height:3px;border-radius:3px;background:var(--grad)}
body .footer-grid p,body .footer-grid a{font-size:15px;line-height:2.1;color:#c3cfca}
body .footer-grid a:hover{color:#fff}
body .footer-grid .menu{gap:6px}
body .contact-detail{gap:12px;padding-block:3px}
body .contact-detail:before{content:'';width:18px;height:18px;flex-shrink:0;background:#7fd8b8;-webkit-mask:var(--ico) center/contain no-repeat;mask:var(--ico) center/contain no-repeat}
body .contact-detail[href^="tel:"]{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linejoin='round'%3E%3Cpath d='M6.6 3.5h3l1.5 4-2 1.3a11 11 0 0 0 6.1 6.1l1.3-2 4 1.5v3a2 2 0 0 1-2.2 2A17 17 0 0 1 4.5 5.7a2 2 0 0 1 2.1-2.2Z'/%3E%3C/svg%3E")}
body .contact-detail[href^="mailto:"]{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='m4 7 8 6 8-6'/%3E%3C/svg%3E")}
body .social-links{flex-direction:row;flex-wrap:wrap;gap:10px}
body .social-links a{padding:8px 16px;border:1px solid #ffffff2b;border-radius:999px;font-size:14px}
body .social-links a:hover{border-color:#ffffff66}
body .footer-bottom{font-size:13px;color:#93a59f;padding-top:26px}
body .footer-bottom span[lang=en]{font:600 11px/1.6 Arial,sans-serif;letter-spacing:3px}
@media(max-width:900px){
  body .site-footer{padding-top:56px}
  body .footer-grid{grid-template-columns:1fr;gap:34px;padding-block:36px}
  body .footer-top>p{font-size:15px}
  body .footer-grid p,body .footer-grid a{font-size:15px!important}
  body .footer-label{font-size:15px!important}
  body .footer-bottom{font-size:12px!important}
  body .services-section .services-list h3{font-size:clamp(18px,5.4vw,22px)!important;white-space:nowrap}
  .hero-stat{padding:12px 6px}
}

/* ---------- Footer, richer ---------- */
body .footer-grid nav:before{content:'دسترسی سریع';display:flex;font-size:15px;font-weight:700;color:#eef3ef;margin-bottom:18px;padding-inline-start:28px;background:var(--grad) right center/18px 3px no-repeat}
body .footer-grid nav .menu{display:grid;grid-template-columns:repeat(2,auto);justify-content:start;column-gap:36px;row-gap:4px}
body .footer-grid nav .menu a{display:inline-flex;align-items:center;gap:8px}
body .footer-grid nav .menu a:hover{color:#7fd8b8}
body .site-footer{overflow:hidden}
body .footer-bottom{position:relative;z-index:1}
@media(max-width:900px){
  body .footer-grid nav:before{font-size:15px}
}

/* CTA: collapse the doubled line break from the customizer text, keep the button on the baseline */
body .contact-cta h2 br+br{display:none}
body .contact-cta .cta-row{align-items:flex-end}


/* Text selection: soft translucent tint instead of the solid mint block */
::selection{background:#00000059;color:inherit}
.light-section ::selection{background:#0d1b2124;color:inherit}

/* Statement: faint dark glass panel behind the paragraph only, for readability over the photo */
body .statement-copy>p:not(.eyebrow){padding:22px 26px;border-radius:18px;background:#0a161b8c;border:1px solid #ffffff12;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
@media(max-width:900px){body .statement-copy>p:not(.eyebrow){padding:18px 18px;border-radius:14px}}

/* Light sections keep the faint blueprint grid */
body .light-section,body .introduction.light-section{background-image:linear-gradient(#0d1b210a 1px,transparent 1px),linear-gradient(90deg,#0d1b210a 1px,transparent 1px);background-size:56px 56px;background-position:center top}

/* Header: solid when the page scrolls, so content no longer shows through it */
body .site-header.is-scrolled{background:#0d1b21;backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:0 10px 30px -18px #000000b3}

/* Hero: keep the first line clear of the fixed header */
body .hero,body .hero-inner{height:auto;min-height:100svh}
body .hero-inner{padding-top:clamp(170px,20vh,210px);padding-bottom:64px}
@media(max-width:900px){body .hero-inner{padding-top:130px;padding-bottom:40px}}

/* Hero stat icons: plain white line icons, no tile */
.hero-stat .stat-ico{display:block;width:28px;height:28px;color:#fff;opacity:.92}
.hero-stat .stat-ico svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}

/* =================== Inner pages =================== */
/* Page heading: a little more air, soft brand glow */
body .page-heading{position:relative;padding-bottom:64px}
body .page-heading h1{font-weight:800}
body .page-heading-row>p{font-size:16px;line-height:2.1}

/* About */
body .about-hero img{border-radius:var(--radius-l)}
body .page-content .intro-grid .prose h2{font-size:clamp(24px,2.2vw,34px);margin-bottom:18px}
body .page-content .intro-grid .prose p{font-size:16px;line-height:2.2;margin-bottom:40px}
body .page-content .intro-grid{padding:clamp(28px,4vw,56px);border-radius:var(--radius-l);background:var(--ink-2);border:1px solid #ffffff14}

/* Services page: same white, centred cards as the home page, on a light sheet */
body .page-content:has(.service-details){--text:#142c32;--muted:#4c625f;--line:#173c3026;color:var(--text);background-color:#f1f4f2;background-image:linear-gradient(#0d1b210a 1px,transparent 1px),linear-gradient(90deg,#0d1b210a 1px,transparent 1px);background-size:56px 56px;background-position:center top;border-radius:32px;width:calc(100% - 2 * var(--gutter));padding:clamp(32px,5vw,72px)}
body .page-content:has(.service-details) .prose{max-width:820px;margin-inline:auto;text-align:center}
body .page-content:has(.service-details) .prose h2{font-size:clamp(22px,2vw,30px);color:var(--text)}
body .page-content:has(.service-details) .prose a{color:#167451}
body .service-details{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;margin-top:56px}
body .service-details article{display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;padding:34px 30px 36px;border:0;border-radius:var(--radius-l);background:#fff;box-shadow:0 1px 0 #0d1b2108,0 22px 48px -30px #0d1b2140;transition:transform .25s ease,box-shadow .25s ease}
body .service-details article:hover{transform:translateY(-3px);box-shadow:0 26px 50px -30px #0d1b2155}
body .service-details .service-index{margin:0 0 14px}
body .service-details h2{font-size:clamp(19px,1.6vw,24px)!important;white-space:nowrap;color:var(--ink);margin:0}
body .service-details p{grid-column:auto;font-size:15px!important;line-height:2.1;color:#4c625f;margin:0;max-width:520px}

/* Projects archive (light page) */
body.post-type-archive-project,body.tax-project_type{background-image:linear-gradient(#0d1b210a 1px,transparent 1px),linear-gradient(90deg,#0d1b210a 1px,transparent 1px);background-size:56px 56px;background-position:center top}
body .project-filters{display:flex;flex-wrap:wrap;gap:8px;border:0;padding:0}
body .project-filters a{padding:9px 18px;border-radius:999px;border:1px solid #0d1b2124;font-size:14px;font-weight:500;color:#142c32;background:#ffffffb3;transition:background .2s,border-color .2s}
body .project-filters a:after{display:none}
body .project-filters a:hover{border-color:#0d1b2155}
body .project-filters a[aria-current]{background:var(--ink);border-color:var(--ink);color:#fff}
body .project-number{width:46px;height:46px;display:grid;place-items:center;border-radius:50%;background:#0d1b2166;border:1px solid #ffffff33;backdrop-filter:blur(8px);color:#fff}
body .project-number svg{width:24px;height:24px}
body .project-open{border-radius:50%;background:#0d1b2166;border:1px solid #ffffff33;backdrop-filter:blur(8px)}
body .project-caption h3{font-weight:800}

/* Articles */
body .article-list{gap:22px}
body .article-card{transition:transform .25s ease,border-color .25s ease}
body .article-card:hover{transform:translateY(-3px);border-color:#ffffff2e}
body .article-card h2{font-size:clamp(20px,1.6vw,25px);line-height:1.8;font-weight:800}
body .article-card>p:not(.meta){font-size:15px;line-height:2.1}

/* Contact */
body .contact-information{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-content:start}
body .contact-information>.prose{grid-column:1/-1;margin-bottom:10px}
body .contact-block{padding:20px 22px;border:1px solid #ffffff14;border-radius:var(--radius-m);background:var(--ink-2);margin:0}
body .contact-block h2{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:600;color:#b9c7c2;margin-bottom:8px}
body .contact-block h2:before{content:'';width:18px;height:18px;flex-shrink:0;background:#7fd8b8;-webkit-mask:var(--ico) center/contain no-repeat;mask:var(--ico) center/contain no-repeat}
body .contact-block{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linejoin='round'%3E%3Cpath d='M12 21s-7-6.2-7-11.5a7 7 0 0 1 14 0C19 14.8 12 21 12 21Z'/%3E%3Ccircle cx='12' cy='9.5' r='2.5'/%3E%3C/svg%3E")}
body .contact-block:has(a[href^="tel:"]){--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linejoin='round'%3E%3Cpath d='M6.6 3.5h3l1.5 4-2 1.3a11 11 0 0 0 6.1 6.1l1.3-2 4 1.5v3a2 2 0 0 1-2.2 2A17 17 0 0 1 4.5 5.7a2 2 0 0 1 2.1-2.2Z'/%3E%3C/svg%3E")}
body .contact-block:has(a[href^="mailto:"]){--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='m4 7 8 6 8-6'/%3E%3C/svg%3E")}
body .contact-block:last-child{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E%3Cpath d='M12 7.5V12l3 2'/%3E%3C/svg%3E")}
body .contact-block a,body .contact-block p{font-size:17px;font-weight:600;color:#fff}
body .contact-block:has(a[href^="mailto:"]) a{font-size:15px;word-break:break-all}
body .contact-block p{font-size:15px;font-weight:500;line-height:2}
body .contact-form-panel{border-radius:var(--radius-l);border:1px solid #ffffff17;background:var(--ink-2)}

/* Single article / project */
body .single-hero img,body .entry-hero img,body .post-thumbnail img{border-radius:var(--radius-l)}

@media(max-width:900px){
  body .page-content:has(.service-details){width:calc(100% - 32px);border-radius:24px;padding:28px 18px}
  body .service-details{grid-template-columns:1fr;gap:16px;margin-top:36px}
  body .service-details article{padding:28px 20px}
  body .service-details h2{font-size:clamp(18px,5.2vw,22px)!important}
  body .contact-information{grid-template-columns:1fr}
  body .page-content .intro-grid{padding:24px 20px}
}

/* About: the two statements side by side inside one panel */
body .page-content .intro-grid{grid-template-columns:1fr;gap:18px}
body .page-content .intro-grid .prose{max-width:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:auto auto;grid-auto-flow:column;column-gap:clamp(32px,5vw,80px)}
body .page-content .intro-grid .prose h2{font-size:clamp(22px,1.8vw,28px);line-height:1.7}
body .page-content .intro-grid .prose p{margin-bottom:0}
@media(max-width:900px){body .page-content .intro-grid .prose{grid-template-columns:1fr;grid-auto-flow:row}body .page-content .intro-grid .prose p{margin-bottom:28px}}

/* Single project */
body .single-project-hero{margin-inline:var(--gutter);border-radius:var(--radius-l);overflow:hidden}
body .project-facts{align-self:start;padding:8px 26px;border:1px solid #ffffff14;border-radius:var(--radius-l);background:var(--ink-2)}
body .project-facts>div:last-child{border-bottom:0}
body .gallery-frame,body .gallery-frame img{border-radius:var(--radius-m);overflow:hidden}
body .project-pagination a{padding:22px 26px;border:1px solid #ffffff14;border-radius:var(--radius-l);background:var(--ink-2);transition:border-color .2s}
body .project-pagination a:hover{border-color:#ffffff38}
@media(max-width:900px){body .single-project-hero{margin-inline:16px;border-radius:20px}}

/* Eyebrow labels and meta text: larger and easier to read */
body .eyebrow{font-size:15px;font-weight:500;gap:12px;color:#c3cfca}
body .light-section .eyebrow,body.post-type-archive-project .eyebrow,body.tax-project_type .eyebrow{color:#4c625f}
body .eyebrow>span:not([data-vg-text]){width:8px;height:8px}
body .meta,body .project-caption .meta,body .article-card .meta{font-size:14px}
body .eyebrow.light{color:#e2e8e1}
@media(max-width:900px){body .eyebrow{font-size:14px}}

/* Headings: balanced line breaks, so two-line titles have even lengths */
body h1,body h2,body h3{text-wrap:balance}
body .h-latin{unicode-bidi:isolate}

/* Inner page headings: soft brand-coloured glow instead of flat black */
body .page-heading{isolation:isolate}
body .page-heading:before{content:'';position:absolute;inset:-160px -12vw -40px;z-index:-1;pointer-events:none;background:radial-gradient(45% 65% at 88% 35%,#12c48b24,transparent 70%),radial-gradient(40% 60% at 8% 85%,#4f95ec1f,transparent 70%)}

/* About: light sheet with the two statements as white cards */
body .page-content:has(.intro-grid){background-color:#f1f4f2;background-image:linear-gradient(#0d1b210a 1px,transparent 1px),linear-gradient(90deg,#0d1b210a 1px,transparent 1px);background-size:56px 56px;background-position:center top;border-radius:32px;width:calc(100% - 2 * var(--gutter));padding:clamp(32px,5vw,72px);margin-top:56px;margin-bottom:0}
body .page-content .intro-grid{padding:0;background:none;border:0;border-radius:0;--text:#142c32;--muted:#4c625f}
body .page-content .intro-grid>.eyebrow{color:#4c625f;justify-content:center}
body .page-content .intro-grid .prose{row-gap:0;column-gap:22px}
body .page-content .intro-grid .prose h2,body .page-content .intro-grid .prose p{background:#fff;padding-inline:clamp(24px,3vw,40px);text-align:center}
body .page-content .intro-grid .prose h2{color:var(--ink);margin:0;padding-top:clamp(28px,3vw,40px);padding-bottom:16px;border-radius:var(--radius-l) var(--radius-l) 0 0;position:relative}
body .page-content .intro-grid .prose h2:before{content:'';display:block;width:36px;height:4px;border-radius:4px;margin:0 auto 20px;background:var(--grad);background-size:300% 100%;animation:v2-drift 14s ease-in-out infinite alternate}
body .page-content .intro-grid .prose p{color:#4c625f;padding-bottom:clamp(28px,3vw,40px);border-radius:0 0 var(--radius-l) var(--radius-l);box-shadow:0 22px 48px -30px #0d1b2140}
body.page .contact-cta{padding-top:90px}
@media(max-width:900px){
  body .page-content:has(.intro-grid){width:calc(100% - 32px);border-radius:24px;padding:28px 16px;margin-top:32px}
  body .page-content .intro-grid .prose p{margin-bottom:16px}
}

/* Footer: deep gradient with soft brand glows */
body .site-footer{background-color:#0a161b;background-image:radial-gradient(60% 90% at 92% 0%,#12c48b33,transparent 70%),radial-gradient(55% 100% at 5% 100%,#4f95ec2e,transparent 70%),linear-gradient(180deg,#0f2128 0%,#071014 100%)}

/* Projects archive: dark heading band with brand glow, then the light grid with white project cards */
body.post-type-archive-project .page-heading,body.tax-project_type .page-heading,body.tax-project_status .page-heading{--text:#eef3ef;--muted:#b9c7c2;color:var(--text);box-shadow:0 0 0 100vmax var(--ink);clip-path:inset(-300px -100vmax 0);background:var(--ink);margin-bottom:64px}
body.post-type-archive-project .page-heading h1,body.tax-project_type .page-heading h1,body.tax-project_status .page-heading h1{color:#fff}
body.post-type-archive-project .page-heading .eyebrow,body.tax-project_type .page-heading .eyebrow,body.tax-project_status .page-heading .eyebrow{color:#c3cfca}
body.post-type-archive-project .page-heading-row>p,body.tax-project_type .page-heading-row>p,body.tax-project_status .page-heading-row>p{color:#c3cfca}
body .archive-ribbon .project-item{padding:10px 10px 4px;border-radius:calc(var(--radius-l) + 6px);background:#fff;box-shadow:0 1px 0 #0d1b2108,0 22px 48px -30px #0d1b2140;transition:transform .25s ease,box-shadow .25s ease}
body .archive-ribbon .project-item:hover{transform:translateY(-3px);box-shadow:0 26px 50px -30px #0d1b2155}
body .archive-ribbon .project-caption{padding:18px 16px 16px}
body .archive-ribbon .project-caption h3{color:var(--ink)}
@media(max-width:900px){body.post-type-archive-project .page-heading,body.tax-project_type .page-heading,body.tax-project_status .page-heading{margin-bottom:36px}}

/* Paragraphs: no lonely words on the last line; short intro texts get evenly balanced lines */
body p{text-wrap:pretty}
body .footer-top>p,body .page-heading-row>p,body .hero-description,body .contact-cta p,body .service-details p,body .services-list p,body .article-card>p:not(.meta){text-wrap:balance}

/* Footer tagline sits next to the logo, separated by a thin divider */
body .footer-top{display:flex;justify-content:flex-start;align-items:center;gap:36px}
body .footer-top>p{margin:0;max-width:440px;padding-inline-start:36px;border-inline-start:1px solid #ffffff24}
@media(max-width:900px){body .footer-top{flex-direction:column;align-items:flex-start;gap:20px}body .footer-top>p{padding-inline-start:0;border:0}}

/* Footer: logo + tagline become the first column of the footer grid */
body .footer-grid{grid-template-columns:1.25fr 1.1fr 1.15fr .9fr 1fr;border-top:0;padding-top:8px}
body .footer-brand .brand{display:inline-flex;margin-bottom:20px}
body .footer-brand p{max-width:300px;font-size:15px;line-height:2.1;color:#c3cfca;text-wrap:balance}
@media(max-width:1100px){body .footer-grid{grid-template-columns:1fr 1fr}body .footer-brand{grid-column:1/-1}}
@media(max-width:900px){body .footer-grid{grid-template-columns:1fr}}
body .footer-grid{grid-template-columns:1.2fr 1fr 1.35fr .8fr .9fr;column-gap:36px}
body .contact-detail[href^="mailto:"]{white-space:nowrap;overflow-wrap:normal}
@media(max-width:1100px){body .footer-grid{grid-template-columns:1fr 1fr}}
@media(max-width:900px){body .footer-grid{grid-template-columns:1fr}}

/* Footer social links: single-colour icon beside the label */
body .social-links a{gap:8px;padding:8px 16px 8px 14px}
body .social-links .social-ico{width:18px;height:18px;flex-shrink:0;color:#7fd8b8}

/* Footer social buttons: equal size, gentle motion on hover */
body .social-links{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;max-width:320px}
body .social-links a{position:relative;isolation:isolate;justify-content:center;min-height:46px;width:100%;transition:transform .25s ease,background .25s ease,border-color .25s ease,color .25s ease}
body .social-links a:before{content:'';position:absolute;inset:-1px;padding:1.5px;border-radius:inherit;pointer-events:none;background:conic-gradient(from var(--spin),#3fc79a,#6b9be0,transparent 38%,transparent 62%,#3fc79a);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .3s ease;animation:v2-spin 4s linear infinite}
body .social-links a:hover{transform:translateY(-2px);background:#ffffff0d;border-color:transparent;color:#fff}
body .social-links a:hover:before{opacity:1}
body .social-links .social-ico{transition:transform .3s cubic-bezier(.3,1.6,.5,1)}
body .social-links a:hover .social-ico{transform:scale(1.15) rotate(-6deg)}
@media(prefers-reduced-motion:reduce){body .social-links a,body .social-links .social-ico{transition:none}body .social-links a:before{animation:none}}

/* Heading glow fades out softly at the bottom (no visible edge) */
body .page-heading:before{inset:-160px -12vw -120px;-webkit-mask-image:linear-gradient(#000 55%,transparent);mask-image:linear-gradient(#000 55%,transparent)}

/* Services: the Dimplesheet note becomes a white card, like the About statements */
body .page-content:has(.service-details) .prose>h2,body .page-content:has(.service-details) .prose>h2+p{background:#fff;padding-inline:clamp(24px,4vw,56px);margin:0}
body .page-content:has(.service-details) .prose>h2{margin-top:36px;padding-top:clamp(28px,3vw,40px);padding-bottom:14px;border-radius:var(--radius-l) var(--radius-l) 0 0;color:var(--ink)}
body .page-content:has(.service-details) .prose>h2:before{content:'';display:block;width:36px;height:4px;border-radius:4px;margin:0 auto 20px;background:var(--grad);background-size:300% 100%;animation:v2-drift 14s ease-in-out infinite alternate}
body .page-content:has(.service-details) .prose>h2+p{padding-bottom:clamp(28px,3vw,40px);border-radius:0 0 var(--radius-l) var(--radius-l);box-shadow:0 22px 48px -30px #0d1b2140;color:#4c625f}
body .page-content:has(.service-details) .prose>p:first-child{font-size:16px;color:#4c625f;margin-bottom:0}
body .page-content:has(.service-details) .prose>h2+p,body .page-content .intro-grid .prose p{margin-top:-1px}

/* Services: 5–6 cards wrap as 3 per row (home) and 2 per row (services page), last row centred */
body .services-list:has(>article:nth-child(5)){display:flex;flex-wrap:wrap;justify-content:center}
body .services-list:has(>article:nth-child(5))>article{flex:0 1 calc((100% - 2 * 22px) / 3)}
body .service-details{display:flex;flex-wrap:wrap;justify-content:center}
body .service-details>article{flex:0 1 calc((100% - 22px) / 2)}
@media(max-width:999px){body .services-list:has(>article:nth-child(5))>article{flex-basis:calc((100% - 22px) / 2)}}
@media(max-width:900px){body .services-list:has(>article:nth-child(5))>article,body .service-details>article{flex-basis:100%}}

/* Articles archive: light sheet with white article cards (same family as About / Services) */
body .article-archive{--text:#142c32;--muted:#4c625f;--line:#173c3026;color:var(--text);background-color:#f1f4f2;background-image:linear-gradient(#0d1b210a 1px,transparent 1px),linear-gradient(90deg,#0d1b210a 1px,transparent 1px);background-size:56px 56px;background-position:center top;border-radius:32px;width:calc(100% - 2 * var(--gutter));padding:clamp(32px,5vw,72px)}
body .article-archive .article-card{position:relative;overflow:hidden;background:#fff;border:0;border-radius:var(--radius-l);padding:34px 32px 30px;box-shadow:0 1px 0 #0d1b2108,0 22px 48px -30px #0d1b2140;transition:transform .25s ease,box-shadow .25s ease}
body .article-archive .article-card:before{content:'';display:block;width:36px;height:4px;border-radius:4px;margin-bottom:20px;background:var(--grad);background-size:300% 100%;animation:v2-drift 14s ease-in-out infinite alternate}
body .article-archive .article-card:hover{transform:translateY(-3px);box-shadow:0 26px 50px -30px #0d1b2155}
body .article-archive .article-card h2,body .article-archive .article-card h2 a{color:var(--ink)}
body .article-archive .article-card>p:not(.meta){color:#4c625f}
body .article-archive .article-card .meta{color:#6b7f7b}
body .article-archive .article-card .text-link{color:var(--ink);border-bottom-color:#0d1b2124}
@media(max-width:900px){body .article-archive{width:calc(100% - 32px);border-radius:24px;padding:24px 16px}body .article-archive .article-card{padding:26px 22px}}

/* Single article: the text sits on a light reading sheet */
body .article-body{--text:#142c32;--muted:#3f5552;--line:#173c3026;--green:#167451;color:var(--text);background-color:#f1f4f2;background-image:linear-gradient(#0d1b2108 1px,transparent 1px),linear-gradient(90deg,#0d1b2108 1px,transparent 1px);background-size:56px 56px;background-position:center top;border-radius:32px;width:calc(100% - 2 * var(--gutter));padding:clamp(32px,5vw,80px) clamp(24px,6vw,96px)}
body .article-body .prose{margin-inline:auto}
body .article-body .prose h2,body .article-body .prose h3{color:var(--ink)}
body .article-body .prose p,body .article-body .prose li{color:#3f5552}
body .article-body .prose a{color:#167451}
@media(max-width:900px){body .article-body{width:calc(100% - 32px);border-radius:24px;padding:28px 20px}}

/* Contact: light sheet; info as white cards, form stays a dark card for contrast */
body .contact-layout{background-color:#f1f4f2;background-image:linear-gradient(#0d1b210a 1px,transparent 1px),linear-gradient(90deg,#0d1b210a 1px,transparent 1px);background-size:56px 56px;background-position:center top;border-radius:32px;width:calc(100% - 2 * var(--gutter));padding:clamp(32px,5vw,72px)}
body .contact-information{--text:#142c32;--muted:#4c625f;color:var(--text)}
body .contact-information>.prose,body .contact-information>.prose p{color:#3f5552}
body .contact-block{background:#fff;border:0;box-shadow:0 1px 0 #0d1b2108,0 18px 40px -28px #0d1b2140;transition:transform .25s ease,box-shadow .25s ease}
body .contact-block:hover{transform:translateY(-2px);box-shadow:0 22px 44px -28px #0d1b2155}
body .contact-block h2{color:#4c625f}
body .contact-block h2:before{background:#167451}
body .contact-block a,body .contact-block p{color:var(--ink)}
body .contact-form-panel{box-shadow:0 30px 60px -34px #0d1b2199}
@media(max-width:900px){body .contact-layout{width:calc(100% - 32px);border-radius:24px;padding:24px 16px}}
body .contact-layout{gap:clamp(32px,4vw,64px)}
body .contact-block:has(a[href^="mailto:"]){grid-column:1/-1}body .contact-block:has(a[href^="mailto:"]) a{word-break:normal;white-space:nowrap}
body .contact-block:last-child{grid-column:1/-1}

/* Reveal on scroll (added by v2.js; removed after it plays, so hover effects keep their own timing) */
.v2-reveal{opacity:0;transform:translateY(20px);transition:opacity .75s cubic-bezier(.2,.7,.2,1) var(--d,0ms),transform .75s cubic-bezier(.2,.7,.2,1) var(--d,0ms)}
.v2-reveal.is-in{opacity:1;transform:none}
/* Project and editorial images: slow, slight zoom on hover */
body .project-visual>img,body .editorial-image img,body .gallery-frame img{transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
body .project-visual:hover>img,body .editorial-image:hover img,body .gallery-frame:hover img{transform:scale(1.04)}
body .editorial-image{overflow:hidden;border-radius:var(--radius-l)}
/* Menu links and text links: smooth colour change */
body .footer-grid a,body .desktop-nav a,body .text-link{transition:color .25s ease,background .25s ease,background-size .4s ease}

/* Inner page headings: smaller title, larger intro text, so the two sit closer in scale */
body .page-heading h1{font-size:clamp(34px,3.4vw,54px);line-height:1.6}
body .page-heading p:not(.eyebrow){font-size:clamp(16px,1.25vw,19px);line-height:2.05;color:#c3cfca;max-width:640px}
body.post-type-archive-project .page-heading p:not(.eyebrow){color:#c3cfca}
@media(max-width:900px){body .page-heading h1{font-size:clamp(28px,7.4vw,36px)!important}body .page-heading p:not(.eyebrow){font-size:15.5px}}
body .page-heading p:not(.eyebrow),body .contact-intro,body .contact-information>.prose p{text-wrap:balance}

/* Keep the heading glow inside the viewport (no sideways scroll on phones) */
body .page-heading:before{left:0;right:0}
html{overflow-x:clip}

/* Footer, responsive: 5 columns on desktop, 2 on tablet, mixed on phones */
@media(max-width:1100px){
  body .footer-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:40px 32px}
  body .footer-brand{grid-column:1/-1;display:flex;align-items:center;gap:28px}
  body .footer-brand .brand{margin:0;flex-shrink:0}
  body .footer-brand p{margin:0;padding-inline-start:28px;border-inline-start:1px solid #ffffff24;max-width:420px}
}
@media(max-width:600px){
  body .footer-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 20px;padding-block:28px}
  body .footer-brand{flex-direction:column;align-items:flex-start;gap:16px}
  body .footer-brand p{padding:0;border:0}
  body .footer-grid>div:nth-child(2),body .footer-grid>div:nth-child(3){grid-column:1/-1}
  body .footer-grid nav .menu{grid-template-columns:1fr;row-gap:2px}
  body .social-links{grid-template-columns:1fr;max-width:none}
  body .footer-bottom{gap:10px 18px}
}
@media(max-width:600px){
  body .footer-bottom{flex-direction:column;align-items:center;text-align:center;gap:8px}
  body .footer-bottom>span:first-child{flex-basis:auto}
}

/* CTA: title on the right in two lines, button on the left facing it, at every width */
body .contact-cta .cta-row{display:flex;flex-direction:row;justify-content:space-between;align-items:center;gap:24px}
body .contact-cta .cta-row h2{font-size:clamp(24px,4vw,54px);line-height:1.6;white-space:nowrap;margin:0}
body .contact-cta .round-link{flex-shrink:0}
body .contact-cta h2 br:first-of-type{display:inline!important}
body .contact-cta .container>p:last-child{max-width:none;width:100%;text-align:justify;text-align-last:start;text-wrap:wrap;margin-top:22px}
@media(max-width:600px){
  body .contact-cta .cta-row h2{font-size:clamp(21px,6vw,28px)!important}
  body .contact-cta .round-link{width:54px;height:54px;padding:0;justify-content:center;margin:0}
  body .contact-cta .round-link:after{display:none}
}

/* Hero buttons on tablet/phone: natural width, not stretched */
@media(max-width:900px){body .hero-actions{gap:12px}body .hero-actions .btn{flex:0 0 auto;justify-content:center}}

/* Hero title: always two lines, sized to fit every screen */
body .hero h1 br{display:inline!important}
body .hero-copy h1{white-space:nowrap}
@media(max-width:1100px){body .hero-copy h1{font-size:clamp(30px,5.2vw,58px)}}
@media(max-width:600px){body .hero-copy h1{font-size:clamp(28px,8.4vw,44px)!important}}

/* Footer, tablet: brand centred on top, then links | contacts | address | social in one row */
@media(max-width:1100px){
  body .footer-grid{grid-template-columns:.7fr 1.35fr 1fr .8fr;grid-template-areas:"brand brand brand brand" "links contacts address social";gap:28px 20px;padding-top:0;align-items:start}
  body .footer-brand{grid-area:brand;display:flex;flex-direction:row;align-items:center;justify-content:center;gap:24px;padding-bottom:24px;border-bottom:1px solid #ffffff14}
  body .footer-brand .brand{margin:0;flex-shrink:0}
  body .footer-brand p{margin:0;padding:0;padding-inline-start:24px;border:0;border-inline-start:1px solid #ffffff24;max-width:340px;font-size:14.5px;line-height:2}
  body .footer-grid>nav{grid-area:links}
  body .footer-grid>div:nth-child(3){grid-area:contacts}
  body .footer-grid>div:nth-child(2){grid-area:address}
  body .footer-grid>div:nth-child(5){grid-area:social}
  body .footer-grid nav .menu{display:grid;grid-template-columns:1fr;row-gap:0}
  body .footer-label,body .footer-grid nav:before{font-size:14px!important;margin-bottom:10px}
  body .footer-grid p,body .footer-grid a{font-size:14px!important;line-height:1.9}
  body .contact-detail{gap:8px}
  body .social-links{grid-template-columns:1fr;max-width:none;gap:8px}
  body .social-links a{min-height:40px;padding-inline:10px;font-size:13.5px!important}
}
/* Footer, phone: brand on top, then a 2 x 2 grid */
@media(max-width:600px){
  body .footer-grid{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);grid-template-areas:"brand brand" "links contacts" "social address";gap:24px 16px}
  body .footer-brand{flex-direction:column;gap:12px;text-align:center}
  body .footer-brand p{padding:0;border:0;text-wrap:balance}
  body .footer-grid p,body .footer-grid a{font-size:13.5px!important}
  body .contact-detail[href^="mailto:"]{font-size:12.5px!important}
}

@media(max-width:600px){
  body .footer-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-areas:"brand brand" "contacts contacts" "links address" "social social"}
  body .contact-detail[href^="mailto:"]{font-size:13.5px!important}
  body .social-links{display:flex;flex-wrap:wrap;gap:10px}
  body .social-links a{width:auto;flex:1 1 0}
}
@media(max-width:600px){body .footer-grid>div:nth-child(3){grid-area:contacts}body .footer-grid>div:nth-child(2){grid-area:address}body .footer-grid>nav{grid-area:links}body .footer-grid>div:nth-child(5){grid-area:social}}
/* Quick links column sits a little apart from the other three on tablet */
@media(min-width:601px) and (max-width:1100px){body .footer-grid{grid-template-columns:.85fr 1.35fr 1fr .8fr}body .footer-grid>nav{margin-inline-end:24px}body .footer-grid nav:before{white-space:nowrap}}
@media(min-width:601px) and (max-width:820px){body .footer-grid{grid-template-columns:.8fr 1.6fr .9fr .7fr}}
@media(min-width:601px) and (max-width:820px){body .contact-detail[href^="mailto:"]{font-size:12.5px!important;gap:6px}}
@media(min-width:601px) and (max-width:680px){body .footer-grid{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-areas:"brand brand brand" "links contacts contacts" "links address social"}body .footer-grid>nav{margin-inline-end:0}body .contact-detail[href^="mailto:"]{font-size:14px!important}}

/* Footer headings: a small glowing gradient dot instead of the dash */
body .footer-grid nav:before{content:none!important;display:none!important}
body .footer-label:before{width:9px;height:9px;border-radius:50%;background:var(--grad);background-size:400% 100%;box-shadow:0 0 10px #3fc79a59;animation:v2-drift 6s ease-in-out infinite alternate,v2-dot 3.2s ease-in-out infinite}
@keyframes v2-dot{0%,100%{transform:scale(1);box-shadow:0 0 6px #3fc79a40}50%{transform:scale(1.25);box-shadow:0 0 12px #6b9be070}}
@media(max-width:1100px){body .footer-grid>nav .footer-label{white-space:nowrap}}
@media(prefers-reduced-motion:reduce){body .footer-label:before{animation:none}}

/* Footer logo: a light sweeps across the mark and the wordmark (no movement) */
.brand-mark-wrap{position:relative;display:inline-flex;flex-shrink:0;line-height:0}
body .brand .brand-mark-wrap:after{content:'';position:absolute;inset:0;pointer-events:none;-webkit-mask:var(--logo) center/contain no-repeat;mask:var(--logo) center/contain no-repeat;background:linear-gradient(100deg,transparent 0%,transparent 40%,#ffffffcc 50%,#bff3e0aa 55%,transparent 65%,transparent 100%);background-size:250% 100%;animation:v2-sheen 7s ease-in-out infinite}
body .brand .brand-wordmark strong{background:linear-gradient(100deg,#e9efec 0%,#e9efec 40%,#7fd8b8 50%,#8fb7f0 55%,#e9efec 65%,#e9efec 100%);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:v2-sheen 7s ease-in-out infinite}
@keyframes v2-sheen{0%,20%{background-position:100% 0}60%,100%{background-position:0 0}}
@media(prefers-reduced-motion:reduce){body .brand .brand-mark-wrap:after,body .brand .brand-wordmark strong{animation:none}}

/* Footer, phone: links first (one centred row), then contacts, address, social */
@media(max-width:600px){
  body .footer-grid{grid-template-columns:1fr;grid-template-areas:"brand" "links" "contacts" "address" "social";gap:22px}
  body .footer-grid>nav{padding-bottom:18px;border-bottom:1px solid #ffffff14}
  body .footer-grid nav .menu{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:center;gap:6px 22px}
}

/* Footer, phone: the three phone numbers on one line, separated by thin dividers */
@media(max-width:600px){
  body .footer-grid>div:nth-child(3){display:flex;flex-wrap:wrap;align-items:center}
  body .footer-grid>div:nth-child(3)>.footer-label{flex-basis:100%}
  body .footer-grid>div:nth-child(3)>.contact-detail[href^="tel:"]{flex:0 0 auto;font-size:13.5px!important;gap:6px}
  body .footer-grid>div:nth-child(3)>.contact-detail[href^="tel:"]+.contact-detail[href^="tel:"]{padding-right:10px;margin-right:10px;border-right:1px solid #ffffff2e}
  body .footer-grid>div:nth-child(3)>.contact-detail[href^="tel:"]+.contact-detail[href^="tel:"]:before{display:none}
  body .footer-grid>div:nth-child(3)>.contact-detail[href^="mailto:"]{flex-basis:100%;margin-top:6px}
}
@media(max-width:380px){body .footer-grid>div:nth-child(3)>.contact-detail[href^="tel:"]{font-size:12.5px!important;gap:4px}body .footer-grid>div:nth-child(3)>.contact-detail[href^="tel:"]+.contact-detail[href^="tel:"]{padding-right:7px;margin-right:7px}}
@media(max-width:600px){
  body .footer-grid>div:nth-child(3){column-gap:14px}
  body .footer-grid>div:nth-child(3)>.contact-detail[href^="tel:"]{font-size:13px!important;gap:5px}
  body .footer-grid>div:nth-child(3)>.contact-detail[href^="tel:"]:before{width:14px;height:14px}
  body .footer-grid>div:nth-child(3)>.contact-detail[href^="tel:"]+.contact-detail[href^="tel:"]{padding-right:0;margin-right:0;border-right:0}
  body .footer-grid>div:nth-child(3)>.contact-detail[href^="tel:"]+.contact-detail[href^="tel:"]:before{display:block}
}
@media(max-width:380px){
  body .footer-grid>div:nth-child(3){column-gap:9px}
  body .footer-grid>div:nth-child(3)>.contact-detail[href^="tel:"]{font-size:12px!important;gap:4px}
  body .footer-grid>div:nth-child(3)>.contact-detail[href^="tel:"]+.contact-detail[href^="tel:"]{padding-right:0;margin-right:0}
}
@media(max-width:600px){body .footer-grid>div:nth-child(3)>.contact-detail[href^="mailto:"]{justify-content:center}}
body .footer-brand p br{display:inline!important}

/* Hero stats: number large, unit smaller; on phones the unit drops under the number so nothing touches the border */
.hero-stat strong .stat-num{font-weight:800}
.hero-stat strong .stat-unit{font-size:.72em;font-weight:600;color:#dbe5e0}
@media(max-width:600px){
  .hero-stats{grid-template-columns:.85fr 1.05fr 1.15fr;gap:7px}
  .hero-stat{padding:14px 6px}
  .hero-stat strong{white-space:nowrap;line-height:1.4}
  .hero-stat strong .stat-num{font-size:clamp(13px,3.9vw,17px)}
  .hero-stat strong .stat-unit{font-size:.74em}
  .hero-stat>div>span{font-size:11px}
  body .hero-actions .btn{width:210px;justify-content:center}
}
body .hero-actions .btn{min-width:200px;justify-content:center}

/* Hero stat cards: a slow light travels around each border */
.hero-stat{position:relative;isolation:isolate}
.hero-stat:before{content:'';position:absolute;inset:-1px;padding:1px;border-radius:inherit;pointer-events:none;background:conic-gradient(from var(--spin),transparent 0deg,transparent 250deg,#3fc79a 300deg,#8fb7f0 330deg,transparent 360deg);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:v2-spin 6s linear infinite}
.hero-stat:nth-child(2):before{animation-delay:-2s}
.hero-stat:nth-child(3):before{animation-delay:-4s}
@media(prefers-reduced-motion:reduce){.hero-stat:before{animation:none;opacity:.4}}

/* Hero on phones: content starts right under the header so title, text and buttons are visible without scrolling */
@media(max-width:600px){body .hero-inner{justify-content:flex-start;padding-top:30px;padding-bottom:36px}body .hero .eyebrow{margin-bottom:14px}body .hero-description{margin:16px 0 22px;font-size:14.5px;line-height:2}}

/* Project carousel: a faint white light circles the "next" button */
body .carousel-controls button[data-next]:not(:disabled){position:relative;isolation:isolate}
body .carousel-controls button[data-next]:not(:disabled):before{content:'';position:absolute;inset:-1px;padding:1.5px;border-radius:50%;pointer-events:none;background:conic-gradient(from var(--spin),transparent 0deg,transparent 240deg,#ffffff8c 320deg,transparent 360deg);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:v2-spin 3.5s linear infinite}
body .carousel-progress span{transition:width .45s cubic-bezier(.2,.7,.2,1)}
@media(prefers-reduced-motion:reduce){body .carousel-controls button:before{animation:none}}
