/* ---------- base: tokens, reset, header, nav, buttons, sections, cards,
   blog, contact, footer, kit pages. Recovered 2026-09-01 from the 2026-08-26
   standalone preview after site.css was corrupted. ---------- */
/* jbowmancreative.com on Netlify. Tokens pulled from the Wix theme (Poppins semibold display,
   Helvetica body, JBC blues #005787 / #3D9BE9, orange #ED5829). Plain CSS, no build step. */
:root{
  --navy:#005787; --navy-deep:#14344E; --blue:#3D9BE9; --blue-soft:#BFD5E1; --orange:#ED5829; --red:#ED1C24;
  --ink:#201F20; --ink-2:#4F5B66; --ink-3:#8A96A3; --ground:#FFFFFF; --ground-2:#F3F6F9; --line:#E1E7ED;
  --display:"Poppins",system-ui,sans-serif; --body:"Helvetica Neue",Helvetica,Arial,sans-serif;
  --max:1180px; --gutter:clamp(18px,4vw,40px); --radius:14px;
  --shadow:0 1px 2px rgba(20,52,78,.06),0 14px 34px -22px rgba(20,52,78,.35);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ground);color:var(--ink);font-family:var(--body);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
img,video,iframe{max-width:100%}
img{height:auto;display:block}
a{color:var(--navy)}
h1,h2,h3,h4{font-family:var(--display);font-weight:600;line-height:1.15;margin:0 0 .5em;letter-spacing:-.01em;text-wrap:balance}
h1{font-size:clamp(2rem,4.6vw,3.4rem)}
h2{font-size:clamp(1.55rem,3vw,2.3rem)}
h3{font-size:1.2rem}
h4{font-size:1.05rem}
p{margin:0 0 1em}
p:last-child{margin-bottom:0}
ul,ol{margin:0 0 1em;padding-left:1.3em}
.container{max-width:var(--max);margin:0 auto;padding-left:var(--gutter);padding-right:var(--gutter)}
.narrow{max-width:820px}
.skip{position:absolute;left:-999px;top:8px;background:#fff;padding:8px 12px;z-index:100}
.skip:focus{left:8px}
:focus-visible{outline:3px solid var(--blue);outline-offset:2px}

/* ---------- header ---------- */
.site-header{position:sticky;top:0;z-index:50;background:var(--navy-deep);color:#fff}
.site-header .bar{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:74px}
.logo img{height:44px;width:auto}
.nav{display:none;align-items:center;gap:4px}
.nav>li{position:relative;list-style:none}
.nav a,.nav .parent{display:block;padding:10px 12px;font-family:var(--display);font-weight:600;font-size:.82rem;letter-spacing:.06em;text-transform:uppercase;color:#fff;text-decoration:none;cursor:pointer;background:none;border:0}
.nav a:hover,.nav .parent:hover,.nav a[aria-current="page"]{color:var(--blue)}
.nav .sub{display:none;position:absolute;left:0;top:100%;min-width:250px;background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow);padding:8px 0;margin:0}
.nav .sub li{list-style:none}
.nav .sub a{padding:9px 16px;text-transform:none;letter-spacing:0;font-size:.9rem;font-weight:500;color:var(--ink)}
.nav li:hover>.sub,.nav li:focus-within>.sub{display:block}
.btn{display:inline-block;padding:12px 22px;border-radius:999px;font-family:var(--display);font-weight:600;font-size:.85rem;letter-spacing:.05em;text-transform:uppercase;text-decoration:none;border:2px solid var(--navy);color:var(--navy);background:transparent;transition:background .15s,color .15s;cursor:pointer;line-height:1.2}
.btn:hover{background:var(--navy);color:#fff}
.btn-primary{background:var(--orange);border-color:var(--orange);color:#fff}
.btn-primary:hover{background:#c8451d;border-color:#c8451d;color:#fff}
.btn-light{border-color:#fff;color:#fff}
.btn-light:hover{background:#fff;color:var(--navy)}
.header-cta{display:none}
.menu-toggle{display:inline-flex;align-items:center;gap:8px;background:none;border:0;font-family:var(--display);font-weight:600;font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;padding:8px;color:#fff}
.menu-toggle span.bars{width:22px;height:2px;background:#fff;position:relative;display:inline-block}
.menu-toggle span.bars::before,.menu-toggle span.bars::after{content:"";position:absolute;left:0;width:22px;height:2px;background:#fff}
.menu-toggle span.bars::before{top:-7px}.menu-toggle span.bars::after{top:7px}
.mobile-nav{display:none;border-top:1px solid var(--line);background:#fff}
.mobile-nav.open{display:block}
.mobile-nav ul{list-style:none;margin:0;padding:8px 0}
.mobile-nav a,.mobile-nav summary{display:block;padding:12px var(--gutter);font-family:var(--display);font-weight:600;font-size:.9rem;text-transform:uppercase;letter-spacing:.05em;color:var(--ink);text-decoration:none;cursor:pointer}
.mobile-nav details ul a{text-transform:none;letter-spacing:0;font-weight:500;padding-left:calc(var(--gutter) + 16px)}
.mobile-nav .cta{padding:12px var(--gutter) 16px}
@media(min-width:1024px){.nav{display:flex}.menu-toggle,.mobile-nav{display:none!important}.header-cta{display:inline-block}}

/* ---------- sections ---------- */
.sec{padding:clamp(48px,7vw,96px) 0}
.sec.alt{background:var(--ground-2)}
.sec.dark{background:var(--navy-deep);color:#fff}
.sec.dark a:not(.btn){color:#fff}
.sec.dark h1,.sec.dark h2,.sec.dark h3{color:#fff}
.sec-title{text-transform:uppercase;letter-spacing:.04em}
.eyebrow{font-family:var(--display);font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;color:var(--blue);font-weight:600;margin:0 0 10px}
.hero{position:relative;color:#fff;background:var(--navy-deep);min-height:min(560px,72vh);display:flex;align-items:center;padding:clamp(64px,10vw,140px) 0;overflow:hidden}
.hero .bg{position:absolute;inset:0;background-size:cover;background-position:center;opacity:.55}
.hero .container{position:relative;z-index:1}
.hero h1{color:#fff;text-transform:uppercase;max-width:22ch;overflow-wrap:anywhere}
.hero p{font-size:clamp(1.05rem,1.6vw,1.3rem);max-width:64ch;color:rgba(255,255,255,.92)}
.hero.plain{min-height:0;padding:clamp(40px,6vw,72px) 0}
.hero .btn-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}
.stack>*+*{margin-top:1em}
.lead{font-size:1.15rem;color:var(--ink-2);max-width:66ch}
.centered{text-align:center}
.centered .lead,.centered .stack{margin-left:auto;margin-right:auto}
.cols{display:grid;gap:28px}
@media(min-width:760px){.cols-2{grid-template-columns:1fr 1fr}.cols-3{grid-template-columns:repeat(3,1fr)}.cols-4{grid-template-columns:repeat(4,1fr)}}
.grid{display:grid;gap:22px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.card{background:var(--ground);border:1px solid var(--line);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow)}
.sec.alt .card{background:#fff}
.card h3{text-transform:uppercase;letter-spacing:.03em;font-size:1rem}
.card .role{color:var(--ink-3);font-family:var(--display);font-size:.85rem;text-transform:uppercase;letter-spacing:.05em;margin-top:-6px}
.card img{border-radius:10px;margin-bottom:14px}
.card.link{padding:0;overflow:hidden;text-align:center}
.card.link a{display:block;padding:26px 18px;text-decoration:none;color:var(--ink)}
.card.link a:hover{color:var(--navy)}
.card.link img{width:64px;height:64px;object-fit:contain;margin:0 auto 14px}
.pills{display:flex;flex-wrap:wrap;gap:10px;list-style:none;padding:0;margin:0}
.pills li{background:#fff;border:1px solid var(--line);border-radius:999px;padding:9px 16px;font-family:var(--display);font-weight:600;font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;color:var(--navy)}
.sec.dark .pills li{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.2);color:#fff}
.gallery{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.gallery a,.gallery figure{margin:0;display:block;border-radius:10px;overflow:hidden;background:var(--ground-2)}
.gallery img{width:100%;aspect-ratio:4/3;object-fit:cover;transition:transform .25s}
.gallery a:hover img{transform:scale(1.03)}
.gallery.logos{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));align-items:center}
.gallery.logos img{aspect-ratio:3/2;object-fit:contain;padding:14px;background:#fff}
.quote{font-family:var(--display);font-size:clamp(1.3rem,2.4vw,1.9rem);font-weight:500;line-height:1.35;max-width:30ch;margin:0 auto;text-align:center}
.quote + .cite{text-align:center;color:var(--ink-3);margin-top:14px;font-size:.95rem}
.embed{position:relative;aspect-ratio:16/9;border-radius:12px;overflow:hidden;background:#000}
.embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.videos{display:grid;gap:22px;grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.videos h3{font-size:.95rem;margin:10px 0 0}
.faq details{border-top:1px solid var(--line);padding:14px 0}
.faq details:last-of-type{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;font-family:var(--display);font-weight:600;font-size:1.02rem;list-style:none;display:flex;justify-content:space-between;gap:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--blue);font-weight:600;flex:0 0 auto}
.faq details[open] summary::after{content:"\2013"}
.faq details p{margin:10px 0 0;color:var(--ink-2);max-width:70ch}
.cta-band{background:var(--navy);color:#fff;text-align:center}
.cta-band h2{color:#fff}
.cta-band .btn{margin-top:8px}
.stats{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));margin:0}
.stats div{background:var(--ground-2);border-radius:12px;padding:16px 18px}
.stats dt{font-size:.8rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);font-family:var(--display)}
.stats dd{margin:4px 0 0;font-family:var(--display);font-size:1.6rem;font-weight:600;color:var(--navy);font-variant-numeric:tabular-nums}
.trust-strip{display:flex;flex-wrap:wrap;gap:8px 22px;list-style:none;padding:0;margin:22px 0 0;font-size:.95rem;color:rgba(255,255,255,.9)}
.trust-strip li::before{content:"\2713\00a0";color:var(--blue)}
.service-grid{display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}
.service-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:22px}
.service-card h3{font-size:1rem}
.proof-grid{display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.proof-card{background:var(--ground-2);border-radius:var(--radius);padding:22px}
.process-steps{counter-reset:step;list-style:none;padding:0;display:grid;gap:14px}
.process-steps li{background:var(--ground-2);border-radius:12px;padding:16px 18px 16px 58px;position:relative}
.process-steps li::before{counter-increment:step;content:counter(step);position:absolute;left:18px;top:14px;width:28px;height:28px;border-radius:50%;background:var(--navy);color:#fff;font-family:var(--display);font-weight:600;font-size:.85rem;display:flex;align-items:center;justify-content:center}
.local-facts{list-style:none;padding:0;display:grid;gap:10px}
.local-facts li{background:var(--ground-2);border-radius:10px;padding:12px 16px}
.cta-row{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
address{font-style:normal}

/* ---------- forms ---------- */
.form{display:grid;gap:14px;max-width:640px}
.form label{display:block;font-family:var(--display);font-size:.8rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase;margin-bottom:6px}
.form input,.form textarea,.form select{width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:10px;font:inherit;background:#fff;color:var(--ink)}
.form textarea{min-height:140px;resize:vertical}
.form .row{display:grid;gap:14px}
@media(min-width:640px){.form .row{grid-template-columns:1fr 1fr}}
.form .hidden,.hidden{display:none}
.inline-form{display:flex;flex-wrap:wrap;gap:10px;max-width:560px}
.inline-form input{flex:1 1 240px;padding:12px 14px;border:1px solid var(--line);border-radius:999px;font:inherit}

/* ---------- blog ---------- */
.post-grid{display:grid;gap:24px;grid-template-columns:repeat(auto-fill,minmax(290px,1fr))}
.post-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column}
.post-card img{aspect-ratio:16/9;object-fit:cover;width:100%}
.post-card .body{padding:18px 20px 22px;display:flex;flex-direction:column;gap:8px;flex:1}
.post-card h3{font-size:1.05rem;text-transform:none;letter-spacing:0}
.post-card h3 a{text-decoration:none;color:var(--ink)}
.post-card h3 a:hover{color:var(--navy)}
.post-card .meta{font-size:.85rem;color:var(--ink-3)}
.post-card p{color:var(--ink-2);font-size:.95rem;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.pager{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:34px}
.pager a,.pager span{padding:8px 14px;border-radius:8px;border:1px solid var(--line);text-decoration:none;font-family:var(--display);font-size:.85rem}
.pager span{background:var(--navy);color:#fff;border-color:var(--navy)}
.cat-list{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:0 0 28px}
.cat-list a{display:block;padding:7px 12px;border-radius:999px;border:1px solid var(--line);font-size:.85rem;text-decoration:none;color:var(--ink-2)}
.cat-list a:hover,.cat-list a[aria-current]{background:var(--navy);color:#fff;border-color:var(--navy)}
.post{max-width:780px;margin:0 auto}
.post-header{text-align:center;margin-bottom:28px}
.post-header h1{font-size:clamp(1.8rem,3.6vw,2.6rem);text-transform:none}
.post-header .meta{color:var(--ink-3);font-size:.95rem}
.post .cover img{border-radius:var(--radius);margin:0 0 30px}
.post-body{font-size:1.08rem}
.post-body h2{font-size:1.6rem;margin-top:1.6em}
.post-body h3{font-size:1.25rem;margin-top:1.4em}
.post-body figure{margin:1.6em 0}
.post-body figure img{border-radius:10px}
.post-body figcaption{font-size:.9rem;color:var(--ink-3);margin-top:8px}
.post-body blockquote{border-left:4px solid var(--blue);margin:1.4em 0;padding:4px 0 4px 20px;color:var(--ink-2)}
.post-body a{text-decoration:underline}
.post-footer{margin-top:40px;padding-top:24px;border-top:1px solid var(--line)}
.related h2{font-size:1.3rem}

/* ---------- footer ---------- */
.site-footer{background:var(--navy-deep);color:rgba(255,255,255,.85);padding:56px 0 28px;font-size:.95rem}
.site-footer a{color:#fff;text-decoration:none}
.site-footer a:hover{text-decoration:underline}
.site-footer h4{color:#fff;font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;margin-bottom:14px}
.footer-grid{display:grid;gap:32px}
@media(min-width:760px){.footer-grid{grid-template-columns:1.2fr 1fr 1fr 1.3fr}}
.site-footer ul{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.site-footer .logo img{height:40px;margin-bottom:14px}
.social{display:flex;gap:12px;margin-top:14px}
.social a{display:inline-flex;width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.1);align-items:center;justify-content:center}
.social img{width:18px;height:18px;filter:brightness(0) invert(1)}
.footer-bottom{margin-top:40px;padding-top:18px;border-top:1px solid rgba(255,255,255,.15);display:flex;flex-wrap:wrap;gap:8px 20px;justify-content:space-between;font-size:.85rem;color:rgba(255,255,255,.65)}
.map{border-radius:var(--radius);overflow:hidden;aspect-ratio:16/10}
.map iframe{width:100%;height:100%;border:0}
.reviews-cta{display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:center}
.stars{color:#F5B301;letter-spacing:2px}
@media (prefers-reduced-motion: reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* ---------- kit pages (Nashville landing page, case studies) ---------- */
.kit-page>header.hero{margin:0}
.kit-page>section{max-width:var(--max);margin:0 auto;padding:clamp(36px,5vw,64px) var(--gutter)}
.kit-page>section+section{border-top:1px solid var(--line)}
.kit-page .closing-cta{text-align:center}
.kit-page .closing-cta .cta-row{justify-content:center;margin:18px 0}
.kit-page .lede{font-size:clamp(1.05rem,1.6vw,1.25rem);max-width:66ch}
.kit-page .subtitle{font-family:var(--display);font-size:1.1rem;color:var(--blue-soft);margin:0 0 12px}
.kit-page .client-line{margin-top:22px;color:var(--ink-2)}
.case-study .hero h1{text-transform:none;font-size:clamp(2rem,4.2vw,3rem)}
.case-study .at-a-glance{padding-top:28px}

.social-links{display:flex;gap:10px}.social-links img{width:26px;height:26px;display:inline-block;margin:0;border-radius:0}
.hero .bg video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
@media (prefers-reduced-motion: reduce){.hero .bg video{display:none}}
.tiles{display:grid;gap:22px;grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}
.tile{display:block;text-decoration:none;color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.tile img{width:100%;aspect-ratio:4/5;object-fit:cover;margin:0;border-radius:0}
.tile h3{font-size:1rem;padding:14px 16px;margin:0}
.tile:hover h3{color:var(--navy)}
.tile-grid{display:grid;gap:22px;grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}
.tile-grid .tile img{aspect-ratio:302/368;object-fit:cover}
.tile-grid .tile p{padding:0 16px 16px;margin:0;color:var(--ink-2);font-size:.95rem}
/* kit page heroes are plain block headers, not the flex hero used by scraped pages */
.kit-page>header.hero{display:block;min-height:0;padding:clamp(56px,8vw,110px) 0}
.kit-page>header.hero>*{position:relative;z-index:1;max-width:var(--max);margin-left:auto;margin-right:auto;padding-left:var(--gutter);padding-right:var(--gutter)}
.kit-page>header.hero h1{margin-bottom:16px}
.kit-page>header.hero .cta-row{margin-top:22px}
.hero .btn:not(.btn-primary),.sec.dark .btn:not(.btn-primary),.cta-band .btn:not(.btn-primary){border-color:#fff;color:#fff}
.hero .btn:not(.btn-primary):hover,.sec.dark .btn:not(.btn-primary):hover,.cta-band .btn:not(.btn-primary):hover{background:#fff;color:var(--navy)}

/* ---------- contact page (Wix layout on the 980px grid) ---------- */
.grid980{max-width:calc(980px + 2*var(--gutter))}
.contact-hero{display:block;min-height:328px;padding:104px 0 10px;overflow:visible}
.contact-hero .container{position:relative}
.contact-title{font-size:clamp(48px,5.86vw,100px)!important;line-height:1.2!important;margin:0;max-width:688px;color:#fff}
.contact-arrow{position:absolute;right:calc(var(--gutter) + 1px);top:16px;width:88px;height:88px;display:block;transform:rotate(90deg);transition:transform .2s}
.contact-arrow svg{width:100%;height:100%;fill:#fff}
.contact-arrow:hover{transform:rotate(90deg) scale(1.08)}
.contact-sec{padding:30px 0 49px}
.contact-grid{display:grid;grid-template-columns:1fr 327px;column-gap:111px;align-items:start}
.contact-h{font-size:clamp(18px,1.46vw,25px)!important;font-weight:400!important;line-height:1.3;margin:0 0 13px;color:#fff;letter-spacing:0}
.contact-form{max-width:501px;margin-left:-6px;min-height:703px}
.contact-form label{display:block;color:#fff;font-size:16px;font-weight:400;margin:0 0 6px;text-transform:none;letter-spacing:0}
.contact-form input,.contact-form textarea{display:block;width:100%;padding:0 12px;border:0;border-radius:2px;background:#fff;color:var(--navy);font:inherit;font-size:16px;height:42px}
.contact-form textarea{height:auto;min-height:160px;padding:10px 12px}
.contact-form .row{display:grid;grid-template-columns:1fr 1fr;gap:14px 20px}
.contact-form .form>*+*{margin-top:18px}
.contact-form .btn{display:block;width:max-content;min-width:100px;margin:24px 0 0 auto;padding:0 28px;height:47px;line-height:47px;text-transform:none;letter-spacing:0;font-size:16px}
.book-card{background:#3D9BE9;border-radius:5px;width:327px;text-align:center;padding:35px 0 38px;margin-top:0}
.book-card h3{font-size:clamp(20px,1.76vw,30px)!important;font-weight:400!important;line-height:1.3;color:#fff;min-height:93px;margin:0 0 19px}
.book-card img{display:block;width:146px;height:130px;margin:0 auto 36px}
.book-btn{display:inline-flex;align-items:center;justify-content:center;width:234px;height:65px;padding:0;font-size:14px}
.contact-rule{border:0;border-top:2px solid #fff;margin:23px 0 25px;width:100%}
.contact-rows{list-style:none;margin:0 0 36px;padding:0;max-width:826px}
.contact-rows li{min-height:49px;display:flex;align-items:center}
.contact-rows a,.contact-rows .addr{display:inline-flex;align-items:center;gap:6.5px;color:#fff;text-decoration:none;font-family:var(--display);font-size:20px;letter-spacing:-.06em;line-height:1.3}
.contact-rows a:hover{color:var(--blue)}
.contact-rows svg{width:40px;height:40px;fill:#fff;flex:0 0 40px}
.contact-rows li:last-child{min-height:58px}
.contact-gallery{padding:0 0 57px}
.g-row{display:grid;gap:5px;margin-bottom:5px}
.g-item{margin:0;overflow:hidden;position:relative}
.g-item img{width:100%;height:100%;object-fit:cover;display:block}
@media(max-width:900px){.contact-grid{grid-template-columns:1fr;row-gap:30px}.book-card{width:100%;max-width:327px}.contact-form{margin-left:0;min-height:0}.contact-arrow{display:none}.contact-hero{padding-top:64px}.g-row{grid-template-columns:1fr 1fr!important}}

/* ---------- homepage Testimonials: Google review marquee ---------- */
.testimonials .sec-title{margin-bottom:0}
.reviews-marquee{overflow:hidden;width:100vw;max-width:100vw;margin:36px calc(50% - 50vw) 30px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.reviews-track{display:flex;gap:20px;width:max-content;padding:4px 0;animation:reviews-pan 70s linear infinite}
.reviews-marquee:hover .reviews-track,.reviews-marquee:focus-within .reviews-track{animation-play-state:paused}
@keyframes reviews-pan{from{transform:translateX(0)}to{transform:translateX(calc(-50% - 10px))}}
.review-card{flex:0 0 360px;width:360px;background:#fff;color:var(--navy-deep);border-radius:8px;padding:20px 22px 22px;text-align:left;box-shadow:0 8px 24px -14px rgba(0,0,0,.45);display:flex;flex-direction:column;gap:8px;margin:0}
.review-card .who{display:flex;align-items:center;gap:12px}
.review-card .who img,.review-card .avatar-fallback{width:44px;height:44px;border-radius:50%;object-fit:cover;flex:0 0 44px;background:var(--blue);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:18px}
.review-card .who>div{flex:1 1 auto;min-width:0}
.review-card .name{margin:0;font-weight:600;font-size:15px;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.review-card .name a{color:inherit;text-decoration:none}
.review-card .name a:hover{color:var(--blue)}
.review-card .when{margin:0;font-size:13px;color:#5b6b7a}
.review-card .g-logo{width:22px;height:22px;flex:0 0 22px}
.review-card .stars{margin:0;color:#FBBC04;font-size:18px;letter-spacing:2px;line-height:1}
.review-card .txt{margin:0;font-size:15px;line-height:1.5;display:-webkit-box;-webkit-line-clamp:6;-webkit-box-orient:vertical;overflow:hidden}
.sec.tinted.dark .review-card,.sec.tinted.dark .review-card .name{color:var(--navy-deep)}
.testimonials .lead{margin-top:0}
@media(prefers-reduced-motion:reduce){.reviews-track{animation:none}.reviews-marquee{overflow-x:auto;-webkit-mask-image:none;mask-image:none;padding:0 var(--gutter)}}
@media(max-width:600px){.review-card{flex-basis:290px;width:290px}}

/* Testimonials heading: the same two faded rules that flank the aperture mark (340px each, 2px, same fade), one on each side of the word */
.testimonials .sec-title{display:flex;align-items:center;justify-content:center;gap:20px}
.testimonials .sec-title::before,.testimonials .sec-title::after{content:"";flex:0 1 340px;min-width:0;height:2px;transform:translateY(-2px)}
.testimonials .sec-title::before{background:linear-gradient(to right,transparent,rgba(61,155,233,.75) 53.5%,transparent)}
.testimonials .sec-title::after{background:linear-gradient(to right,transparent,rgba(61,155,233,.75) 46.5%,transparent)}
@media(max-width:600px){.testimonials .sec-title::before,.testimonials .sec-title::after{display:none}}

/* ---------- audit band -> Testimonials: pull the heading up to the site's 67px rhythm; section shrinks by the same amount ---------- */
@media(min-width:1024px){
.services-sec + .sec + .sec{padding-top:34px;padding-bottom:73px}
}
/* Clients We've Worked With: same 73px top/bottom as the navy tile */
@media(min-width:1024px){.services-sec + .sec + .sec + .sec{padding-top:67px;padding-bottom:73px}}
/* bottom CTA band: same 73px visible top/bottom (heading line box carries ~5px above the letters) */
@media(min-width:1024px){.cta-band{padding-top:68px;padding-bottom:73px}}

/* ---------- Our Services block: Wix geometry (263x241 tiles on a 278px pitch, 48px heading, 62px icons) ---------- */
@media(min-width:900px){
.services-sec{padding:64px 0 73px}
.services-heading{font-size:48px;line-height:58px;letter-spacing:.05em;margin:0 0 54px}
.service-tiles{grid-template-columns:repeat(3,263px);gap:14px 15px;max-width:none;justify-content:center}
.service-tiles .tile-service:nth-child(n+4):nth-child(-n+6){margin-top:5px}
.tile-service{width:263px;height:241px;aspect-ratio:auto;border-radius:5px;box-shadow:0 1px 3px rgba(0,0,0,.5);padding:46px 0 0;justify-content:flex-start}
.tile-service svg{width:auto;height:62px;max-width:123px;margin-bottom:21px}
.tile-service .l1,.tile-service .l2{font-size:25px;line-height:1.3;letter-spacing:0}
.tile-service .l1{font-weight:200}
.tile-service .l2{font-weight:600}
}

/* Same edge glow as the Einstein band, on the navy audit + Testimonials tile (two sections, one visual tile):
   top edge on the audit band, bottom edge on the Testimonials section. Revert by deleting this block. */
.services-sec + .sec{background-image:linear-gradient(to bottom,rgba(61,155,233,.42) 0,rgba(61,155,233,.18) 5px,rgba(61,155,233,0) 16px)!important;background-repeat:no-repeat!important}
.services-sec + .sec + .sec{background-image:linear-gradient(to top,rgba(61,155,233,.42) 0,rgba(61,155,233,.18) 5px,rgba(61,155,233,0) 16px)!important;background-repeat:no-repeat!important}
/* bottom CTA band: same edge glow, top and bottom */
.cta-band{background-image:linear-gradient(to bottom,rgba(61,155,233,.42) 0,rgba(61,155,233,.18) 5px,rgba(61,155,233,0) 16px),linear-gradient(to top,rgba(61,155,233,.42) 0,rgba(61,155,233,.18) 5px,rgba(61,155,233,0) 16px)!important;background-repeat:no-repeat!important}

/* review cards: hover pauses the marquee (above) and lifts the card 10% like the client logos; the track gets
   vertical room so the grown card is not clipped by the marquee's overflow, marquee margins shrink by the same amount */
.reviews-track{padding:20px 0}
.reviews-marquee{margin:20px 0 14px}
.review-card{transition:transform .25s ease,box-shadow .25s ease;will-change:transform}
.review-card:hover{transform:scale(1.1);position:relative;z-index:1;box-shadow:0 12px 28px -12px rgba(0,0,0,.45)}
@media(prefers-reduced-motion:reduce){.review-card{transition:none}.review-card:hover{transform:none}}

/* service tiles: same 10% grow on hover as the client logos and review cards (replaces the 3px lift) */
.tile-service{transition:transform .25s ease,box-shadow .25s ease;will-change:transform}
.tile-service:hover{transform:scale(1.1);position:relative;z-index:1;box-shadow:0 12px 28px -12px rgba(0,0,0,.45)}
@media(prefers-reduced-motion:reduce){.tile-service{transition:none}.tile-service:hover{transform:none}}
/* Einstein band "Let's talk ideas" button: same 10% grow on hover */
.hero.tall + .sec .btn-primary{transition:transform .25s ease,box-shadow .25s ease,background .15s,border-color .15s;will-change:transform}
.hero.tall + .sec .btn-primary:hover{transform:scale(1.1);box-shadow:0 12px 28px -12px rgba(0,0,0,.45)}
@media(prefers-reduced-motion:reduce){.hero.tall + .sec .btn-primary{transition:none}.hero.tall + .sec .btn-primary:hover{transform:none}}
/* Testimonials buttons: same 10% grow; the outline button now highlights (soft white tint) instead of filling solid white */
.reviews-cta .btn{transition:transform .25s ease,box-shadow .25s ease,background .15s,border-color .15s,color .15s;will-change:transform}
.reviews-cta .btn:hover{transform:scale(1.1);box-shadow:0 12px 28px -12px rgba(0,0,0,.45)}
.sec.dark .reviews-cta .btn:not(.btn-primary):hover{background:rgba(255,255,255,.16);border-color:#fff;color:#fff}
@media(prefers-reduced-motion:reduce){.reviews-cta .btn{transition:none}.reviews-cta .btn:hover{transform:none}}
/* room for the 1.1x hover: the outline button grows ~16px toward its neighbour */
.reviews-cta{gap:24px}
/* Free SEO Audit "Next" button: same 10% grow */
.audit-form .btn{transition:transform .25s ease,box-shadow .25s ease,background .15s,border-color .15s;will-change:transform}
.audit-form .btn:hover{transform:scale(1.1);box-shadow:0 12px 28px -12px rgba(0,0,0,.45)}
@media(prefers-reduced-motion:reduce){.audit-form .btn{transition:none}.audit-form .btn:hover{transform:none}}
/* bottom CTA band outline button + footer coffee button: same 10% grow; the outline button highlights with the soft tint instead of filling white */
.cta-band .btn,.site-footer .btn-primary{transition:transform .25s ease,box-shadow .25s ease,background .15s,border-color .15s,color .15s;will-change:transform}
.cta-band .btn:hover,.site-footer .btn-primary:hover{transform:scale(1.1);box-shadow:0 12px 28px -12px rgba(0,0,0,.45)}
.sec.cta-band .btn:not(.btn-primary):not(.btn-white-edge):hover{background:rgba(255,255,255,.16);border-color:#fff;color:#fff}
@media(prefers-reduced-motion:reduce){.cta-band .btn,.site-footer .btn-primary{transition:none}.cta-band .btn:hover,.site-footer .btn-primary:hover{transform:none}}
/* footer coffee button: the footer's link-underline hover must not apply to the button */
.site-footer .btn:hover{text-decoration:none}
/* chatbot bubble (#jbc-fab from bubble.js, light DOM): same 10% grow instead of its 2px lift; id chain outranks the widget's own rule */
#jbc-w #jbc-fab{transition:transform .25s ease,box-shadow .25s ease,background .15s;will-change:transform}
#jbc-w #jbc-fab:hover{transform:scale(1.1);box-shadow:0 12px 28px -12px rgba(0,0,0,.45),0 10px 26px rgba(20,40,70,.32)}
@media(prefers-reduced-motion:reduce){#jbc-w #jbc-fab{transition:none}#jbc-w #jbc-fab:hover{transform:none}}
/* header "Give us a quick call" button: same 10% grow */
.site-header .header-cta{transition:transform .25s ease,box-shadow .25s ease,background .15s,border-color .15s;will-change:transform;transform-origin:center}
.site-header .header-cta:hover{transform:scale(1.1);box-shadow:0 12px 28px -12px rgba(0,0,0,.45)}
@media(prefers-reduced-motion:reduce){.site-header .header-cta{transition:none}.site-header .header-cta:hover{transform:none}}

/* ---------- header nav + hero heading: Wix's exact Poppins files (v3.010 latin subsets Wix serves from parastorage;
   its "poppins-extralight 700" face is really Poppins Regular). Google Fonts serves Poppins v4 with slightly different
   outlines/hinting, which read as softer. Also Wix's hero heading carries .05em tracking and its active nav item is #19ADFF. */
@font-face{font-family:"Poppins Wix";font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/poppins-regular-v3.woff2) format("woff2")}
@font-face{font-family:"Poppins Wix";font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/poppins-semibold-v3.woff2) format("woff2")}
@font-face{font-family:"Poppins Wix";font-style:normal;font-weight:200;font-display:swap;src:url(/assets/fonts/poppins-extralight-v3.woff2) format("woff2")}
.nav a,.nav .parent,.nav .sub a{font-family:"Poppins Wix",var(--display);font-weight:400;color:#FFFFFF}
.nav a:hover,.nav .parent:hover,.nav a[aria-current="page"],.nav .sub a:hover{color:#19ADFF}
.hero.tall h1{font-family:"Poppins Wix",var(--display);font-weight:600;letter-spacing:.05em}

/* ---------- google ads page (Wix layout; data in content/google-ads.json) ---------- */
.ga-hero{position:relative;background:#005787;color:#fff;overflow:hidden;height:1196px}
.ga-hero-bg{position:absolute;inset:0;background-size:cover;background-position:left center;background-repeat:no-repeat;opacity:.35}
.ga-title{position:relative;margin:0;padding-top:286px;text-align:center;font-family:"Poppins Wix",var(--display);font-weight:600;font-size:100px;line-height:1.2;letter-spacing:.05em;color:#fff;white-space:nowrap}
.ga-chevron{position:relative;display:flex;align-items:center;justify-content:center;width:110px;height:110px;margin:13px auto 0;color:#fff}
.ga-chevron svg{width:72px;height:72px;transform:rotate(-90deg)}
.ga-chevron svg,.ga-chevron svg *{fill:currentColor}
.ga-hero-grad{position:absolute;left:0;right:0;top:598px;bottom:0;background:linear-gradient(0deg,#005787 37.5%,rgba(0,0,0,0) 100%)}
.ga-intro{margin:166px auto 0;width:832px;max-width:calc(100% - 2*var(--gutter));text-align:center;font-family:"Poppins Wix",var(--display);font-weight:200;font-size:25px!important;line-height:35px!important;color:#fff}
.ga-intro p{margin:0 0 24px;font-size:inherit;line-height:inherit}
.ga-peach{color:#F3A78F}
.ga-sky{color:#98C8F0}
.ga-blue{color:#3D9BE9}
.ga-blue2{color:#19ADFF}
.ga-orange{color:#ED5829}
.ga-h2{margin:0;padding-top:78px;text-align:center;font-family:"Poppins Wix",var(--display);font-weight:600;font-size:60px;line-height:1.25;letter-spacing:0;text-wrap:wrap;color:#005787}
.ga-pricing{background:#fff;padding-bottom:1px;scroll-margin-top:104px}
.ga-pricing-sub{margin:0 0 30px;text-align:center;font-family:"Poppins Wix",var(--display);font-weight:200;font-size:40px;line-height:1.4;color:#005787}
.ga-tiers{display:flex;justify-content:center;gap:7px;margin:16px auto 39px;padding:0 8px;flex-wrap:wrap}
.ga-tier{position:relative;flex:0 1 319px;min-width:264px;min-height:890px;background:#BFD5E1;box-sizing:border-box;padding:44px 4px 10px;text-align:center;overflow:hidden}
.ga-ribbon{position:absolute;top:1px;left:0;width:60px;height:60px;transform:rotate(90deg)}
.ga-ribbon svg{display:block;width:60px;height:60px}
.ga-ribbon svg *{fill:#005787}
.ga-price{margin:0 0 1px;font-family:Futura,futura-lt-w01-book,"Century Gothic",var(--display);font-size:40px;line-height:normal;letter-spacing:.05em;color:#005787}
.ga-per{margin:0 0 14px;font-family:Futura,futura-lt-w01-book,"Century Gothic",var(--display);font-size:20px;line-height:1;color:#282626}
.ga-feats{max-width:311px;margin:0 auto;font-family:Futura,futura-lt-w01-book,"Century Gothic",var(--display);font-size:15px;line-height:1.75;color:#282626}
.ga-feats p{margin:0 0 12px;font-size:inherit;line-height:inherit}
.ga-cta{margin:0;text-align:center;padding-bottom:68px}
.ga-cta-tight{padding-bottom:68px}
.ga-btn{display:inline-flex;align-items:center;justify-content:center;min-width:510px;height:51px;box-sizing:border-box;padding:0 24px;border-radius:5px;font-family:"Work Sans",var(--display);font-weight:700;font-size:15px;letter-spacing:0;text-transform:uppercase;transition:transform .25s ease,box-shadow .25s ease,background .15s,border-color .15s;will-change:transform}
.ga-btn:hover{transform:scale(1.1);box-shadow:0 12px 28px -12px rgba(0,0,0,.45)}
@media(prefers-reduced-motion:reduce){.ga-btn{transition:none}.ga-btn:hover{transform:none}}
.ga-band{background:#005787;color:#fff;text-align:center}
.ga-band h2{margin:0;font-family:var(--display);font-weight:400;font-size:56px;line-height:1.5;letter-spacing:0;text-wrap:wrap;color:#fff}
.ga-band-why h2{padding:36px 0}
.ga-band-case h2{padding:22px 0 23px}
.ga-why{background:#fff}
.ga-why-grid{display:grid;grid-template-columns:460px 1px 460px;column-gap:24px;justify-content:center;padding-top:40px}
.ga-why-divider{background:#3D9BE9;min-height:791px}
.ga-feature{text-align:center;margin:0 auto 24px;max-width:430px}
.ga-feature img{display:inline-block;margin:0 0 24px}
.ga-feature h3{margin:0 0 6px;font-family:var(--body);font-weight:400;font-size:28px;line-height:1.4;letter-spacing:0;text-wrap:wrap;color:#3D9BE9}
.ga-feature-body{font-family:var(--body);font-size:17px;line-height:1.6;color:#000}
.ga-feature-body p{margin:0 0 10px;font-size:inherit;line-height:inherit}
.ga-feature-body ul{display:inline-block;text-align:left;margin:4px auto 10px;padding-left:22px}
.ga-feature-body li{margin:0 0 4px}
.ga-why .ga-cta{padding:6px 0 48px}
.ga-case{background:#fff}
.ga-case-wrap{width:923px;max-width:calc(100% - 2*var(--gutter));margin:0 auto;padding:28px 0 45px}
.ga-stats{display:flex;align-items:center;border:1px solid #3D9BE9;padding:20px 25px;gap:0;margin-bottom:15px}
.ga-stats-logo{display:block;width:131px;height:130px;margin-right:30px}
.ga-stat{flex:1;text-align:center;border-left:1px solid #80ABC3;padding:6px 10px;align-self:stretch;display:flex;flex-direction:column;justify-content:center}
.ga-stat-label{margin:0;font-family:var(--body);font-size:16px;line-height:1.4;color:#19ADFF}
.ga-stat-big{margin:2px 0 0;font-family:"Poppins Wix",var(--display);font-weight:200;font-size:60px;line-height:1.1;color:#19ADFF}
.ga-challenge{display:grid;grid-template-columns:165px 1fr;align-items:center;background:#98C8F0;padding:30px 28px 38px 30px;margin-bottom:26px}
.ga-challenge-label{margin:0;font-family:var(--display);font-weight:500;font-size:22px;color:#fff}
.ga-challenge-body{font-family:var(--body);font-size:15px;line-height:1.6;color:#000;max-width:700px}
.ga-challenge-body p{margin:0;font-size:inherit;line-height:inherit}
.ga-bar{background:#005787;color:#fff;text-align:center;font-family:var(--display);font-weight:400;font-size:22px;line-height:1.4;padding:12px 20px 7px;margin-bottom:26px}
.ga-split{display:grid;grid-template-columns:468px 1fr;column-gap:20px;align-items:start;margin-bottom:38px}
.ga-split-rev{grid-template-columns:441px 1fr;margin-bottom:35px}
.ga-split img{max-width:100%;height:auto;justify-self:end}
.ga-split-rev img{justify-self:start}
.ga-img-chart{margin-top:62px}
.ga-case-text{font-family:var(--body);font-size:15px;line-height:1.75;color:#000}
.ga-case-text p{margin:0 0 18px;font-size:inherit;line-height:inherit}
.ga-case-text>p:first-child{font-family:var(--body);font-size:22px;line-height:1.4;color:#3D9BE9;margin-bottom:12px}
.ga-steps{list-style:none;margin:12px 0 0;padding:0}
.ga-steps li{position:relative;display:grid;grid-template-columns:77px 60px 1fr;align-items:start;padding:36px 0 48px;border-bottom:3px solid #1D67CD;max-width:860px;margin:0 auto}
.ga-step-num{font-family:"Poppins Wix",var(--display);font-weight:600;font-size:40px;line-height:1;text-align:right;color:#005787}
.ga-step-chev{display:block;width:26px;height:42px;margin:0 auto}
.ga-step-chev svg{display:block;width:42px;height:26px;transform:rotate(270deg);transform-origin:21px 21px}
.ga-steps p{margin:6px 0 0;font-family:var(--body);font-size:22px;line-height:1.5;color:#0B2F5B;max-width:573px}
.ga-testimonials{position:relative}
.ga-testimonials::before{content:"";position:absolute;inset:0;background:url(/assets/media/26b3a4_da4a2313832a41d686dfe0836bfd8dc5.png) center/cover no-repeat;opacity:.1;pointer-events:none}
.ga-testimonials>*{position:relative}
@media(min-width:1400px){.ga-tiers{flex-wrap:nowrap}}
@media(max-width:1100px){
.ga-hero{height:auto;padding-bottom:48px}
.ga-title{padding-top:150px;font-size:clamp(34px,9vw,90px);white-space:normal}
.ga-chevron{display:none}
.ga-hero-grad{position:static;background:none}
.ga-intro{position:relative;z-index:1;margin:70px auto 0;font-size:clamp(18px,2.4vw,25px)!important;line-height:1.5!important}
.ga-h2{padding-top:56px;font-size:clamp(34px,5.5vw,60px)}
.ga-pricing-sub{font-size:clamp(22px,3.6vw,40px)}
.ga-tier{min-height:0;padding-bottom:28px}
.ga-btn{min-width:0;width:auto;max-width:100%;height:auto;padding:14px 20px}
.ga-band h2{font-size:clamp(30px,5.1vw,56px)}
.ga-why-grid{grid-template-columns:1fr;padding:32px var(--gutter) 0}
.ga-why-divider{display:none}
.ga-stats{flex-wrap:wrap;gap:14px;justify-content:center}
.ga-stat{border-left:0;flex:1 1 40%}
.ga-challenge{grid-template-columns:1fr;row-gap:10px}
.ga-split,.ga-split-rev{grid-template-columns:1fr;row-gap:16px}
.ga-split img,.ga-split-rev img{justify-self:center}
.ga-img-chart{margin-top:0}
.ga-steps li{grid-template-columns:52px 40px 1fr;padding:22px 0 20px}
.ga-step-num{font-size:28px}
.ga-steps p{font-size:17px;margin-top:2px}
}

/* ---------- website design page (Wix layout; shares the vp-* pieces) ---------- */
.wd-title{font-size:clamp(48px,7.32vw,125px)!important;white-space:normal!important;line-height:1.15!important}
.wd-intro{margin-top:140px}
.wd-intro p{font-size:clamp(17px,1.46vw,25px)}
.wd-portfolio{scroll-margin-top:104px}
.wd-portfolio .container{max-width:calc(1320px + 2*var(--gutter))}
.wd-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:92px 40px;justify-items:center}
.wd-card{text-align:center;max-width:300px}
.wd-card-img{display:block}
.wd-card-img img{display:block;width:250px;max-width:100%;height:auto;margin:0 auto;transition:transform .25s}
.wd-card-img:hover img{transform:translateY(-4px)}
.wd-card h3{margin:24px 0 0;font-family:var(--display);font-weight:600;font-size:16px;letter-spacing:.03em;text-transform:uppercase;color:var(--blue)}
.wd-url{margin:6px 0 0;font-size:13px;color:#7a7a7a;letter-spacing:.01em}
.wd-go{display:inline-block;margin-top:14px;background:var(--orange);color:#fff;font-family:var(--display);font-weight:700;font-size:12px;letter-spacing:.04em;text-transform:uppercase;padding:12px 16px;border-radius:3px;text-decoration:none;transition:background .15s}
.wd-go:hover{background:#c8451d;color:#fff}
.wd-quote-tint{background:rgba(0,87,135,.65)}
.wd-icons .container{max-width:calc(1251px + 2*var(--gutter))}
.wd-grid-3{grid-template-columns:repeat(3,1fr);max-width:960px;margin:0 auto}
.wd-grid-4{grid-template-columns:repeat(4,1fr);margin-top:80px}
@media(max-width:1100px){.wd-grid{grid-template-columns:repeat(2,1fr);gap:60px 24px}}
@media(max-width:760px){.wd-grid{grid-template-columns:1fr}.wd-grid-3,.wd-grid-4{grid-template-columns:repeat(2,1fr)}.wd-grid-4{margin-top:40px}.wd-intro{margin-top:80px}}

/* ---------- video production page (Wix layout) ---------- */
@font-face{font-family:"Marck Script";src:url(/assets/fonts/marck-script.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
.vp-hero{position:relative;background:rgb(0,87,135) center/cover no-repeat;color:#fff;padding:180px 0 163px;overflow:hidden}
.vp-hero-tint{position:absolute;inset:0;background:rgba(0,87,135,.45)}
.vp-hero .container{position:relative;z-index:1;text-align:center}
.vp-title{font-size:clamp(44px,5.86vw,100px)!important;line-height:1.2!important;margin:0;color:#fff;letter-spacing:.02em}
.vp-chevron{display:block;width:110px;height:110px;margin:30px auto 0;transform:rotate(270deg);transition:transform .2s}
.vp-chevron svg{width:100px;height:100px;fill:#fff;display:block;margin:5px}
.vp-chevron:hover{transform:rotate(270deg) translateX(6px)}
.vp-intro{max-width:886px;margin:286px auto 0;scroll-margin-top:120px}
.vp-intro p{font-size:clamp(17px,1.41vw,24px);line-height:1.4;font-weight:300;margin:0}
.vp-intro p+p{margin-top:34px}
.vp-portfolio{scroll-margin-top:104px}
.vp-portfolio{background:#fff;padding:70px 0 85px}
.vp-portfolio .container{max-width:calc(1560px + 2*var(--gutter))}
.vp-h2{text-align:center;color:var(--navy);font-size:clamp(34px,3.69vw,63px)!important;font-weight:600;letter-spacing:.02em;margin:0 0 56px;line-height:1.2}
.vp-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:40px}
.vp-tile{position:relative;display:block;aspect-ratio:328/185;overflow:hidden;background:#000}
.vp-tile img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s}
.vp-tile:hover img{transform:scale(1.04)}
.vp-play{position:absolute;left:50%;top:50%;width:0;height:0;border-left:26px solid #fff;border-top:16px solid transparent;border-bottom:16px solid transparent;transform:translate(-40%,-50%);filter:drop-shadow(0 2px 6px rgba(0,0,0,.5))}
.vp-tile.is-hidden{display:none}
.vp-load-more{margin-top:80px;background:#fff;border:1px solid var(--navy);color:var(--navy);font:inherit;font-size:13px;padding:6px 20px;cursor:pointer;border-radius:0}
.vp-load-more:hover{background:var(--navy);color:#fff}
.vp-load-more.is-done{display:none}
.vp-quote{position:relative;min-height:388px;display:flex;align-items:center;background:rgb(0,87,135) center/cover no-repeat;color:#fff;text-align:center;overflow:hidden}
.vp-quote-tint{position:absolute;inset:0;background:rgba(0,87,135,.35)}
.vp-quote .container{position:relative;z-index:1}
.vp-quote-text{font-size:clamp(20px,1.76vw,30px);font-weight:300;line-height:1.4;margin:0 0 14px}
.vp-quote-by{font-family:"Marck Script",cursive;font-size:26px;margin:0}
.vp-icons{background:#fff;padding:84px 0 85px}
.vp-icons .container{max-width:calc(1251px + 2*var(--gutter))}
.vp-boxed{text-align:center;line-height:1.7;margin:0 0 66px;font-weight:400}
.vp-boxed .box{display:inline-block;background:var(--navy);color:#fff;padding:0 .35em;font-family:var(--display);font-weight:400;font-size:clamp(30px,3.52vw,60px);line-height:1.4}
.vp-boxed .plain{display:inline-block;color:var(--navy);font-size:clamp(30px,3.52vw,60px);line-height:1.4}
.vp-icon-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:80px 24px;justify-items:center}
.vp-icon{text-align:center;max-width:240px}
.vp-icon-art{display:block;width:120px;height:120px;margin:0 auto 20px}
.vp-icon-art svg{width:100%;height:100%;display:block}
.vp-icon p{margin:0;font-size:17px;font-family:var(--display);font-weight:400;color:#1a1a1a;letter-spacing:.02em;line-height:1.35;text-transform:uppercase}
.vp-rule{border:0;border-top:1px solid rgba(61,155,233,.75);margin:0}
.vp-other{position:relative;background:rgb(0,87,135) center/cover no-repeat;color:#fff;padding:70px 15px 55px;overflow:hidden}
.vp-other-tint{position:absolute;inset:0;background:rgba(0,87,135,.9)}
.vp-other .container{position:relative;z-index:1;max-width:none;padding:0}
.vp-other-h{text-align:center;font-family:var(--display);font-weight:300;font-size:clamp(22px,1.76vw,30px);letter-spacing:.02em;margin:0 0 30px;color:#fff}
.vp-other-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:15px}
.vp-other-box{position:relative;display:flex;align-items:center;justify-content:center;height:149px;border:1px solid rgba(61,155,233,.8);color:#fff;text-decoration:none;font-family:var(--display);font-weight:400;font-size:16px;letter-spacing:.04em;text-transform:uppercase;background-size:cover;background-position:center;overflow:hidden;transition:transform .2s}
.vp-other-box::before{content:"";position:absolute;inset:0;background:rgb(0,87,135);opacity:.92;transition:opacity .25s}
.vp-other-box span{position:relative;z-index:1;text-shadow:0 1px 3px rgba(0,0,0,.4)}
.vp-other-box:hover::before{opacity:.55}
.vp-other-box:hover{transform:translateY(-2px)}
/* lightbox for the portfolio videos */
.vp-lightbox{position:fixed;inset:0;z-index:1000;background:rgba(5,20,35,.92);display:flex;align-items:center;justify-content:center;padding:24px}
.vp-lightbox iframe{width:min(1120px,100%);aspect-ratio:16/9;border:0;box-shadow:0 20px 60px rgba(0,0,0,.6);background:#000}
.vp-lightbox button{position:absolute;top:18px;right:22px;background:none;border:0;color:#fff;font-size:40px;line-height:1;cursor:pointer}
@media(max-width:1100px){.vp-grid{grid-template-columns:repeat(3,1fr);gap:24px}.vp-icon-grid{gap:56px 16px}.vp-other-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:760px){.vp-hero{padding:96px 0 80px}.vp-intro{margin-top:80px}.vp-chevron{width:70px;height:70px}.vp-chevron svg{width:60px;height:60px}.vp-grid{grid-template-columns:repeat(2,1fr);gap:14px}.vp-icon-grid{grid-template-columns:repeat(2,1fr);gap:40px 12px}.vp-icon-art{width:88px;height:88px}.vp-other-grid{grid-template-columns:1fr 1fr}.vp-boxed{line-height:1.5}}

/* graphic design portfolio: Wix collage geometry (percent positions inside a fixed-ratio box), batch reveal */
.gd-gallery{max-height:none;padding:0;overflow:hidden;transition:max-height .5s ease}
.gd-gallery.is-clipped{max-height:var(--gd-clip,1198px)}
.gd-collage{position:relative;width:100%}
.gd-tile{position:absolute;margin:0;overflow:hidden;border-radius:3px;background:#eee;transition:transform .25s ease,box-shadow .25s ease;will-change:transform}
.gd-tile img{display:block;width:100%;height:100%;object-fit:cover}
.gd-tile:hover{transform:scale(1.1);z-index:2;box-shadow:0 12px 28px -12px rgba(0,0,0,.45)}
@media(prefers-reduced-motion:reduce){.gd-tile{transition:none}.gd-tile:hover{transform:none}}
@media(max-width:1100px){.gd-gallery{margin:0 var(--gutter)}}

/* ---------- graphic design page (Wix layout; data in content/graphic-design.json) ---------- */
.gd-hero{position:relative;background:#005787;color:#fff;overflow:hidden;height:1392px}
.gd-hero-bg{position:absolute;inset:0;background-size:cover;background-position:center;background-repeat:no-repeat;opacity:.5}
.gd-title{position:relative;margin:0;padding-top:246px;text-align:center;font-family:"Poppins Wix",var(--display);font-weight:600;font-size:110px;line-height:1.2;letter-spacing:.05em;color:#fff;white-space:nowrap}
.gd-chevron{margin-top:20px}
.gd-hero-grad{position:absolute;left:0;right:0;top:503px;bottom:0;background:linear-gradient(0deg,#005787 37.5%,rgba(0,0,0,0) 100%)}
.gd-intro{margin:349px auto 0;width:887px;max-width:calc(100% - 2*var(--gutter));text-align:center;font-family:"Poppins Wix",var(--display);font-weight:200;font-size:25px!important;line-height:35px!important;color:#fff}
.gd-intro p{margin:0 0 24px;font-size:inherit;line-height:inherit}
.gd-portfolio{background:#fff;scroll-margin-top:104px;padding-bottom:88px}
.gd-h2{margin:0;padding:66px 0 67px;text-align:center;font-family:var(--display);font-weight:500;font-size:60px;line-height:1;letter-spacing:0;text-wrap:wrap;color:#005787}
.gd-gallery{margin:0 40px;max-height:1084px;overflow:hidden;position:relative;border-radius:5px;padding:12px;box-sizing:border-box}
.gd-gallery.is-open{max-height:none}
.gd-flow{gap:20px}
.gd-flow .g-item{margin:0;overflow:hidden;position:relative;background:#eee;border-radius:3px;transition:transform .25s ease,box-shadow .25s ease;will-change:transform}
.gd-flow .g-item:hover{transform:scale(1.1);z-index:2;box-shadow:0 12px 28px -12px rgba(0,0,0,.45)}
@media(prefers-reduced-motion:reduce){.gd-flow .g-item{transition:none}.gd-flow .g-item:hover{transform:none}}
.gd-flow .g-item img{display:block;width:100%;height:100%;object-fit:cover}
.gd-more-row{margin:66px 0 0;text-align:center}
.gd-more{display:inline-flex;align-items:center;justify-content:center;height:36px;padding:0 28px;border-radius:5px;font-family:"Work Sans",var(--display);font-weight:700;font-size:13px;letter-spacing:0;text-transform:uppercase;cursor:pointer;transition:transform .25s ease,box-shadow .25s ease,background .15s,border-color .15s;will-change:transform}
.gd-more:hover{transform:scale(1.1);box-shadow:0 12px 28px -12px rgba(0,0,0,.45)}
.gd-more.is-done{display:none}
.gd-quote-tint{background:rgba(0,87,135,.7)}
.gd-quote-text{font-family:"Poppins Wix",var(--display);font-weight:200;font-size:28px;line-height:1.4}
.gd-icons{background:#fff}
.gd-cols{display:grid;grid-template-columns:1fr 1px 1fr;width:100%;margin:0 auto;padding-bottom:85px}
.gd-divider{background:#80ABC3;align-self:stretch;margin-top:288px;margin-bottom:0}
.gd-col{padding-top:100px}
.gd-boxed{margin:0 0 68px;line-height:1.1}
.gd-boxed .box,.gd-boxed .plain{font-size:40px!important;line-height:1.5}
.gd-grid{grid-template-columns:repeat(2,311px);gap:0;justify-content:center}
.gd-icon{width:311px;max-width:311px;padding:5px 0 0}
.gd-icon .vp-icon-art{width:94px;height:86px;margin:0 auto 19px}
.gd-icon p{font-family:var(--display);font-weight:400;font-size:17px;line-height:1.4;color:#000;letter-spacing:normal;text-transform:none;width:259px;margin:0 auto 36px}
@media(max-width:1100px){
.gd-hero{height:auto;padding-bottom:48px}
.gd-title{padding-top:150px;font-size:clamp(34px,9vw,90px);white-space:normal}
.gd-chevron{display:none}
.gd-hero-grad{position:static;background:none}
.gd-intro{position:relative;z-index:1;margin:70px auto 0;font-size:clamp(18px,2.4vw,25px)!important;line-height:1.5!important}
.gd-h2{font-size:clamp(34px,5.5vw,60px);padding:48px 0}
.gd-gallery{margin:0 var(--gutter);max-height:900px}
.gd-flow{gap:10px}
.gd-cols{grid-template-columns:1fr;width:auto;padding:0 var(--gutter) 56px}
.gd-divider{display:none}
.gd-col{padding-top:56px}
.gd-boxed .box,.gd-boxed .plain{font-size:clamp(24px,3.6vw,40px)!important}
.gd-grid{grid-template-columns:repeat(2,minmax(0,311px))}
.gd-icon{width:auto}
.gd-icon p{width:auto}
}
@media(max-width:600px){.gd-grid{grid-template-columns:1fr}.gd-flow .g-item{flex:1 1 calc(50% - 10px)!important}}
/* icon emblems: Wix shrinks the whole item ~10% on hover (inverse of our grow) */
.gd-icon{transition:transform .4s ease-in-out;will-change:transform;transform-origin:center}
.gd-icon:hover{transform:scale(.9)}
@media(prefers-reduced-motion:reduce){.gd-icon{transition:none}.gd-icon:hover{transform:none}}

/* google-ads testimonials: Wix widget rating strip above the review bar (980 grid, logo left, buttons right).
   Selectors are deliberately heavy: .sec.dark a:not(.btn) and .sec.tinted.dark .btn:not(.btn-primary) must lose. */
.google-rating{display:flex;align-items:center;flex-wrap:wrap;gap:20px 30px;width:100%;max-width:980px;margin:30px auto 0}
.gr-logo{display:block;flex:0 0 auto;line-height:0}
.gr-logo img{display:block;width:177px;height:auto}
.sec.dark .google-rating a.gr-score,.sec.dark .google-rating a.gr-score:hover{display:inline-flex;align-items:center;gap:30px;color:#F5C518;text-decoration:none;font-family:var(--body);font-size:16px;line-height:1;white-space:nowrap}
.gr-stars{font-size:15px;letter-spacing:4px;line-height:1;transform:translateY(-1px)}
.sec.tinted.dark .google-rating .btn{display:inline-flex;align-items:center;justify-content:center;height:39px;min-width:235px;padding:0 18px;margin:0;border-radius:0;font-family:var(--body);font-weight:400;font-size:15px;letter-spacing:0;text-transform:none;line-height:1;transition:transform .25s ease,box-shadow .25s ease,background .15s,border-color .15s,color .15s;will-change:transform}
.sec.tinted.dark .google-rating .btn:hover{transform:scale(1.1);box-shadow:0 12px 28px -12px rgba(0,0,0,.45)}
.sec.tinted.dark .google-rating .btn.gr-read,.sec.tinted.dark .google-rating .btn.gr-read:hover{margin-left:auto;background:#F5C518;border:1px solid #F5C518;color:#111}
.sec.tinted.dark .google-rating .btn.gr-write{background:transparent;border:1px solid rgba(255,255,255,.75);color:#fff}
.sec.tinted.dark .google-rating .btn.gr-write:hover{background:rgba(255,255,255,.16);border-color:#fff;color:#fff}
.ga-testimonials .reviews-marquee{margin-top:30px}
@media(prefers-reduced-motion:reduce){.sec.tinted.dark .google-rating .btn{transition:none}.sec.tinted.dark .google-rating .btn:hover{transform:none}}
@media(max-width:1040px){.google-rating{justify-content:center;gap:18px 26px;padding:0 var(--gutter)}.sec.tinted.dark .google-rating .btn.gr-read,.sec.tinted.dark .google-rating .btn.gr-read:hover{margin-left:0}}
@media(max-width:520px){.sec.tinted.dark .google-rating .btn{min-width:0;flex:1 1 150px}}

/* website design: the component emblems shrink 10%% on hover, same as the graphic design page */
.wd-icons .vp-icon{transition:transform .4s ease-in-out;will-change:transform;transform-origin:center}
.wd-icons .vp-icon:hover{transform:scale(.9)}
@media(prefers-reduced-motion:reduce){.wd-icons .vp-icon{transition:none}.wd-icons .vp-icon:hover{transform:none}}

/* ---------- social media page (Wix layout measured at 1706px; data in content/social-media.json) ---------- */
.sm-hero{position:relative;background:#005787;color:#fff;overflow:hidden;height:1587px}
.sm-hero-bg{position:absolute;inset:0;background-size:cover;background-position:center;background-repeat:no-repeat;opacity:.4}
.sm-title{position:relative;margin:0;padding-top:300px;text-align:center;font-family:"Poppins Wix",var(--display);font-weight:600;font-size:110px;line-height:1.2;letter-spacing:.05em;color:#fff;white-space:nowrap}
.sm-chevron{margin-top:31px}
.sm-chevron svg{width:98px;height:98px}
.sm-hero-grad{position:absolute;left:0;right:0;top:579px;bottom:0;background:linear-gradient(0deg,#005787 37.5%,rgba(0,0,0,0) 100%)}
.sm-intro{margin:463px auto 0;width:940px;max-width:calc(100% - 2*var(--gutter));text-align:center;font-family:"Poppins Wix",var(--display);font-weight:200;font-size:25px!important;line-height:35px!important;color:#fff}
.sm-intro p{margin:0 0 35px;font-size:inherit;line-height:inherit}
.sm-intro p:last-child{margin-bottom:0}
.sm-intro .ga-orange,.sm-intro .ga-blue{font-weight:400}
.sm-portfolio{background:#fff;scroll-margin-top:104px;padding:73px 0 14px}
.sm-h2{margin:0 0 64px;text-align:center;font-family:var(--display);font-weight:500;font-size:60px;line-height:1;letter-spacing:0;text-wrap:wrap;color:#005787}
.sm-gallery{display:grid;grid-template-columns:repeat(3,491px);column-gap:51px;row-gap:0;justify-content:start;margin:0 50px}
.sm-tile{display:block;height:616px;text-decoration:none;text-align:center;color:rgba(0,87,135,.9)}
.sm-tile img{display:block;width:222.5px;height:440px;margin:26px auto 0;transition:transform .25s ease;will-change:transform}
.sm-tile:hover img{transform:scale(1.1)}
.sm-tile:hover{color:rgba(0,87,135,.9)}
.sm-tile:nth-child(n+7){margin-top:6px}
.sm-cap{display:block;margin:39px 0 0;font-family:var(--display);font-weight:400;font-size:18px;line-height:1.4;letter-spacing:0}
.sm-quote{min-height:388px}
.sm-quote-text{font-family:"Poppins Wix",var(--display);font-weight:200;font-size:32px;line-height:1.4;margin:0}
.sm-quote .vp-quote-by{margin-top:7px}
.sm-quote .container{padding-top:8px}
.sm-icons{background:#fff;padding:76px 0 138px}
.sm-boxed{margin:0;line-height:1.5}
.sm-boxed .box{font-family:"Poppins Wix",var(--display);font-size:50px!important;line-height:71px;font-weight:400;padding:0}
.sm-boxed .plain{font-size:60px!important;line-height:1.5;font-weight:600}
.sm-row{display:grid;justify-content:center;gap:0}
.sm-row-1{grid-template-columns:repeat(3,414px);margin-top:83px}
.sm-row-2{grid-template-columns:repeat(4,274px);margin-top:73px;margin-left:6px}
.sm-row-2 .sm-icon .vp-icon-art{margin-bottom:20px}
.sm-icon{max-width:none;padding:0 8px;transition:transform .4s ease-in-out;will-change:transform;transform-origin:center}
.sm-icon:hover{transform:scale(.9)}
.sm-icon .vp-icon-art{width:130px;height:130px;margin:0 auto 22px}
.sm-icon p{font-family:var(--display);font-weight:400;font-size:17px;line-height:1.4;color:#000;letter-spacing:normal;text-transform:none;margin:0}
.vp-other.sm-other{padding-top:73px;padding-bottom:26px}
@media(prefers-reduced-motion:reduce){.sm-tile img,.sm-icon{transition:none}.sm-tile:hover img,.sm-icon:hover{transform:none}}
@media(max-width:1660px){.sm-gallery{grid-template-columns:repeat(3,minmax(0,491px));column-gap:clamp(16px,3vw,51px)}.sm-tile{height:auto;padding-bottom:40px}.sm-tile img{width:45.32%;height:auto;aspect-ratio:340/672;margin-top:5.3%}.sm-cap{margin-top:7.9%}}
@media(max-width:1300px){.sm-row-1{grid-template-columns:repeat(3,minmax(0,414px))}.sm-row-2{grid-template-columns:repeat(4,minmax(0,274px));padding:0 var(--gutter)}}
@media(max-width:1100px){
.sm-hero{height:auto;padding-bottom:48px}
.sm-title{padding-top:150px;font-size:clamp(34px,9vw,90px);white-space:normal}
.sm-chevron{display:none}
.sm-hero-grad{position:static;background:none}
.sm-intro{position:relative;z-index:1;margin:70px auto 0;font-size:clamp(18px,2.4vw,25px)!important;line-height:1.5!important}
.sm-h2{font-size:clamp(34px,5.5vw,60px);margin-bottom:40px}
.sm-gallery{margin:0 var(--gutter)}
.sm-icons{padding:56px 0 72px}
.sm-boxed .box{font-size:clamp(22px,3.4vw,40px)!important}
.sm-boxed .plain{font-size:clamp(26px,4vw,48px)!important}
.sm-row-1{margin-top:56px}
.sm-row-2{margin-top:48px;grid-template-columns:repeat(2,minmax(0,274px))}
.sm-icon{padding:0 8px 32px}
}
@media(max-width:700px){.sm-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}.sm-row-1{grid-template-columns:repeat(2,minmax(0,1fr))}.sm-row-2{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:460px){.sm-gallery{grid-template-columns:1fr}}

/* ---------- aerial footage page (Wix layout measured at 1706px; data in content/aerial-footage.json) ---------- */
.af-hero{position:relative;background:#005787;color:#fff;overflow:hidden;height:1607px}
.af-hero-bg{position:absolute;inset:0;background-size:cover;background-position:center;background-repeat:no-repeat;opacity:.35}
.af-title{position:relative;margin:0;padding-top:288px;text-align:center;font-family:"Poppins Wix",var(--display);font-weight:600;font-size:110px;line-height:1.2;letter-spacing:.05em;color:#fff;white-space:nowrap}
.af-hero-grad{position:absolute;left:0;right:0;top:587px;bottom:0;background:linear-gradient(0deg,#005787 37.5%,rgba(0,0,0,0) 100%)}
.af-intro{margin:461px auto 0;width:908px;max-width:calc(100% - 2*var(--gutter));text-align:center;font-family:"Poppins Wix",var(--display);font-weight:200;font-size:24px!important;line-height:33.6px!important;color:#fff}
.af-intro p{margin:0 0 33.6px;font-size:inherit;line-height:inherit}
.af-intro p:last-child{margin-bottom:0}
.af-portfolio{background:#fff;scroll-margin-top:104px;padding:69px 0 100px}
.af-h2{font-weight:400;margin-bottom:55px}
.af-grid-videos{display:grid;grid-template-columns:repeat(3,499px);gap:40px;justify-content:center}
.af-video{position:relative;display:block;width:499px;aspect-ratio:16/9;padding:0;margin:0;border:0;background:#0b2f4a;cursor:pointer;overflow:hidden;transition:transform .25s ease,box-shadow .25s ease;will-change:transform}
.af-video img{display:block;width:100%;height:100%;object-fit:cover}
.af-video:hover{transform:scale(1.1);z-index:2;box-shadow:0 12px 28px -12px rgba(0,0,0,.45)}
.af-play{position:absolute;left:50%;top:50%;width:50px;height:50px;margin:-25px 0 0 -25px;border:2px solid #fff;border-radius:50%;box-sizing:border-box;background:rgba(0,0,0,.18)}
.af-play::after{content:"";position:absolute;left:19px;top:14px;border-style:solid;border-width:9px 0 9px 15px;border-color:transparent transparent transparent #fff}
.af-dur{position:absolute;right:11px;bottom:12px;font-family:var(--body);font-size:12px;line-height:1;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.6)}
.af-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.af-video.is-playing:hover{transform:none;box-shadow:none}
.af-quote{min-height:388px}
.af-quote .container{max-width:calc(1040px + 2*var(--gutter));padding-top:20px}
.af-quote-text{font-family:"Poppins Wix",var(--display);font-weight:200;font-size:25px;line-height:1.4;margin:0 0 7px}
.af-quote .vp-quote-by{margin-top:-3px}
.af-icons{background:#fff;padding:100px 0 104px}
.af-cols{position:relative;display:grid;grid-template-columns:1fr 1fr}
.af-divider{position:absolute;left:50%;top:313px;width:1px;height:474px;background:#80ABC3}
.af-col-l{transform:translateX(-14px)}
.af-col-r{transform:translateX(2px)}
.af-head{height:145px;margin:0;text-align:center;font-size:60px;line-height:1.1;letter-spacing:0;text-wrap:wrap}
.af-head .box{display:inline-block;margin-top:12px;padding:0 13px;background:#005787;color:#fff;font-family:"Poppins Wix",var(--display);font-weight:400;font-size:40px;line-height:56px}
.af-head .plain{display:block;margin-top:20px;color:#005787;font-family:var(--display);font-weight:600;font-size:45px;line-height:50px}
.af-grid{display:grid;grid-template-columns:repeat(2,312.5px);justify-content:center;margin-top:68px}
.af-icon{max-width:none;height:169px;padding:0;transition:transform .4s ease-in-out;will-change:transform;transform-origin:center}
.af-icon:hover{transform:scale(.9)}
.af-icon .vp-icon-art{width:114px;height:114px;margin:-3px auto -3px}
.af-icon p{font-family:var(--display);font-weight:400;font-size:17px;line-height:24px;color:#000;letter-spacing:normal;text-transform:none;margin:2px 0 0}
@media(prefers-reduced-motion:reduce){.af-video,.af-icon{transition:none}.af-video:hover,.af-icon:hover{transform:none}}
@media(max-width:1660px){.af-grid-videos{grid-template-columns:repeat(3,minmax(0,499px));gap:clamp(16px,2.4vw,40px);padding:0 var(--gutter)}.af-video{width:100%}}
@media(max-width:1100px){
.af-hero{height:auto;padding-bottom:48px}
.af-title{padding-top:150px;font-size:clamp(34px,9vw,90px);white-space:normal}
.af-hero-grad{position:static;background:none}
.af-intro{position:relative;z-index:1;margin:70px auto 0;font-size:clamp(18px,2.4vw,24px)!important;line-height:1.5!important}
.af-portfolio{padding:48px 0 56px}
.af-h2{margin-bottom:32px}
.af-icons{padding:56px 0 48px}
.af-cols{grid-template-columns:1fr;gap:40px}
.af-divider{display:none}
.af-col-l,.af-col-r{transform:none}
.af-head{height:auto}
.af-head .box{font-size:clamp(22px,3.4vw,40px);line-height:1.4}
.af-head .plain{font-size:clamp(26px,4vw,45px);line-height:1.2}
.af-grid{grid-template-columns:repeat(2,minmax(0,312px));margin-top:40px}
.af-icon{height:auto;padding-bottom:36px}
}
@media(max-width:760px){.af-grid-videos{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:480px){.af-grid-videos{grid-template-columns:1fr}.af-grid{grid-template-columns:1fr}}

/* ---------- strategic consulting page (Wix layout measured at 1706px; data in content/strategic-consulting.json) ---------- */
.sc-hero{position:relative;background:#005787;color:#fff;overflow:hidden;height:1124px}
.sc-hero-bg{position:absolute;inset:0;background-size:cover;background-position:center;background-repeat:no-repeat;opacity:.59}
.sc-title{position:relative;margin:0 auto;padding-top:273px;max-width:1056px;text-align:center;font-family:"Poppins Wix",var(--display);font-weight:600;font-size:100px;line-height:1.2;letter-spacing:.05em;color:#fff;text-wrap:wrap}
.sc-chevron{margin-top:22px;position:relative;z-index:1}
.sc-chevron svg{width:98px;height:98px}
.sc-hero-grad{position:absolute;left:0;right:0;top:527px;bottom:0;background:linear-gradient(0deg,#005787 37.5%,rgba(0,0,0,0) 100%)}
.sc-intro{margin:298px auto 0;width:886px;max-width:calc(100% - 2*var(--gutter));text-align:center;font-family:"Poppins Wix",var(--display);font-weight:200;font-size:24px!important;line-height:33.6px!important;color:#fff}
.sc-intro p{margin:0;font-size:inherit;line-height:inherit}
.sc-intro .sc-lead{font-weight:400;margin-bottom:33.6px}
.sc-intro .ga-blue{font-weight:400}
.sc-two{display:grid;grid-template-columns:1fr 1fr;width:calc(100% - 160px);margin:0 auto;align-items:start}
.sc-bring{background:#005787;color:#fff;height:607px;scroll-margin-top:104px;overflow:hidden}
.sc-col-text{width:489px;margin:0 auto;padding-top:84px}
.sc-h2{margin:0 0 27px;font-family:"Poppins Wix",var(--display);font-weight:600;font-size:34px;line-height:1.2;letter-spacing:0;color:#005787}
.sc-h2-light{color:#19ADFF}
.sc-list{list-style:none;margin:0;padding:0}
.sc-list li{position:relative;padding-left:47px;font-family:var(--display);font-weight:400;font-size:16px;line-height:1.4}
.sc-list li p{margin:2px 0 0;font-size:inherit;line-height:inherit;color:#fff}
.sc-list li strong{font-weight:700}
.sc-check{position:absolute;left:0;top:0;width:30px;height:30px;line-height:0}
.sc-check svg{width:100%;height:100%;display:block}
.sc-list-bring li{margin-bottom:19px}
.sc-list-bring li:nth-child(1){margin-bottom:23px}
.sc-list-bring li:nth-child(2){margin-bottom:25px}
.sc-list-bring li:nth-child(3){margin-bottom:11px}
.sc-col-img{width:491px;margin:0 auto}
.sc-col-img img{display:block;width:593px;height:416px;max-width:none;margin:101px 0 0 -77px}
.sc-why{background:#fff;color:#000;height:374px;overflow:hidden}
.sc-col-img2{width:491px;margin:0 auto}
.sc-col-img2 img{display:block;width:237px;height:236px;margin:64px 0 0 127px}
.sc-col-text2{width:489px;margin:0 auto;padding-top:64px}
.sc-col-text2 .sc-h2{margin-bottom:27px}
.sc-list-why li{padding-left:49px;line-height:1.6;margin-bottom:15px}
.sc-list-why li:nth-child(2){margin-bottom:26px}
.sc-list-why li p{color:#000;margin:0}
.sc-list-why .sc-check{top:3px}
.sc-close{background:#005787;color:#fff;padding:59px 0 81px;text-align:center}
.sc-statement{margin:0 auto;width:650px;max-width:calc(100% - 2*var(--gutter));font-family:"Poppins Wix",var(--display);font-weight:200;font-size:24px;line-height:1.6}
.sc-statement p{margin:0;font-size:inherit;line-height:inherit}
.sc-statement .ga-blue{color:#3D9BE9}
.sc-rule{display:block;width:514px;max-width:calc(100% - 2*var(--gutter));height:3px;margin:32px auto 0;border:0;background:#ED5829;transform:translateX(4px)}
@media(max-width:1100px){
.sc-hero{height:auto;padding-bottom:48px}
.sc-title{padding-top:150px;font-size:clamp(34px,8vw,80px)}
.sc-chevron{display:none}
.sc-hero-grad{position:static;background:none}
.sc-intro{position:relative;z-index:1;margin:60px auto 0;font-size:clamp(18px,2.4vw,24px)!important;line-height:1.5!important}
.sc-two{grid-template-columns:1fr;width:auto;padding:0 var(--gutter);gap:32px}
.sc-bring,.sc-why{height:auto;padding:56px 0}
.sc-col-text,.sc-col-text2,.sc-col-img,.sc-col-img2{width:auto;max-width:560px;padding-top:0}
.sc-col-img img{width:100%;height:auto;max-width:593px;margin:0 auto}
.sc-col-img2 img{margin:0 auto}
.sc-close{padding:48px 0 56px}
}

/* ---------- seo services page (Wix layout measured at 1706px; data in content/seo-services.json) ---------- */
.seo-hero{position:relative;background:#005787;color:#fff;overflow:hidden;height:1124px}
.seo-hero-bg{position:absolute;inset:0;background-size:cover;background-position:center;background-repeat:no-repeat;opacity:.25}
.seo-title{position:relative;margin:0 auto;padding-top:273px;max-width:1056px;text-align:center;font-family:"Poppins Wix",var(--display);font-weight:600;font-size:100px;line-height:1.2;letter-spacing:.05em;color:#fff;text-wrap:wrap}
.seo-chevron{margin-top:22px;position:relative;z-index:1}
.seo-chevron svg{width:98px;height:98px}
.seo-hero-grad{position:absolute;left:0;right:0;top:527px;bottom:0;background:linear-gradient(0deg,#005787 37.5%,rgba(0,0,0,0) 100%)}
.seo-intro{margin:259px auto 0;width:886px;max-width:calc(100% - 2*var(--gutter));text-align:center;font-family:"Poppins Wix",var(--display);font-weight:200;font-size:24px!important;line-height:33.6px!important;color:#fff}
.seo-intro p{margin:0 0 33.6px;font-size:inherit;line-height:inherit}
.seo-intro p:last-child{margin-bottom:0}
.seo-intro strong{font-weight:400}
.ga-white{color:#fff}
.ga-black{color:#201F20}
.seo-band{position:relative}
.seo-navy{background:#005787;color:#fff}
.seo-white{background:#fff;color:#201F20}
.seo-two{display:grid;grid-template-columns:1fr 1fr;width:calc(100% - 160px);margin:0 auto;align-items:start}
.seo-text{width:489px;margin:0 auto}
.seo-img{width:491px;margin:0 auto}
.seo-img img{display:block;max-width:none}
.seo-h2{margin:0 0 13px;font-family:"Poppins Wix",var(--display);font-weight:600;font-size:34px;line-height:1.2;letter-spacing:0;text-wrap:wrap}
.seo-h2 p{margin:0;font-size:inherit;line-height:inherit}
.seo-copy{font-family:var(--display);font-weight:400;font-size:16px;line-height:1.4;color:#fff}
.seo-copy-dark{color:#201F20}
.seo-copy p{margin:0;font-size:inherit;line-height:inherit}
.seo-copy ul{margin:0;padding-left:22px}
.seo-copy li{font-size:inherit;line-height:inherit}
.seo-copy strong{font-weight:700}
.seo-copy-dark ul li::marker{color:#3D9BE9}
.seo-s6 .seo-copy ul li,.seo-s8 .seo-copy ul li{line-height:1.5}
.seo-checks{list-style:none;margin:0;padding:0}
.seo-checks li{display:flex;align-items:center;gap:0;min-height:30px;margin:0 0 14px;font-family:var(--display);font-weight:400;font-size:16px;line-height:1.4}
.seo-checks li div{padding-left:17px;flex:1 1 auto}
.seo-checks li p{margin:0;font-size:inherit;line-height:inherit}
.seo-checks li strong{font-weight:700}
.seo-check{flex:0 0 30px;width:30px;height:30px;line-height:0}
.seo-check svg{width:100%;height:100%;display:block}
.seo-checks-white{color:#fff}
.seo-checks-dark{color:#201F20}
.seo-line{display:block;width:1331px;max-width:calc(100% - 2*var(--gutter));height:3px;margin:0 auto;border:0;background:#3D9BE9}
/* s1: why JBowman Creative stands out */
.seo-s1{min-height:838px;scroll-margin-top:104px}
.seo-s1 .seo-two{padding-top:84px}
.seo-s1 .seo-copy{width:526px}
.seo-s1 .seo-checks{width:542px}
.seo-s1 .seo-copy{margin-bottom:25px}
.seo-s1 .seo-checks li:nth-child(3){margin-bottom:36px}
.seo-s1 .seo-checks li:last-child{margin-bottom:39px}
.seo-img-s1 img{width:600px;height:500px;margin:84px 0 0 -53px}
/* s2: driven by data (white, image left) */
.seo-s2{min-height:842px}
.seo-s2 .seo-two{padding-top:64px}
.seo-s2 .seo-h2{margin-bottom:18px}
.seo-s2 .seo-copy{width:506px}
.seo-img-s2 img{width:615px;height:512px;margin:126px 0 0 -62px}
/* s3: award winning (navy, image right, line) */
.seo-s3 .seo-two{padding-top:93px}
.seo-s3 .seo-text{padding-top:8px}
.seo-s3 .seo-h2{width:513px}
.seo-s3 .seo-copy{width:526px}
.seo-s3 .seo-copy{margin-bottom:47px}
.seo-img-s3 img{width:600px;height:489px;margin:124px 0 0 -54px}
.seo-s3 .seo-line{margin-top:48px}
.seo-s3{padding-bottom:12px}
/* s4: real results, pdf tiles */
.seo-s4{text-align:center;padding:81px 0 85px}
.seo-h2-big{margin:0 auto 22px;max-width:978px;font-family:"Poppins Wix",var(--display);font-weight:600;font-size:46px;line-height:1.2;letter-spacing:0;color:#fff;text-wrap:wrap}
.seo-h2-big p{margin:0;font-size:inherit;line-height:inherit}
.seo-sub{margin:0 0 60px;font-family:var(--display);font-size:18px;line-height:1.5;color:#fff}
.seo-pdfs{display:flex;justify-content:center;gap:81px}
.seo-pdf{display:block;width:227px;text-decoration:none;color:#fff;text-align:left;transition:transform .25s ease;will-change:transform}
.seo-pdf img{display:block;width:227px;height:277px;transform:scale(1.05);transform-origin:50% 50%;margin-bottom:18px}
.seo-pdf span{display:block;width:141px;margin-left:7px;font-family:var(--display);font-weight:500;font-size:15px;line-height:1.4}
.seo-pdf:hover{transform:scale(1.1);color:#fff}
/* s5: real value (white, image left, dark checks) */
.seo-s5{min-height:881px}
.seo-s5 .seo-two{padding-top:64px}
.seo-s5 .seo-h2{margin-bottom:18px}
.seo-s5 .seo-copy{margin-bottom:28px;width:506px}
.seo-s5 .seo-checks{width:520px}
.seo-s5 .seo-checks li{margin-bottom:15px}
.seo-s5 .seo-checks li:last-child{margin-bottom:62px}
.seo-img-s5 img{width:511px;height:426px;margin:161px 0 0 -20px}
/* s6: two blog posts (navy, image right, line) */
.seo-s6 .seo-two{padding-top:92px}
.seo-s6 .seo-text{padding-top:8px}
.seo-s6 .seo-h2{margin-bottom:22px;width:513px}
.seo-s6 .seo-copy{width:526px}
.seo-s6 .seo-copy{margin-bottom:62px}
.seo-img-s6 img{width:526px;height:437px;margin:80px 0 0 0}
.seo-s6 .seo-line{margin-top:37px}
.seo-s6{padding-bottom:15px}
/* s7: AEO (navy, image left, line) */
.seo-s7 .seo-two{padding-top:68px}
.seo-s7 .seo-copy{width:506px}
.seo-s7 .seo-h2{margin-bottom:23px}
.seo-s7 .seo-copy{margin-bottom:65px}
.seo-img-s7 img{width:505px;height:417px;margin:13px 0 0 -14px}
.seo-s7 .seo-line{margin-top:32px}
.seo-s7{padding-bottom:16px}
/* s8: we don't use AI to write (navy, image right, line) */
.seo-s8 .seo-two{padding-top:67px}
.seo-s8 .seo-copy{width:506px}
.seo-s8 .seo-h2{margin-bottom:23px;max-width:312px}
.seo-s8 .seo-copy{margin-bottom:65px}
.seo-img-s8 img{width:505px;height:417px;margin:13px 0 0 -14px}
.seo-s8 .seo-line{margin-top:48px}
/* s9: what you get, six boxes */
.seo-s9{text-align:center;padding:97px 0 70px}
.seo-h2-tight{line-height:1;margin-bottom:22px}
.seo-s9-para p{margin:0;font-size:inherit;line-height:inherit}
.seo-s9-para{margin:0 auto 59px;text-align:center;width:946px;max-width:calc(100% - 2*var(--gutter));font-family:var(--display);font-size:18px;line-height:1.4;color:#fff}
/* ---------- s9: the six "what you get" tiles ----------
   Restyled 2026-09-01, the same job as the email marketing cards. As inherited these were the
   only tiles on the site with no fill, no shadow and no hover at all: 2px outlines alternating
   orange and blue to no pattern, body copy set in the DISPLAY font at 15px/1.4, everything
   centred, and three hardcoded h3 max-widths (197/236/183px) forcing line breaks by hand.

   They now match the site's tile language and, deliberately, the six email marketing cards:
   solid fill, 5px radius, the resting shadow, Poppins caps titles with the orange accent rule,
   body copy in the BODY font, and the site wide 1.1x hover.

   THE FILL IS LIGHTER THAN THE #005787 BAND BEHIND IT, on purpose. These carry a drop shadow, and
   a raised object has to be lighter than its ground or the shadow reads as a mistake. White on
   #0F6EA3 is 5.56:1, comfortably past AA. Do NOT reach for the brand blue #3D9BE9 here: white on
   it is 2.97:1 and fails even for large text. Same rule as the email cards. */
.seo-boxes{display:grid;grid-template-columns:repeat(3,302px);gap:30px 26px;justify-content:center}
.seo-box{display:flex;flex-direction:column;box-sizing:border-box;background:#0F6EA3;
  border:1px solid rgba(255,255,255,.18);border-radius:5px;padding:26px 26px 30px;text-align:left;
  box-shadow:0 1px 3px rgba(0,0,0,.5);
  transition:transform .25s ease,box-shadow .25s ease;will-change:transform}
.seo-box:hover{transform:scale(1.1);position:relative;z-index:1;box-shadow:0 12px 28px -12px rgba(0,0,0,.45)}
@media(prefers-reduced-motion:reduce){.seo-box{transition:none}.seo-box:hover{transform:none}}
/* the JSON still carries a per box "color", but the alternation lived on the border and read as
   arbitrary. One accent colour across all six, matching the email cards. */
.seo-box-orange{border-color:rgba(255,255,255,.18)}
.seo-box h3{margin:0;text-wrap:balance;font-family:var(--display);font-weight:600;font-size:19px;
  line-height:1.35;letter-spacing:.02em;text-transform:uppercase;color:#fff;
  /* two lines reserved so the rules and copy align across a row */
  min-height:2.7em}
.seo-box h3::after{content:"";display:block;width:44px;height:3px;margin-top:13px;background:#ED5829;border-radius:2px}
.seo-box p{margin:15px 0 0;font-family:var(--body);font-size:15px;line-height:1.7;color:#fff}
@media(prefers-reduced-motion:reduce){.seo-pdf{transition:none}.seo-pdf:hover{transform:none}}
@media(max-width:1100px){
.seo-hero{height:auto;padding-bottom:48px}
.seo-title{padding-top:150px;font-size:clamp(34px,8vw,80px)}
.seo-chevron{display:none}
.seo-hero-grad{position:static;background:none}
.seo-intro{position:relative;z-index:1;margin:60px auto 0;font-size:clamp(18px,2.4vw,24px)!important;line-height:1.5!important}
.seo-two{grid-template-columns:1fr;width:auto;padding:0 var(--gutter);gap:32px}
.seo-band .seo-two{padding-top:56px}
.seo-text,.seo-img{width:auto;max-width:560px}
.seo-img img{width:100%!important;height:auto!important;max-width:600px;margin:0 auto!important}
.seo-white .seo-img,.seo-s7 .seo-img{order:2}
.seo-s1,.seo-s2,.seo-s5{min-height:0}
.seo-band{padding-bottom:40px}
.seo-line{margin-top:24px!important}
.seo-s4,.seo-s9{padding:56px var(--gutter) 48px}
.seo-h2-big{font-size:clamp(28px,5vw,46px)}
.seo-pdfs{gap:40px;flex-wrap:wrap}
.seo-boxes{grid-template-columns:repeat(auto-fit,minmax(260px,302px));gap:24px}
.seo-s8 .seo-h2{max-width:none}
}

/* ---------- email marketing page (Wix layout; data in content/email-marketing.json) ---------- */
.em-hero{position:relative;background:#005787;color:#fff;overflow:hidden;height:888px}
.em-hero-bg{position:absolute;inset:0;background-size:cover;background-position:left center;background-repeat:no-repeat;opacity:.4}
.em-hero-panel{position:absolute;left:0;right:0;top:404px;bottom:0;background:linear-gradient(0deg,#000 37.5%,rgba(0,0,0,0) 100%)}
.em-title{position:relative;margin:0;padding-top:222px;text-align:center;font-family:"Poppins Wix",var(--display);font-weight:600;font-size:105px;line-height:1.2;letter-spacing:.05em;color:#fff;white-space:nowrap}
.em-hero .em-chevron{position:absolute;left:50%;top:352px;transform:translateX(-50%);width:110px;height:110px;margin:0;color:#fff;display:flex;align-items:center;justify-content:center;z-index:2}
.em-hero .em-chevron svg{width:98px;height:98px;fill:currentColor;transform:rotate(-90deg)}
.em-hero .em-chevron svg *{fill:currentColor}
.em-intro{position:absolute;left:50%;top:556px;width:940px;margin:0;transform:translateX(-50%);text-align:center;font-family:"Poppins Wix",var(--display);font-weight:200;font-size:25px!important;line-height:40px!important;color:#E8EDEA}
.em-blue{color:#3D9BE9}
.em-watermark{position:absolute;left:calc(50% + 593px);top:500px;opacity:.35;width:449px;margin:0;font-family:"Poppins Wix",var(--display);font-weight:600;font-size:70px;line-height:.95;transform:rotate(270deg);transform-origin:center;white-space:nowrap;pointer-events:none}
.em-white{color:#fff;letter-spacing:.1em}
.em-grey{color:#393939}
.em-strap{background:#3D9BE9;color:#fff;text-align:center;padding:22px var(--gutter) 23px}
.em-strap p{margin:0;font-family:"Poppins Wix",var(--display);font-weight:600;font-size:35px;line-height:1.5}
/* ---------- the six service cards ----------
   Restyled 2026-09-01. They came over from Wix built by a different designer and matched nothing
   else on the site: sentence case titles in the BODY font coloured #19ADFF, copy boxed to fixed
   pixel widths inside the card so it wrapped raggedly against an empty right gutter, two
   hardcoded min-heights that left dead space under the shorter cards, and a 10px column gap.

   They now follow the home page service tiles: solid brand fill, 5px radius, the same resting
   shadow, Poppins caps titles and the site wide 1.1x hover. The orange rule is the brand accent,
   used the way the CTAs use it.

   THE FILL STAYS NAVY #005787 ON PURPOSE. It is the only brand fill that carries body copy
   accessibly: white on navy is 7.74:1, while white on the brand blue #3D9BE9 is 2.97:1 and on the
   orange #ED5829 is 3.48:1, both failing AA. Do not "brighten" these tiles to the lighter blue.
   The old #19ADFF title on navy was 3.12:1, so it failed AA too: the cheap look and an
   accessibility bug were the same defect. */
.em-cards{background:#fff;padding:68px var(--gutter) 82px}
.em-cards-grid{display:grid;grid-template-columns:repeat(3,320px);gap:26px 15px;justify-content:center}
.em-card{display:flex;flex-direction:column;background:#005787;border-radius:5px;color:#fff;overflow:hidden;
  box-sizing:border-box;box-shadow:0 1px 3px rgba(0,0,0,.5);
  transition:transform .25s ease,box-shadow .25s ease;will-change:transform}
.em-card:hover{transform:scale(1.1);z-index:2;position:relative;box-shadow:0 12px 28px -12px rgba(0,0,0,.45)}
@media(prefers-reduced-motion:reduce){.em-card{transition:none}.em-card:hover{transform:none}}
.em-strap{scroll-margin-top:104px}
/* no min-height: the row sizes to its tallest card, and full width copy wraps evenly enough that
   the shortest card no longer trails half a card of empty navy */
.em-card img{display:block;width:100%;height:237px;object-fit:cover;border-radius:5px 5px 0 0}
.em-card h3{margin:26px 30px 0;width:auto;text-wrap:balance;font-family:"Poppins Wix",var(--display);
  font-weight:600;font-size:19px;line-height:1.35;letter-spacing:.02em;text-transform:uppercase;color:#fff;
  /* reserve two lines so the orange rule and the copy below it line up across a row, however
     many lines each title happens to take */
  min-height:2.7em}
.em-card h3::after{content:"";display:block;width:44px;height:3px;margin-top:13px;background:#ED5829;border-radius:2px}
.em-card p{margin:15px 30px 30px;width:auto;font-family:var(--body);font-size:15px;line-height:1.7;color:#fff}
.em-two{width:calc(100% - 160px);margin:0 auto;display:grid;grid-template-columns:489fr 491fr;align-items:start}
.em-automation .em-two{grid-template-columns:491fr 489fr}
.em-col-text{width:489px;max-width:100%;margin:0 auto}
.em-col-img{width:491px;max-width:100%;margin:0 auto}
.em-col-text h2{margin:8px 0 14px;width:466px;max-width:none;text-wrap:wrap;letter-spacing:0;font-family:"Poppins Wix",var(--display);font-weight:600;font-size:38px;line-height:1.5}
.em-p{margin:0 0 19px;width:459px;max-width:100%;font-family:var(--body);font-size:16px;line-height:1.8}
.em-sub{margin:0 0 10px;text-wrap:wrap;letter-spacing:0;font-family:"Poppins Wix",var(--display);font-weight:600;font-size:29px;line-height:1.2}
.em-checks{list-style:none;margin:0;padding:0;width:506px;max-width:100%}
.em-checks li{display:grid;grid-template-columns:47px 1fr;align-items:start;margin:0 0 18px;font-family:var(--body);font-size:16px;line-height:1.8}
.em-check{display:block;width:30px;height:30px}
.em-check svg{display:block;width:30px;height:30px}
.em-checks-big li{margin:0 0 9px}
.em-checks-big .em-check{margin-top:9px}
.em-checks-big b{display:block;font-weight:400;font-size:24px;line-height:1.8}
.em-checks-big p{margin:0;font-size:16px;line-height:1.8}
.em-approach{background:#005787;color:#fff;padding:84px 0 10px;min-height:638px;box-sizing:border-box}
.em-approach .em-check{color:#fff}
.em-approach .em-col-img img{display:block;width:631px;max-width:none;height:294px;margin:106px 0 69px -70px}
.em-automation{background:#fff;color:#2F2E2E;padding:68px 0 21px;min-height:751px;box-sizing:border-box}
.em-automation h2,.em-automation .em-sub{color:#005787}
.em-automation .em-col-text h2{line-height:1.36;margin:0 0 23px}
.em-automation .em-p{margin-bottom:27px}
.em-automation .em-check{color:#3D9BE9}
.em-automation .em-checks-big b{color:#3D9BE9}
.em-automation .em-col-img img{display:block;width:600px;max-width:none;height:542px;margin:34px 0 10px -47px}
.em-campaign{background:#005787;color:#fff;padding:101px 0 10px;min-height:857px;box-sizing:border-box}
.em-campaign .em-col-text h2{line-height:1.4;margin:-2px 0 14px}
.em-campaign .em-p{margin-bottom:39px}
.em-campaign .em-sub{margin-bottom:13px}
.em-campaign .em-check{color:#fff}
.em-campaign .em-col-img img{display:block;width:505px;max-width:none;height:540px;margin:35px 0 10px -7px}

.vp-other.em-other .vp-other-h{margin-top:34px}
.vp-other.em-other{padding-bottom:calc(70px - 14px)}
.em-book{background:#fff;padding:80px var(--gutter) 83px;text-align:center}
.em-book .btn{margin-left:-16px;display:inline-flex;align-items:center;justify-content:center;width:560px;max-width:100%;height:62px;box-sizing:border-box;padding:0 20px;border-radius:5px;font-family:"Work Sans",var(--display);font-weight:700;font-size:18px;letter-spacing:0;text-transform:uppercase;transition:transform .25s ease,box-shadow .25s ease,background .15s,border-color .15s;will-change:transform}
.em-book .btn:hover{transform:scale(1.1);box-shadow:0 12px 28px -12px rgba(0,0,0,.45)}
@media(prefers-reduced-motion:reduce){.em-book .btn{transition:none}.em-book .btn:hover{transform:none}}
@media(max-width:1100px){
.em-hero{height:auto;padding-bottom:48px}
.em-title{padding-top:150px;font-size:clamp(34px,9vw,90px);white-space:normal}
.em-hero .em-chevron{display:none}
.em-hero-panel{top:18%}
.em-intro{position:relative;z-index:1;left:auto;top:auto;width:auto;transform:none;margin:70px var(--gutter) 0;font-size:clamp(18px,2.4vw,25px)!important;line-height:1.5!important}
.em-watermark{display:none}
.em-strap p{font-size:clamp(20px,3.4vw,35px)}
.em-cards-grid{grid-template-columns:repeat(2,320px)}
.em-two{width:auto;grid-template-columns:1fr;row-gap:24px}
.em-automation .em-two{grid-template-columns:1fr}
.em-col-text,.em-col-img{width:auto}
.em-col-text h2,.em-p,.em-checks{width:auto}
.em-approach .em-col-img img,.em-automation .em-col-img img,.em-campaign .em-col-img img{width:100%;max-width:520px;height:auto;margin:0 auto}
.em-approach,.em-automation,.em-campaign{min-height:0;padding:56px var(--gutter)}
.em-automation .em-col-img{order:2}
}
@media(max-width:720px){.em-cards-grid{grid-template-columns:min(320px,100%)}.em-book .btn{height:auto;padding:16px 20px;font-size:15px}}

/* ---------- team page (Wix layout measured at 1706px; data in content/the-team.json) ---------- */
.tm-hero{position:relative;background:#005787;color:#fff;height:562px;overflow:hidden}
.tm-title{margin:0;padding-top:210px;text-align:center;font-family:"Poppins Wix",var(--display);font-weight:600;font-size:125px;line-height:1.2;letter-spacing:.05em;color:#fff}
.tm-chevron{margin-top:8px}
.tm-chevron svg{width:98px;height:98px}
.tm-team{background:#F7F8FA;padding:91px 0 70px;scroll-margin-top:104px}
.tm-grid{display:grid;grid-template-columns:repeat(3,357px);gap:32px 136px;justify-content:center}
.tm-card:nth-child(-n+3){margin-bottom:44px}
.tm-card:nth-child(3n+2){position:relative;left:5px}
.tm-card{position:relative;width:357px;padding-top:83px}
.tm-photo{position:absolute;left:78px;top:0;z-index:1;width:200px;height:200px;border-radius:5px;border:1px solid rgba(0,0,0,.05);box-sizing:border-box;object-fit:cover;display:block;background:#fff}
.tm-box{box-sizing:border-box;min-height:415px;border:2px solid #3D9BE9;border-radius:5px;padding:143px 26px 20px;text-align:center}
.tm-box-orange{border-color:#ED5829}
.tm-name{margin:0 0 6px;font-family:"Poppins Wix",var(--display);font-weight:600;font-size:20px;line-height:1;letter-spacing:normal;color:#FF6161;text-wrap:wrap}
.tm-role{margin:0 0 20px;font-family:"Poppins Wix",var(--display);font-weight:600;font-size:17px;line-height:1;letter-spacing:normal;color:#3D9BE9}
.tm-bio{cursor:pointer;margin:0;min-height:105px;font-family:var(--display);font-weight:400;font-size:15px;line-height:1.4;color:#6E7A86;display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden}
.tm-card.is-open .tm-bio{display:block;-webkit-line-clamp:unset;overflow:visible}
.tm-more{display:block;margin:16px auto 0;padding:0;background:none;border:0;font-family:var(--display);font-weight:700;font-size:14px;line-height:1;color:#1a1a1a;cursor:pointer}
.tm-more:hover{color:#005787;text-decoration:underline}
.tm-social{display:flex;justify-content:center;gap:13px;margin-top:16px}
.tm-social a{display:block;line-height:0;transition:transform .25s ease;will-change:transform}
.tm-social a:hover{transform:scale(1.1)}
.tm-social img{display:block;width:35px;height:35px}
.tm-action{background:#fff;text-align:center;padding:63px var(--gutter) 77px}
.tm-action-h{margin:0 0 19px;font-family:"Poppins Wix",var(--display);font-weight:600;font-size:46px;line-height:1.2;letter-spacing:.05em;color:#005787}
.tm-action-p{margin:0 auto;width:774px;max-width:100%;font-family:var(--body);font-size:20px;line-height:1.2;color:#000}
.tm-action-btns{display:flex;justify-content:center;gap:18px;margin-top:34px;flex-wrap:wrap}
.tm-btn{display:inline-flex;align-items:center;justify-content:center;width:268px;height:51px;box-sizing:border-box;margin:0;padding:0 16px;border-radius:5px;font-family:"Work Sans",var(--display);font-weight:700;font-size:15px;letter-spacing:0;text-transform:uppercase;line-height:1;transition:transform .25s ease,box-shadow .25s ease,background .15s,color .15s,border-color .15s;will-change:transform}
.tm-btn-fill{background:#ED5829;border:1px solid #ED5829;color:#fff}
.tm-btn-fill:hover{background:#ED5829;border-color:#ED5829;color:#fff}
.tm-btn-line{background:#fff;border:1px solid #005787;color:#005787}
.tm-btn-line:hover{background:#fff;border-color:#005787;color:#005787}
.tm-btn:hover{transform:scale(1.1);box-shadow:0 12px 28px -12px rgba(0,0,0,.45)}
.tm-gallery{background:#005787;padding:0 0 58px}
.tm-collage{position:relative;width:100%}
.tm-tile{position:absolute;margin:0;overflow:hidden;background:#0b3f60;transition:transform .25s ease,box-shadow .25s ease;will-change:transform}
.tm-tile img{display:block;width:100%;height:100%;object-fit:cover}
.tm-tile:hover{transform:scale(1.1);z-index:2;box-shadow:0 12px 28px -12px rgba(0,0,0,.45)}
.tm-tile video{display:block;width:100%;height:100%;object-fit:cover;background:#000}
.tm-tile-video{cursor:pointer}
.tm-yt{display:block;position:relative;width:100%;height:100%;padding:0;margin:0;border:0;background:#000;cursor:pointer}
.tm-yt img{display:block;width:100%;height:100%;object-fit:cover}
.tm-yt iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.tm-tile-yt.is-playing:hover{transform:none;box-shadow:none}
@media(prefers-reduced-motion:reduce){.tm-tile,.tm-btn,.tm-social a{transition:none}.tm-tile:hover,.tm-btn:hover,.tm-social a:hover{transform:none}}
@media(max-width:1400px){.tm-grid{grid-template-columns:repeat(3,357px);gap:48px 40px}}
@media(max-width:1200px){.tm-grid{grid-template-columns:repeat(2,357px);gap:48px 60px}}
@media(max-width:1100px){
.tm-hero{height:auto;padding:150px 0 40px}
.tm-title{padding-top:0;font-size:clamp(40px,9vw,90px)}
.tm-chevron{display:none}
.tm-team{padding:70px var(--gutter) 56px}
.tm-action{padding:48px var(--gutter) 56px}
.tm-action-h{font-size:clamp(28px,5vw,46px)}
}
@media(max-width:820px){.tm-grid{grid-template-columns:357px;gap:40px}}
@media(max-width:420px){.tm-grid{grid-template-columns:1fr}.tm-card{width:auto}.tm-photo{left:calc(50% - 100px)}}

/* ---------- case studies page (Wix layout measured at 1706px; data in content/case-studies.json) ---------- */
.cs-hero{position:relative;background:#005787;color:#fff;height:996px;overflow:hidden}
.cs-hero-bg{position:absolute;left:0;right:0;top:92px;bottom:0;background-size:cover;background-position:center;background-repeat:no-repeat;opacity:.1}
.cs-hero-grad{position:absolute;left:0;right:0;top:92px;height:119px;background:linear-gradient(0deg,rgba(237,88,41,0) 0%,#005787 100%)}
.cs-title{position:relative;margin:0;padding-top:208px;text-align:center;font-family:"Poppins Wix",var(--display);font-weight:600;font-size:125px;line-height:1.2;letter-spacing:.05em;color:#fff;text-wrap:wrap}
.cs-chevron{position:relative;z-index:1;width:100px;height:100px;margin:-3px auto 0}
.cs-chevron svg{width:100px;height:100px}
.cs-intro{position:relative;margin:118px auto 0;width:832px;max-width:calc(100% - 2*var(--gutter));text-align:center;font-family:"Poppins Wix",var(--display);font-weight:200;font-size:25px;line-height:1.4;letter-spacing:0;color:#fff}
.cs-intro p{margin:0;font-size:inherit;line-height:inherit}
.cs-blue{color:#3D9BE9}
.cs-orange{color:#ED5829}
.cs-client{background-color:#005787;color:#fff;padding:93px 0 40px;scroll-margin-top:104px;background-image:linear-gradient(to bottom,rgba(61,155,233,.42) 0,rgba(61,155,233,.18) 5px,rgba(61,155,233,0) 16px);background-repeat:no-repeat}
.cs-wrap{width:978px;max-width:calc(100% - 2*var(--gutter));margin:0 auto;text-align:center}
.cs-h2{margin:0 0 24px;font-family:"Poppins Wix",var(--display);font-weight:600;font-size:46px;line-height:1.2;letter-spacing:.05em;color:#fff;text-wrap:wrap}
.cs-client-p{margin:0 0 57px;font-family:var(--body);font-size:18px;line-height:1.4;color:#fff}
.cs-tags{display:flex;justify-content:flex-start;gap:34px;margin:0 0 78px}
.cs-tag{display:block;box-sizing:border-box;width:302px;min-height:98px;margin:0;padding:18px 0 19px;border:2px solid #3D9BE9;border-radius:5px;font-family:"Poppins Wix",var(--display);font-weight:200;font-size:22px;line-height:1.3;letter-spacing:0;color:#fff;text-align:center;text-decoration:none;transition:transform .25s ease,box-shadow .25s ease;will-change:transform}
.cs-tag:nth-child(3){margin-left:4px}
.cs-tag:hover,.cs-tag:focus{color:#fff;text-decoration:none;transform:scale(1.1);box-shadow:0 12px 28px -12px rgba(0,0,0,.45);z-index:1}
.cs-tags{position:relative}
.cs-tag strong{font-weight:600}
.cs-video{position:relative;width:978px;max-width:100%;height:554px;margin:0 auto;background:#000}
.cs-video video{display:block;width:100%;height:100%;object-fit:cover;background:#000}
.cs-complete{background-color:#005787;color:#fff;padding:77px 0 70px;background-image:linear-gradient(to top,rgba(61,155,233,.42) 0,rgba(61,155,233,.18) 5px,rgba(61,155,233,0) 16px);background-repeat:no-repeat}
.cs-complete .cs-h2{margin-bottom:22px}
/* faded rules either side of the heading, same pair as the Testimonials heading (340px, 2px) */
.cs-h2-rules{display:flex;align-items:center;justify-content:center;gap:20px;padding:0 var(--gutter);text-align:center}
.cs-h2-rules .cs-h2-text{flex:0 0 auto}
.cs-h2-rules::before,.cs-h2-rules::after{content:"";flex:0 1 340px;min-width:0;height:2px;transform:translateY(-2px)}
.cs-h2-rules::before{background:linear-gradient(to right,transparent,rgba(61,155,233,.75) 53.5%,transparent)}
.cs-h2-rules::after{background:linear-gradient(to right,transparent,rgba(61,155,233,.75) 46.5%,transparent)}
@media(max-width:600px){.cs-h2-rules::before,.cs-h2-rules::after{display:none}}
.cs-download{margin:0 0 86px;font-family:var(--body);font-size:18px;line-height:1.4;color:#fff}
.cs-tiles{display:flex;justify-content:center;gap:62px;flex-wrap:wrap}
.cs-tile{display:block;width:165px;text-align:left;color:#fff;text-decoration:none;transition:transform .4s ease-in-out;will-change:transform}
.cs-tile:hover,.cs-tile:focus{color:#fff;text-decoration:none;transform:scale(1.05);z-index:1}
.cs-tile img{display:block;width:151px;height:184px;object-fit:cover;margin:0 0 11px}
.cs-tile-cap{margin:0;width:141px;font-family:var(--body);font-size:15px;line-height:1.4;color:#fff}
@media(prefers-reduced-motion:reduce){.cs-tile,.cs-tag{transition:none}.cs-tile:hover,.cs-tag:hover{transform:none}}
@media(max-width:1100px){
.cs-hero{height:auto;padding-bottom:64px}
.cs-hero-bg,.cs-hero-grad{top:0}
.cs-title{padding-top:150px;font-size:clamp(40px,9vw,90px)}
.cs-chevron{display:none}
.cs-intro{margin-top:48px;font-size:clamp(18px,2.4vw,25px)}
.cs-client{padding:64px 0 32px}
.cs-h2{font-size:clamp(28px,5vw,46px)}
.cs-tags{flex-wrap:wrap;justify-content:center;margin-bottom:48px}
.cs-tag:nth-child(3){margin-left:0}
.cs-video{height:auto;aspect-ratio:978/554}
.cs-complete{padding:56px 0 56px}
.cs-download{margin-bottom:48px}
}
@media(max-width:420px){.cs-tag{width:100%}.cs-tiles{gap:32px}}

/* ---------- our process page ----------
   The HERO still uses Wix's absolute layout: the fading word slideshow and the "HOW WE DO IT?"
   hover both depend on hand placed coordinates, and they work, so they were left alone.

   EVERYTHING BELOW THE HERO WAS REBUILT ON REAL LAYOUT (2026-09-01). It used to be a 980px stage
   where every element carried a measured x/y from the Wix page. Three things followed from that:
     - the 41 check icons were a SEPARATE absolutely positioned layer from the text they belonged
       to, aligned by hand per item, which is exactly why they read as crunched and uneven;
     - all 41 were display:none below 1100px, so phones got bare lists with no checks at all;
     - any copy edit broke the alignment, because the coordinates did not know about the text.
   Now the lists are real lists, the boxes are a real grid, and spacing is a property of the
   layout rather than a set of numbers somebody has to maintain by hand. */

/* ---------- shared ---------- */
.op-stage{position:relative;z-index:1;width:980px;margin:0 auto}   /* hero only */
.op-wrap{width:100%;max-width:1160px;margin:0 auto;padding:0 var(--gutter);box-sizing:border-box}
.op-orange{color:#ED5829}
.op-h2{margin:0;text-align:center;font-family:"Poppins Wix",var(--display);font-weight:600;
  font-size:clamp(28px,3vw,40px);line-height:1.15;letter-spacing:normal;color:#fff;text-wrap:balance}
.op-h2-navy{color:#005787}
.op-h2-blue{color:#3D9BE9}
/* the accent rule under a section heading: the same 3px orange bar the email and SEO tiles use */
.op-hrule{width:64px;height:3px;margin:18px auto 0;border:0;border-radius:2px;background:#ED5829}

/* ---------- the check list ----------
   One grid per item: a fixed icon column and a text column. The icon can no longer drift from its
   line, a point that wraps indents under itself instead of under the icon, and the gaps come from
   one `gap` rather than from 41 hand set y coordinates. */
.op-list{list-style:none;margin:0;padding:0;display:grid;gap:18px}
.op-list li{display:grid;grid-template-columns:24px 1fr;gap:0 14px;align-items:start;
  font-family:var(--body);font-size:16px;line-height:1.6}
.op-list img{display:block;width:24px;height:24px;margin-top:2px}
.op-list-sm{gap:14px}
.op-list-sm li{font-size:15px;line-height:1.55}

/* ---------- a section that is a list beside a picture ---------- */
.op-split{display:grid;grid-template-columns:1fr auto;gap:56px;align-items:center;margin-top:44px}
.op-split-art{display:block;height:auto;max-width:100%;justify-self:center}

/* ---------- hero (Wix absolute layout, unchanged) ---------- */
.op-hero{position:relative;height:800px;background:#005787;color:#fff;overflow:hidden}
.op-hero-video{position:absolute;left:0;top:0;width:100%;height:100%;object-fit:cover;object-position:center bottom;opacity:.3}
.op-word{position:absolute;margin:0;font-family:"Poppins Wix",var(--display);font-weight:200;font-size:28px;line-height:normal;letter-spacing:normal;color:#4081A5;white-space:nowrap}
.op-word-22{font-size:22px;line-height:1.4;text-align:right}
.op-word{opacity:0;animation-timing-function:linear;animation-iteration-count:infinite;animation-fill-mode:both}
.op-word-long{animation-name:op-fade-long;animation-duration:8.2s}
.op-word-mid{animation-name:op-fade-mid;animation-duration:6.1s}
.op-word-exec{animation-name:op-fade-short;animation-duration:2.8s}
.op-word-def{animation-name:op-fade-short;animation-duration:3s}
.op-word-pair{animation-name:op-fade-pair;animation-duration:4.9s}
@keyframes op-fade-long{0%{opacity:0}8%{opacity:1}45%{opacity:1}53%{opacity:0}100%{opacity:0}}
@keyframes op-fade-mid{0%{opacity:0}11%{opacity:1}46%{opacity:1}57%{opacity:0}100%{opacity:0}}
@keyframes op-fade-short{0%{opacity:0}15%{opacity:1}43%{opacity:1}58%{opacity:0}100%{opacity:0}}
@keyframes op-fade-pair{0%{opacity:0}12%{opacity:1}26%{opacity:1}38%{opacity:0}100%{opacity:0}}
.op-how{position:absolute;left:122px;top:235px;width:800px;height:178px;display:block;color:#fff;text-decoration:none}
.op-how:hover,.op-how:focus{color:#fff;text-decoration:none;z-index:1}
.op-how-h{position:absolute;left:-5px;top:44px;width:750px;margin:0;font-family:"Poppins Wix",var(--display);font-weight:600;font-size:100px;line-height:100px;letter-spacing:normal;color:#fff;white-space:nowrap;text-wrap:nowrap;transform-origin:0 50%;transition:letter-spacing .4s ease-in-out}
.op-how:hover .op-how-h,.op-how:focus .op-how-h{letter-spacing:-.1em}
.op-how-q{position:absolute;left:715px;top:10px;width:89px;margin:0;font-family:"Poppins Wix",var(--display);font-weight:600;font-size:140px;line-height:140px;letter-spacing:normal;color:#19ADFF;transform-origin:50% 50%;transition:transform .4s ease-in-out,color .4s ease-in-out;will-change:transform}
.op-how:hover .op-how-q,.op-how:focus .op-how-q{transform:translateX(-106px) scale(1.11) rotate(16deg);color:#ED5829}
.op-quote-band{position:absolute;left:0;right:0;top:585px;height:101px;background:linear-gradient(0deg,#005787 19.53%,rgba(0,87,135,.03) 100%)}
.op-quote{position:absolute;left:0;top:585px;width:981px;height:101px;margin:0;border-radius:10px;background:rgba(255,255,255,.1);text-align:center}
.op-quote blockquote,.op-quote figcaption{position:absolute;left:0;width:980px;margin:0;padding:0;border:0;font-family:var(--body);font-size:17px;line-height:1.4;color:#fff}
.op-quote blockquote{top:29px}
.op-quote figcaption{top:61px;line-height:1.1;font-style:italic;color:#3D9BE9}

/* ---------- our philosophy ---------- */
.op-phil{background:#98C8F0;border-bottom:3px solid #005787;padding:56px 0 60px;scroll-margin-top:104px}
.op-phil .op-h2{color:#005787}
.op-phil .op-split{grid-template-columns:1fr auto 1fr;gap:40px}
.op-phil .op-list li{color:#0B3A57}
/* the pull quote that used to be eight separately positioned words */
.op-motto{margin:0;font-family:"Poppins Wix",var(--display);font-size:clamp(23px,2.3vw,31px);
  line-height:1.4;letter-spacing:normal}
.op-motto span{display:block;white-space:nowrap}
.op-motto b{font-weight:600;color:#005787}
.op-motto i{font-style:normal;font-weight:300;color:#ED5829;font-size:1.26em}
.op-motto em{font-style:normal;font-weight:300;color:#fff}

/* ---------- what we do ---------- */
.op-what{background:#005787;color:#fff;padding:56px 0 72px}
.op-what-sub{margin:20px auto 0;max-width:900px;text-align:center;font-family:var(--body);
  font-weight:700;font-size:clamp(17px,1.5vw,20px);line-height:1.5;color:#3D9BE9;text-wrap:balance}
/* Same tile language as the six on /email-marketing and /seo-services, two columns because this
   copy runs four to six lines. Fill lighter than the navy band: a tile that carries a drop shadow
   has to be lighter than its ground. White on #0F6EA3 is 5.56:1. */
.op-tiles{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;margin-top:40px}
.op-tile{display:flex;flex-direction:column;box-sizing:border-box;background:#0F6EA3;
  border:1px solid rgba(255,255,255,.18);border-radius:5px;padding:26px 28px 30px;
  box-shadow:0 1px 3px rgba(0,0,0,.5);transition:transform .25s ease,box-shadow .25s ease;will-change:transform}
.op-tile:hover{transform:scale(1.04);position:relative;z-index:1;box-shadow:0 12px 28px -12px rgba(0,0,0,.45)}
@media(prefers-reduced-motion:reduce){.op-tile{transition:none}.op-tile:hover{transform:none}}
.op-tile h3{margin:0;font-family:var(--display);font-weight:600;font-size:19px;line-height:1.35;
  letter-spacing:.02em;text-transform:uppercase;color:#fff;text-wrap:balance;min-height:2.7em}
.op-tile h3::after{content:"";display:block;width:44px;height:3px;margin-top:13px;background:#ED5829;border-radius:2px}
.op-tile p{margin:15px 0 0;font-family:var(--body);font-size:15px;line-height:1.7;color:#fff}

/* ---------- our process ---------- */
.op-process{position:relative;background:#fff;padding:56px 0 64px;overflow:hidden}
.op-process::before{content:"";position:absolute;inset:0;background:url(/assets/media/op/watermark.png) center/cover no-repeat;opacity:.25;pointer-events:none}
.op-process .op-wrap{position:relative;z-index:1}
.op-diagram{display:block;width:min(600px,100%);height:auto;margin:36px auto 8px}
.op-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:46px 40px;margin-top:36px}
.op-col{display:flex;flex-direction:column}
.op-col-icon{display:block;width:auto;height:74px;margin:0 0 16px;object-fit:contain;object-position:left center;align-self:flex-start}
.op-col-title{margin:0;font-family:"Poppins Wix",var(--display);font-weight:600;
  font-size:26px;line-height:1.2;letter-spacing:normal;color:#3D9BE9}
.op-col-title::after{content:"";display:block;width:44px;height:3px;margin:12px 0 20px;background:#ED5829;border-radius:2px}
.op-col .op-list li{color:#1C1C1C}
.op-stmt{margin:56px auto 0;max-width:820px;text-align:center;font-family:var(--display);
  font-weight:300;font-size:clamp(26px,2.6vw,38px);line-height:1.35;letter-spacing:normal;color:#005787;text-wrap:balance}

/* ---------- how we work / engagement options ---------- */
.op-work{background:#005787;color:#fff;padding:56px 0 60px}
.op-work .op-list li{color:#fff}
.op-work .op-split-art{max-width:300px}
/* auto columns + centred, so the list and the picture read as one group. With 1fr the list was
   pinned to the left edge and the art to the right, leaving a hole down the middle. */
.op-work .op-split,.op-engage .op-split{grid-template-columns:auto auto;justify-content:center;
  gap:clamp(36px,6vw,88px)}
.op-work .op-list,.op-engage .op-list{max-width:560px}
.op-engage{background:#BFD5E1;padding:56px 0 60px}
.op-engage .op-h2{color:#3D9BE9}
.op-engage .op-list li{color:#0B3A57}
.op-engage .op-split-art{max-width:128px}

@media(prefers-reduced-motion:reduce){.op-how-h,.op-how-q{transition:none}.op-how:hover .op-how-q{transform:none}.op-word{animation:none;opacity:1}.op-word-pair+.op-word-pair{display:none}}

@media(max-width:1000px){
.op-cols{grid-template-columns:repeat(2,1fr);gap:38px 32px}
.op-tiles{grid-template-columns:1fr}
.op-phil .op-split{grid-template-columns:1fr;gap:32px;justify-items:center}
.op-phil .op-list{justify-self:stretch}
.op-motto span{white-space:normal}
}
@media(max-width:1100px){
/* the hero is the only part still positioned by hand, so it keeps the old fallback */
.op-stage{width:auto;padding:0 var(--gutter)}
.op-hero{height:auto;padding:150px 0 40px}
.op-word,.op-quote-band{display:none}
.op-how{position:static;width:auto;height:auto}
.op-how-h{position:static;width:auto;font-size:clamp(40px,9vw,80px);line-height:1.1;letter-spacing:-.05em;white-space:normal;text-wrap:wrap}
.op-how-q{position:static;display:inline;font-size:1.3em;line-height:1}
.op-quote{position:static;width:auto;height:auto;padding:20px;margin-top:32px}
.op-quote blockquote,.op-quote figcaption{position:static;width:auto}
.op-quote figcaption{margin-top:8px}
}
@media(max-width:680px){
.op-cols{grid-template-columns:1fr;gap:34px}
.op-split{grid-template-columns:1fr;gap:28px;justify-items:center}
.op-work .op-list,.op-engage .op-list{justify-self:stretch}
.op-col-icon{height:62px}
.op-col-title{font-size:23px}
}

/* ---------- AI consulting page (Wix layout measured at 1706px; data in content/ai-consulting.json) ---------- */
.ai-stage{position:relative;z-index:1;width:1260px;margin:0 auto}
.ai-sec{position:relative;background:#fff}
.ai-sec.ai-grey{background:#F7F8FA}
.ai-sec.ai-navy{background:#005787;color:#fff}
.ai-rule{position:absolute;left:0;right:0;top:0;height:2px;background:#E2E2E2}
.ai-abs{position:absolute;margin:0}
.ai-eyebrow{font-family:"Poppins Wix",var(--display);font-weight:600;font-size:15px;line-height:21px;letter-spacing:1.5px;text-transform:uppercase;color:#ED5829;white-space:nowrap}
.ai-h2{font-family:"Poppins Wix",var(--display);font-weight:600;font-size:42px;line-height:1.2;letter-spacing:normal;color:#000;text-wrap:wrap}
.ai-p{font-family:Arial,Helvetica,sans-serif;font-size:18px;line-height:1.6;color:#000}
.ai-p p{margin:0;font-size:inherit;line-height:inherit}
.ai-btn{position:absolute;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;height:48px;margin:0;padding:0 16px;border-radius:5px;font-family:"Work Sans",var(--display);font-weight:700;font-size:15px;letter-spacing:1.5px;line-height:1;text-transform:uppercase;text-decoration:none;color:#fff;white-space:nowrap;transition:transform .25s ease,box-shadow .25s ease,background .15s,color .15s}
.ai-btn-fill{background:#ED5829;border:2px solid #ED5829}
.ai-btn-line{background:transparent;border:2px solid #ED5829}
.ai-btn-navy{background:#005787;border:2px solid #005787}
.ai-btn:hover,.ai-btn:focus{color:#fff;text-decoration:none;transform:scale(1.05);box-shadow:0 12px 28px -12px rgba(0,0,0,.45)}
.ai-btn-sm{font-size:13px;letter-spacing:1.3px}
/* hero */
.ai-hero{position:relative;height:888px;background:#005787;color:#fff;overflow:hidden}
.ai-hero-bg{position:absolute;left:0;right:0;top:92px;bottom:0;background-size:cover;background-position:center;opacity:.4}
.ai-hero .ai-eyebrow{color:#BFD5E1}
.ai-h1{font-family:"Poppins Wix",var(--display);font-weight:600;font-size:70px;line-height:84px;letter-spacing:normal;color:#fff;text-wrap:wrap}
.ai-hero-p{font-family:Arial,Helvetica,sans-serif;font-size:24px;line-height:33.6px;color:#fff}
.ai-hero-note{font-family:Arial,Helvetica,sans-serif;font-size:15px;line-height:21px;color:#fff}
/* next steps cards */
.ai-card{position:absolute;box-sizing:border-box;width:606px;height:585px;background:#fff;border:1px solid #E2E2E2;box-shadow:0 1px 4px 0 rgba(0,0,0,.6)}
.ai-card .ai-eyebrow{font-size:13px;line-height:18.2px;letter-spacing:1.3px}
.ai-card-navy .ai-eyebrow{color:#005787}
.ai-card-title{font-family:"Poppins Wix",var(--display);font-weight:600;font-size:24px;line-height:33.6px;color:#000;white-space:nowrap}
.ai-card-desc{font-family:Arial,Helvetica,sans-serif;font-size:15px;line-height:24px;color:#000}
.ai-card-fit{font-family:Arial,Helvetica,sans-serif;font-size:15px;line-height:18px;font-weight:700;color:#000}
.ai-card-row{position:absolute;left:55px;width:443px;height:18px}
.ai-card-row svg{position:absolute;left:0;top:0;width:17px;height:17px;fill:#ED5829}
.ai-card-navy .ai-card-row svg{fill:#005787}
.ai-card-row span{position:absolute;left:35px;top:0;width:408px;font-family:Arial,Helvetica,sans-serif;font-size:15px;line-height:18px;color:#000;white-space:nowrap}
.ai-card-price{font-family:"Poppins Wix",var(--display);font-weight:600;font-size:20px;line-height:28px;color:#000;white-space:nowrap}
/* approach */
.ai-h2-tall{line-height:1.4}
.ai-ap{position:absolute;width:401px}
.ai-ap-rule{position:absolute;left:3px;top:7px;width:388px;height:2px;background:#005787}
.ai-ap-n{position:absolute;left:3px;top:44px;margin:0;font-family:"Poppins Wix",var(--display);font-weight:600;font-size:13px;line-height:18.2px;letter-spacing:1.3px;color:#ED5829}
.ai-ap-t{position:absolute;left:3px;top:75px;width:363px;margin:0;font-family:"Poppins Wix",var(--display);font-weight:600;font-size:20px;line-height:24px;color:#000;white-space:nowrap}
.ai-ap-d{position:absolute;left:3px;top:115px;width:372px;margin:0;font-family:Arial,Helvetica,sans-serif;font-size:16px;line-height:22.4px;color:#000}
/* why different callout */
.ai-callout{position:absolute;box-sizing:border-box;width:620px;height:221px;background:#fff;border:1px solid rgba(0,0,0,.2);border-left:3px solid #ED5829}
.ai-callout .ai-caps{position:absolute;left:26px;top:29px;width:569px;margin:0;font-family:"Poppins Wix",var(--display);font-weight:600;font-size:15px;line-height:21px;letter-spacing:1.5px;color:#ED5829}
.ai-callout .ai-callout-p{position:absolute;left:26px;top:86px;width:590px;margin:0;font-family:Arial,Helvetica,sans-serif;font-size:15px;line-height:21px;color:#787474}
/* who it fits */
.ai-list{position:absolute;width:798px;margin:0;padding:0;list-style:none}
.ai-list li{position:relative;box-sizing:border-box;height:67px;border-top:2px solid #E2E2E2}
.ai-list li:last-child{height:69px;border-bottom:2px solid #E2E2E2}
.ai-list svg{position:absolute;left:5px;top:29px;width:23px;height:12px;fill:#ED5829}
.ai-list span{position:absolute;left:48px;top:23px;width:713px;font-family:Arial,Helvetica,sans-serif;font-size:17px;line-height:23.8px;color:#000;white-space:nowrap}
/* choose band + cta band */
.ai-h2-36{font-size:36px;line-height:43.2px;color:#fff}
.ai-p16{font-family:Arial,Helvetica,sans-serif;font-size:16px;line-height:22.4px;color:#fff}
.ai-lead{font-family:Arial,Helvetica,sans-serif;font-weight:700;font-size:18px;line-height:25.2px;color:#fff;white-space:nowrap}
/* faq accordion (Wix FAQ app, 4-line theme) */
.ai-p-14{line-height:1.4}
.ai-faq{height:auto;padding-bottom:53px}
.ai-faq .ai-stage{padding-top:195px}
.ai-acc{position:relative;width:1241px;margin:0;padding:32px 0}
.ai-acc details{border-bottom:1px solid #E2E2E2}
.ai-acc summary{position:relative;list-style:none;cursor:pointer;padding:26px 48px 26px 0;font-family:"Poppins Wix",var(--display);font-weight:600;font-size:18px;line-height:25.2px;color:#000}
.ai-acc summary::-webkit-details-marker{display:none}
.ai-acc summary::before,.ai-acc summary::after{content:"";position:absolute;right:11px;top:38px;width:15px;height:1px;background:#000;transition:transform .25s ease}
.ai-acc summary::after{transform:rotate(90deg)}
.ai-acc details[open] summary::after{transform:rotate(0)}
.ai-acc summary:hover{color:#005787}
.ai-acc .ai-ans{margin:0;padding:0 48px 16px 0;font-family:Arial,Helvetica,sans-serif;font-size:15px;line-height:24px;color:#2F2E2E}
@media(prefers-reduced-motion:reduce){.ai-btn{transition:none}.ai-btn:hover{transform:none}}
@media(max-width:1340px){.ai-stage{width:auto;padding:0 var(--gutter)}}
@media(max-width:1100px){
.ai-hero,.ai-sec{height:auto!important;padding:56px 0}
.ai-hero{padding-top:150px}
.ai-abs,.ai-btn,.ai-card,.ai-ap,.ai-callout,.ai-list,.ai-acc,.ai-card-row,.ai-card-row svg,.ai-card-row span,.ai-list svg,.ai-list span,.ai-ap-rule,.ai-ap-n,.ai-ap-t,.ai-ap-d,.ai-callout .ai-caps,.ai-callout .ai-callout-p{position:static;width:auto!important;height:auto!important;white-space:normal}
.ai-abs{margin:0 0 18px}
.ai-h1{font-size:clamp(34px,7vw,56px);line-height:1.15}
.ai-h2{font-size:clamp(26px,5vw,42px)}
.ai-btn{display:inline-flex;margin:0 12px 12px 0;white-space:normal;height:auto!important;padding:14px 18px;line-height:1.2}
.ai-card{margin:0 0 24px;padding:28px}
.ai-card-row{display:flex;gap:12px;margin:0 0 12px}.ai-card-row svg{flex:0 0 17px}
.ai-ap{margin:0 0 28px;padding-top:12px;border-top:2px solid #005787}.ai-ap-rule{display:none}.ai-ap-n,.ai-ap-t,.ai-ap-d{margin:0 0 8px}
.ai-callout{padding:22px 22px 22px 24px}.ai-callout .ai-caps{margin-bottom:14px}
.ai-list li{display:flex;gap:16px;align-items:flex-start;padding:16px 0}.ai-list svg{flex:0 0 23px;margin-top:6px}
.ai-choose-col{margin-top:24px}
}

/* ---------- AI strategy workshop page /ai-integration (shares the .ai-* system; data in content/ai-integration.json) ---------- */
.int-hero{height:718px}
.int-stat-l{font-family:"Poppins Wix",var(--display);font-weight:600;font-size:13px;line-height:18.2px;letter-spacing:1.3px;color:#787474;white-space:nowrap}
.int-stat-v{font-family:"Poppins Wix",var(--display);font-weight:600;font-size:22px;line-height:30.8px;color:#000;white-space:nowrap}
.int-step{position:absolute;box-sizing:border-box;width:292px;height:230px;border:1px solid #E2E2E2}
.int-step-n{position:absolute;left:26px;top:29px;margin:0;font-family:"Poppins Wix",var(--display);font-weight:600;font-size:34px;line-height:40.8px;color:#005787}
.int-step-t{position:absolute;left:26px;top:79px;width:264px;margin:0;font-family:"Poppins Wix",var(--display);font-weight:600;font-size:20px;line-height:24px;color:#000;white-space:nowrap}
.int-step-d{position:absolute;left:26px;top:121px;width:242px;margin:0;font-family:Arial,Helvetica,sans-serif;font-size:16px;line-height:22.4px;color:#000}
.int-h3{font-family:"Poppins Wix",var(--display);font-weight:600;font-size:22px;line-height:30.8px;color:#000;white-space:nowrap}
.int-page{position:absolute;width:294px}
.int-page-rule{position:absolute;left:3px;top:7px;width:288px;height:2px;background:#005787}
.int-page-k{position:absolute;left:3px;top:44px;margin:0;font-family:"Poppins Wix",var(--display);font-weight:600;font-size:13px;line-height:18.2px;letter-spacing:1.3px;color:#ED5829;white-space:nowrap}
.int-page-t{position:absolute;left:3px;top:76px;width:248px;margin:0;font-family:"Poppins Wix",var(--display);font-weight:600;font-size:20px;line-height:24px;color:#000}
.int-page-d{position:absolute;left:3px;top:142px;width:265px;margin:0;font-family:Arial,Helvetica,sans-serif;font-size:16px;line-height:22.4px;color:#000}
.int-card{position:absolute;width:400px}
.int-card-t{position:absolute;left:0;top:30px;width:386px;margin:0;font-family:"Poppins Wix",var(--display);font-weight:600;font-size:22px;line-height:30.8px;color:#005787;white-space:nowrap}
.int-card-d{position:absolute;left:0;top:105px;width:352px;margin:0;font-family:Arial,Helvetica,sans-serif;font-size:18px;line-height:25.2px;color:#000}
.int-tagline{font-family:Arial,Helvetica,sans-serif;font-style:italic;font-size:20px;line-height:28px;color:#787474;text-align:center}
.int-th{font-family:"Poppins Wix",var(--display);font-weight:600;font-size:13px;line-height:18.2px;letter-spacing:1.3px;color:#787474;white-space:nowrap}
.int-td{font-family:Arial,Helvetica,sans-serif;font-size:17px;line-height:23.8px;color:#000;white-space:nowrap}
.int-td-b{font-family:Arial,Helvetica,sans-serif;font-weight:700;font-size:17px;line-height:23.8px;color:#005787;white-space:nowrap}
.int-dash{position:absolute;width:19px;height:3px;background:#ED5829}
.int-grule{position:absolute;left:0;width:1261px;height:2px;background:#E2E2E2}
.int-note{font-family:Arial,Helvetica,sans-serif;font-style:italic;font-size:16px;line-height:22.4px;color:#787474}
.int-callout-p a{color:#787474;text-decoration:underline}
.int-callout-p a:hover{color:#005787}
.int-callout{position:absolute;box-sizing:border-box;width:624px;height:180px;background:#fff;border-left:3px solid #ED5829}
.int-callout .ai-caps{position:absolute;left:28px;top:31px;width:293px;margin:0;font-family:"Poppins Wix",var(--display);font-weight:600;font-size:15px;line-height:21px;letter-spacing:1.5px;color:#ED5829;white-space:nowrap}
.int-callout p.int-callout-p{position:absolute;left:28px;top:67px;width:562px;margin:0;font-family:Arial,Helvetica,sans-serif;font-size:15px;line-height:21px;color:#787474}
.int-fit-p{font-family:"Poppins Wix",var(--display);font-weight:600;font-size:20px;line-height:24px;color:#000;text-align:center}
.int-faq{padding-bottom:113px}
.int-ready .ai-h2{color:#fff}
.int-ready .ai-p{color:#fff}
.int-ready-note{font-family:Arial,Helvetica,sans-serif;font-size:15px;line-height:21px;color:#F7F8FA}
.int-rcard{position:absolute;box-sizing:border-box;background:#fff}
.int-rcard .int-lab{position:absolute;margin:0;font-family:"Poppins Wix",var(--display);font-weight:600;font-size:12px;line-height:16.8px;letter-spacing:1.2px;color:#787474}
.int-rcard .int-price{position:absolute;margin:0;font-family:"Poppins Wix",var(--display);font-weight:600;font-size:32px;line-height:38.4px;color:#000;white-space:nowrap}
.int-rcard .int-rp{position:absolute;margin:0;font-family:Arial,Helvetica,sans-serif;font-size:15px;line-height:21px;color:#787474}
.int-rcard .int-rrule{position:absolute;height:2px;background:#E2E2E2}
.int-rcard .int-lead{position:absolute;margin:0;font-family:"Poppins Wix",var(--display);font-weight:600;font-size:20px;line-height:24px;color:#000;white-space:nowrap}
.int-rcard iframe{position:absolute;border:0;border-radius:8px;background:#fff}
@media(max-width:1100px){
.int-hero{height:auto!important}
.int-step,.int-page,.int-card,.int-callout,.int-rcard,.int-step-n,.int-step-t,.int-step-d,.int-page-k,.int-page-t,.int-page-d,.int-card-t,.int-card-d,.int-rcard .int-lab,.int-rcard .int-price,.int-rcard .int-rp,.int-rcard .int-lead,.int-rcard iframe,.int-callout .ai-caps,.int-callout p.int-callout-p{position:static;width:auto!important;height:auto!important;white-space:normal}
.int-step{margin:0 0 16px;padding:20px}.int-step-n,.int-step-t,.int-step-d{margin:0 0 8px}
.int-page{margin:0 0 24px;padding-top:12px;border-top:2px solid #005787}.int-page-rule{display:none}.int-page-k,.int-page-t,.int-page-d{margin:0 0 8px}
.int-card{margin:0 0 24px}.int-card-t,.int-card-d{margin:0 0 8px}
.int-dash,.int-grule{display:none}
.int-callout{margin:24px 0;padding:22px 22px 22px 24px}.int-callout .ai-caps{margin-bottom:12px}
.int-rcard{margin-top:32px;padding:28px}.int-rcard .int-lab,.int-rcard .int-price,.int-rcard .int-rp,.int-rcard .int-lead{margin:0 0 12px}.int-rcard .int-rrule{position:static;margin:16px 0}.int-rcard iframe{width:100%!important;height:700px!important}
}

/* ---------- AI implementation page /ai-implementation-services (shares .ai-* and .int-* systems; data in content/ai-implementation.json) ---------- */
.imp-hero{height:797px}
.imp-card{position:absolute;width:401px;box-sizing:border-box;padding-top:75px}
.imp-card .imp-rule{position:absolute;left:3px;top:7px;width:388px;height:2px;background:#005787}
.imp-card .imp-n{position:absolute;left:3px;top:44px;margin:0;font-family:"Poppins Wix",var(--display);font-weight:600;font-size:13px;line-height:18.2px;letter-spacing:1.3px;color:#ED5829}
.imp-card h3{margin:0 0 0 3px;width:363px;font-family:"Poppins Wix",var(--display);font-weight:600;font-size:20px;line-height:24px;color:#000}
.imp-card p{margin:17px 0 0 3px;width:363px;font-family:Arial,Helvetica,sans-serif;font-size:16px;line-height:22.4px;color:#000}
.imp-example{font-family:Arial,Helvetica,sans-serif;font-style:italic;font-size:20px;line-height:28px;color:#787474;text-align:center}
.imp-example b{font-weight:700}
.imp-tools .ai-h2,.imp-tools .ai-p{color:#fff}
.imp-tools .ai-rule{background:#E2E2E2}
.imp-step{position:absolute;box-sizing:border-box;width:401px;height:274px;background:#fff;border:1px solid #E2E2E2}
.imp-step .int-step-n{left:26px;top:29px}
.imp-step .int-step-t{left:26px;top:80px}
.imp-step .int-step-d{left:26px;top:122px;width:333px}
.imp-stat-v{font-family:"Poppins Wix",var(--display);font-weight:600;font-size:34px;line-height:40.8px;color:#ED5829;white-space:nowrap}
.imp-stat-l{font-family:"Poppins Wix",var(--display);font-weight:600;font-size:18px;line-height:21.6px;color:#fff}
.imp-fits .ai-list span{color:#005787}
.imp-ecard{position:absolute;box-sizing:border-box;background:#fff;border:1px solid #E2E2E2;box-shadow:0 1px 4px 0 rgba(0,0,0,.6)}
.imp-ecard-pop{border:3px solid #005787}
.imp-ecard h3{position:absolute;margin:0;width:293px;font-family:"Poppins Wix",var(--display);font-weight:600;font-size:20px;line-height:28px;color:#000;white-space:nowrap}
.imp-ecard p{position:absolute;margin:0;font-family:Arial,Helvetica,sans-serif;font-size:15px;line-height:21px;color:#787474}
.imp-ecard .ai-btn{font-size:13px;letter-spacing:1.3px;width:304px}
.imp-ecard p.imp-badge{position:absolute;box-sizing:border-box;width:226px;height:27px;margin:0;padding-top:4px;background:#005787;text-align:center;font-family:"Poppins Wix",var(--display);font-weight:600;font-size:13px;line-height:18.2px;color:#fff}
.imp-rcard{position:absolute;box-sizing:border-box;background:#fff;border-radius:5px}
.imp-rcard iframe{position:absolute;border:0;border-radius:8px;background:#fff}
@media(max-width:1100px){
.imp-hero{height:auto!important}
.imp-card,.imp-step,.imp-ecard,.imp-rcard,.imp-card .imp-n,.imp-ecard h3,.imp-ecard p,.imp-badge,.imp-rcard iframe{position:static;width:auto!important;height:auto!important;white-space:normal}
.imp-card{margin:0 0 24px;padding:12px 0 0;border-top:2px solid #005787}.imp-card .imp-rule{display:none}.imp-card h3,.imp-card p{width:auto;margin-left:0}
.imp-step{margin:0 0 16px;padding:20px}
.imp-ecard{margin:0 0 24px;padding:28px}.imp-ecard h3,.imp-ecard p{margin:0 0 12px}.imp-ecard p.imp-badge{position:static;display:inline-block;width:auto!important;height:auto!important;padding:4px 14px;margin-bottom:12px}
.imp-rcard{margin-top:32px;padding:20px}.imp-rcard iframe{width:100%!important;height:700px!important}
}

/* ---------- AI chatbots page /ai-chatbots (shares .ai-*, .int-*, .imp-* systems; data in content/ai-chatbots.json) ---------- */
.cb-hero{height:743px}
.cb-step{height:273px}
.cb-ecard ul{position:absolute;margin:0;padding:0 0 0 29px;font-family:Arial,Helvetica,sans-serif;font-size:16px;line-height:22.4px;color:#005787}
.cb-ecard ul li{margin:0;padding:0}
.cb-ecard ul li::marker{color:#005787}
@media(max-width:1100px){.cb-hero{height:auto!important}.cb-ecard ul{position:static;width:auto!important;margin:0 0 16px}}

/* ---------- blog view / like counters (post footer bar + card footers), live via /api/stats ---------- */
.post-stats{display:flex;align-items:center;gap:22px;margin:-6px 0 22px;padding-bottom:16px;border-bottom:1px solid var(--line);font-family:var(--body);font-size:14px;color:#6E7A86}
.post-stats .ps-stat{display:inline-flex;align-items:center;gap:7px}
.post-stats svg{width:19px;height:19px;display:block}
.ps-like{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;margin:0 -4px 0 auto;padding:0;border:0;border-radius:50%;background:none;color:#6E7A86;cursor:pointer;transition:transform .2s ease,color .2s ease}
.ps-like svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linejoin:round}
.ps-like:hover{color:#ED5829;transform:scale(1.15)}
.ps-like.is-liked{color:#ED5829}
.ps-like.is-liked svg{fill:#ED5829;stroke:#ED5829}
.ps-like:focus-visible{outline:2px solid #3D9BE9;outline-offset:2px}
.post-stats .ps-likes{margin-left:-14px}
.post-card-stats{display:flex;align-items:center;gap:16px;margin-top:auto;padding-top:12px;border-top:1px solid var(--line);font-family:var(--body);font-size:13px;color:#6E7A86}
.post-card-stats .ps-heart{margin-left:auto}
.post-card-stats span{display:inline-flex;align-items:center;gap:6px}
.post-card-stats svg{width:16px;height:16px;display:block}
.post-card-stats .ps-heart svg{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linejoin:round}
@media(prefers-reduced-motion:reduce){.ps-like{transition:none}.ps-like:hover{transform:none}}

/* ---------- website design portfolio: hero preview lightbox ---------- */
.wd-card-img{border:0;padding:0;background:none;width:100%;font:inherit;color:inherit;pointer-events:none}
/* the mockup PNGs have ~12% transparent padding baked in; clip it out of the hit area so the
   clickable box hugs the monitor artwork instead of filling the gap between cards */
.wd-card-img img{pointer-events:auto;cursor:pointer;clip-path:inset(13% 10.5% 7% 10.5%)}
.wd-lb{position:fixed;inset:0;z-index:200;display:none;align-items:center;justify-content:center;padding:2vh 2vw}
.wd-lb[open],.wd-lb.is-open{display:flex}
.wd-lb::backdrop{background:rgba(11,29,53,.82)}
.wd-lb-veil{position:absolute;inset:0;background:rgba(11,29,53,.82);opacity:0;transition:opacity .28s ease}
.wd-lb.is-in .wd-lb-veil{opacity:1}
.wd-lb-box{position:relative;max-width:80vw;max-height:80vh;display:flex;flex-direction:column;
  border-radius:10px;overflow:hidden;background:#0E2542;box-shadow:0 30px 80px -20px rgba(0,0,0,.7);
  opacity:0;transform:scale(.92) translateY(14px);transition:opacity .3s ease,transform .34s cubic-bezier(.2,.9,.3,1.15)}
.wd-lb.is-in .wd-lb-box{opacity:1;transform:none}
.wd-lb-box img{display:block;max-width:80vw;max-height:calc(80vh - 58px);width:auto;height:auto;object-fit:contain;background:#fff}
.wd-lb-bar{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:13px 18px;background:#0E2542;color:#fff}
.wd-lb-name{font-family:var(--display);font-weight:600;font-size:15px;letter-spacing:.04em;text-transform:uppercase;color:#fff}
.wd-lb-url{font-size:13px;color:#9FC3DF;margin-left:auto}
.wd-lb-visit{font-family:"Work Sans",var(--display);font-weight:700;font-size:12px;letter-spacing:.06em;text-transform:uppercase;
  background:var(--orange);color:#fff;text-decoration:none;padding:9px 15px;border-radius:4px;transition:background .15s;white-space:nowrap}
.wd-lb-visit:hover{background:#c8451d;color:#fff}
.wd-lb-close{position:absolute;top:12px;right:12px;z-index:2;width:38px;height:38px;border-radius:50%;border:0;cursor:pointer;
  background:rgba(14,37,66,.86);color:#fff;font-size:22px;line-height:1;display:flex;align-items:center;justify-content:center;
  box-shadow:0 6px 18px -6px rgba(0,0,0,.6);transition:transform .2s ease,background .15s}
.wd-lb-close:hover{transform:scale(1.1);background:var(--orange);color:#fff}
.wd-lb-close:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
body.wd-lb-open{overflow:hidden}
@media(max-width:760px){
  .wd-lb-box,.wd-lb-box img{max-width:94vw}
  .wd-lb-box{max-height:88vh}
  .wd-lb-box img{max-height:calc(88vh - 96px)}
  .wd-lb-bar{flex-wrap:wrap;gap:8px;padding:11px 13px}
  .wd-lb-url{width:100%;margin-left:0;order:3}
  .wd-lb-close{top:8px;right:8px}
}
@media(prefers-reduced-motion:reduce){
  .wd-lb-box{transition:opacity .2s ease;transform:none}
  .wd-lb-veil{transition:opacity .2s ease}
  .wd-lb-close:hover{transform:none}
}

/* graphic design collage: each tile is a button that opens the artwork in the shared lightbox */
.gd-zoom{display:block;width:100%;height:100%;border:0;padding:0;margin:0;background:none;cursor:pointer}
.gd-zoom img{display:block;width:100%;height:100%;object-fit:cover}
.wd-lb-bar[hidden]{display:none}
/* plain previews scale UP to the 80% target: height drives it, max-width clamps wide art
   (the browser keeps the ratio when max-width takes over, so nothing distorts) */
.wd-lb.is-plain .wd-lb-box img{height:80vh;width:auto;max-height:80vh;max-width:80vw;background:none}
@media(max-width:760px){.wd-lb.is-plain .wd-lb-box img{height:auto;max-height:88vh;max-width:94vw}}

/* lightbox: edge arrows step through the gallery; a click anywhere else dismisses */
.wd-lb-nav{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:58px;height:58px;
  display:flex;align-items:center;justify-content:center;padding:0;border:0;border-radius:50%;cursor:pointer;
  background:rgba(14,37,66,.55);color:#fff;opacity:.8;
  transition:opacity .2s ease,background .2s ease,transform .2s ease}
.wd-lb-nav svg{width:26px;height:26px;display:block}
.wd-lb-next svg{transform:scaleX(-1)}
.wd-lb-prev{left:clamp(10px,2.4vw,42px)}
.wd-lb-next{right:clamp(10px,2.4vw,42px)}
.wd-lb-nav:hover{opacity:1;background:var(--orange);transform:translateY(-50%) scale(1.08)}
.wd-lb-nav:focus-visible{opacity:1;outline:3px solid var(--blue);outline-offset:3px}
.wd-lb-nav[hidden]{display:none}
.wd-lb-box{cursor:pointer}
.wd-lb-bar{cursor:default}
.wd-lb-box img{transition:opacity .18s ease}
.wd-lb-box img.is-swapping{opacity:0}
@media(max-width:760px){
  .wd-lb-nav{width:46px;height:46px}
  .wd-lb-nav svg{width:21px;height:21px}
}
@media(prefers-reduced-motion:reduce){
  .wd-lb-nav{transition:opacity .2s ease}
  .wd-lb-nav:hover{transform:translateY(-50%)}
  .wd-lb-box img{transition:none}
}

/* ---------- portfolio page /our-works. Re-measured on the settled Wix page at 1706px 2026-09-01:
   hero blue 0-624, title top 215 (125px/150px, ls 6.25px); row 1 images y=687 x=100/625/1151 at
   425x319, row 2 y=1255, so the row pitch is 568; title 24px/30px 15px under the image, grey sub
   21px/26px 5px under the title. Data in content/our-works.json. ---------- */
.ow-hero{position:relative;background:#005787;color:#fff;height:625px;overflow:hidden}
.ow-title{margin:0;padding-top:215px;text-align:center;font-family:"Poppins Wix",var(--display);
  font-weight:600;font-size:125px;line-height:1.4;letter-spacing:.05em;color:#fff}
.ow-chevron{display:block;width:98px;margin:8px auto 0}
.ow-chevron svg{width:98px;height:98px}
.ow-grid-sec{background:#fff;padding:63px 0 104px}
.ow-grid{display:grid;grid-template-columns:repeat(3,425px);gap:173px 100px;justify-content:center}
.ow-card{position:relative;display:block;text-decoration:none;color:inherit}
.ow-shot{display:block;width:425px;height:319px;background:#eee}
.ow-shot img{display:block;width:100%;height:100%;object-fit:cover;
  transition:transform .35s ease;will-change:transform}
/* Wix hovers by growing the tile itself, measured 425x319 -> 466x349 about its own centre, with
   the image left in full colour. It is allowed to spill past its slot, so no overflow clipping. */
.ow-card:hover .ow-shot img,.ow-card:focus-visible .ow-shot img{transform:scale(1.096)}
.ow-card:hover,.ow-card:focus-visible{z-index:2}
.ow-label{display:block;margin:15px 0 0;text-align:center;font-family:"Poppins Wix",var(--display);font-weight:200;
  font-size:24px;line-height:30px;color:#005787}
.ow-sub{display:block;margin:5px 0 0;text-align:center;font-family:"Poppins Wix",var(--display);font-weight:200;
  font-size:21px;line-height:26px;color:#8D8D8D}
@media(max-width:1500px){
  .ow-grid{grid-template-columns:repeat(3,1fr);gap:110px 40px;max-width:1180px;margin:0 auto;padding:0 var(--gutter)}
  .ow-shot,.ow-shot img{width:100%;height:auto;aspect-ratio:425/319}
}
@media(max-width:900px){
  .ow-hero{height:auto;padding:150px 0 60px}
  .ow-title{padding-top:0;font-size:clamp(44px,10vw,90px)}
  .ow-chevron{display:none}
  .ow-grid{grid-template-columns:1fr;gap:44px}
}
@media(prefers-reduced-motion:reduce){
  .ow-shot img{transition:none}
  .ow-card:hover .ow-shot img{transform:none}
}

/* ---------- typography utilities (tools/_patch_typography.py appended these after 2026-08-26) ---------- */
.f-display{font-family:var(--display)}.f-600{font-weight:600}.f-300{font-weight:300}
.f-light{font-family:var(--display);font-weight:300}
.f-work{font-family:"Work Sans",var(--display)}
.ta-center{text-align:center;margin-left:auto;margin-right:auto}
p.f-light,p.f-display{max-width:72ch}

/* ---------- blog listing redesign (2026-08-31): no hero, navy filter bar, Wix style cards ---------- */
.post-grid{gap:26px}
.post-card .pc-img{display:block}
/* the base crops cards 16/9; covers have headline text baked in, so render them uncropped */
.post-card .pc-img img{width:100%;height:auto;aspect-ratio:auto;object-fit:fill;display:block}
.post-card .body{padding:20px 22px;gap:10px}
.pc-author{display:flex;align-items:center;gap:10px}
.pc-avatar{width:33px;height:33px;border-radius:50%;border:1px solid var(--line)}
.pc-who{display:flex;flex-direction:column;line-height:1.35}
.pc-name{font-size:13px;color:var(--navy)}
.pc-meta{font-size:12.5px;color:var(--navy);opacity:.72}
.post-card h3{font-family:var(--display);font-weight:600;font-size:21px;line-height:1.4;margin:2px 0 0;
  text-transform:none;letter-spacing:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.post-card h3 a{text-decoration:none;color:var(--navy)}
.post-card h3 a:hover{text-decoration:underline}
.post-card p{margin:0;color:var(--navy);font-size:15.5px;line-height:1.55}
.post-card-stats .ps-heart{margin-left:auto}
.blog-listing{padding:40px 0 96px}
.blog-listing .container,.blog-catbar .container{max-width:1480px}
.blog-catbar{background-color:var(--navy-deep);padding:20px 0 26px;
  background-image:linear-gradient(to top,rgba(61,155,233,.42) 0,rgba(61,155,233,.18) 5px,rgba(61,155,233,0) 16px);
  background-repeat:no-repeat}
.blog-catbar .cat-list{margin:0}
.blog-catbar .cat-list a{color:rgba(255,255,255,.72)}
.blog-catbar .cat-list a:hover{color:#fff}
.blog-catbar .cat-list a[aria-current]{color:#fff;font-weight:600}
.blog-h1{font-size:24px;color:#fff;margin:0 0 10px}
.cat-list{gap:4px 18px;margin:0 0 30px}
.cat-list a{padding:4px 0;border:0;border-radius:0;background:none;font-family:var(--display);
  font-size:.8rem;letter-spacing:.02em;color:var(--ink-3)}
.cat-list a:hover{background:none;border:0;color:var(--navy)}
.cat-list a[aria-current]{background:none;border:0;color:var(--navy);font-weight:600}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ---------- team page: HoneyFire group photo hero + closing shot (2026-08-31) ---------- */
.tm-hero-photo{background:#005787 url(/assets/media/team-gallery/honeyfire-team-hero.jpg) center/cover no-repeat}
.tm-hero-photo::before{content:"";position:absolute;inset:0;
  background:linear-gradient(to top,rgba(61,155,233,.42) 0,rgba(61,155,233,.18) 5px,rgba(61,155,233,0) 16px),rgba(20,52,78,.45)}
.tm-hero-photo .tm-title,.tm-hero-photo .tm-chevron{position:relative;z-index:1}
/* title sits below the faces (face band measured at y 72..337 of the 562px hero) */
.tm-hero .tm-title{padding-top:352px}
.tm-outro{margin:5px 0 0}
.tm-outro img{display:block;width:100%;height:auto}

/* ---------- contact page (2026-08-31): real GoHighLevel form embed + clickable NAP rows ---------- */
.contact-form{min-height:0}
.contact-form iframe{display:block;width:100%;height:670px;border:0;background:transparent}
.contact-rows a,.contact-rows .addr{gap:13px}
.contact-rows a{transform-origin:left center;transition:transform .25s ease,color .25s ease;will-change:transform}
.contact-rows a:hover{transform:scale(1.1);color:#ED5829}
.contact-rows a:hover svg{fill:#ED5829}
@media(max-width:900px){.contact-form iframe{height:760px}}
@media(prefers-reduced-motion:reduce){.contact-rows a{transition:color .25s ease}.contact-rows a:hover{transform:none}}

/* ---------- Free SEO Audit box: structure, then the hand built vector background ---------- */
.sec:has(>.container>.audit-box){padding:73px 0 10px}
.audit-box{box-sizing:border-box;width:869px;max-width:100%;min-height:435px;margin:0 auto;padding:42px 79px 10px;border:2px solid var(--orange);border-radius:5px}
.audit-box>*+*{margin-top:22px}
.audit-form{display:block;width:570px;max-width:100%;margin:24px auto 0;text-align:left}
.audit-form .field{display:block;color:#fff;font-size:16px;font-weight:400;margin:0 0 6px}
.audit-form input[type=email]{display:block;width:100%;height:42px;padding:0 12px;border:0;border-radius:2px;background:#fff;color:var(--navy);font:inherit;font-size:16px}
.audit-form .btn{display:block;width:max-content;min-width:100px;margin:24px 0 0 auto;padding:0 28px;height:47px;line-height:47px;text-transform:none;letter-spacing:0;font-size:16px}
@media(max-width:760px){.audit-box{min-height:0;padding:32px 20px 24px}}
/* background clipped inside the orange border */
.audit-box{background:#102343 url(/assets/media/audit/audit-bg.svg) center/cover no-repeat;background-clip:padding-box}

/* ---------- footer: Locations column makes five, socials 4 icons over 3 badges (2026-08-31, 4 wide since the Wix Legend badge 2026-09-07) ---------- */
@media(min-width:760px){.footer-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1000px){.footer-grid{grid-template-columns:1.2fr 1fr 1fr .9fr 1.3fr}}
@media(min-width:1024px){.footer-grid{gap:48px;grid-template-columns:1.2fr .95fr .95fr .9fr 1.3fr}}
.site-footer .social{display:grid;grid-template-columns:repeat(4,44px);justify-items:center;
  align-items:center;gap:16px 14px;margin-top:18px;width:max-content}

/* ---------- website design portfolio: cards ~30% larger, growth taken out of the gutters ---------- */
.wd-card{max-width:389px}
.wd-card-img img{width:325px;transition:transform .32s cubic-bezier(.2,.7,.3,1);will-change:transform}
.wd-card-img:hover img,.wd-card-img:focus-visible img{transform:scale(1.055)}
.wd-card h3{font-size:21px}
.wd-url{font-size:16px}
.wd-go{font-size:15px;padding:15px 21px}
@media(max-width:1100px){.wd-grid{grid-template-columns:repeat(2,1fr);gap:60px 18px}}
@media(min-width:1024px){
  .wd-grid{gap:88px 24px}
  .wd-card{max-width:622px}
  .wd-card-img img{width:493px}
  .wd-card h3{font-size:27px;font-weight:400;margin-top:-3px;color:#2E7BC6;letter-spacing:.02em}
  .wd-url{font-size:21px;margin-top:10px;color:#6f6f6f}
  .wd-go{font-size:17px;padding:20px 34px;margin-top:20px;border-radius:4px}
}
/* PORTFOLIO heading: the same two faded blue rules used on Testimonials and Case Studies */
.wd-portfolio .vp-h2{display:flex;align-items:center;justify-content:center;gap:20px}
.wd-portfolio .vp-h2::before,.wd-portfolio .vp-h2::after{content:"";flex:0 1 340px;min-width:0;height:2px;transform:translateY(-2px)}
.wd-portfolio .vp-h2::before{background:linear-gradient(to right,transparent,rgba(61,155,233,.75) 53.5%,transparent)}
.wd-portfolio .vp-h2::after{background:linear-gradient(to right,transparent,rgba(61,155,233,.75) 46.5%,transparent)}
@media(max-width:600px){.wd-portfolio .vp-h2::before,.wd-portfolio .vp-h2::after{display:none}}
@media(prefers-reduced-motion:reduce){.wd-card-img img{transition:none}.wd-card-img:hover img{transform:none}}

/* ---------- FAQs ~21% larger, block height held by trimming the row padding (2026-08-31) ---------- */
.faq details{padding:10px 0}
.faq summary{font-size:1.23rem}
.faq details p{font-size:1.29rem;line-height:1.6}
/* the FAQ band used the generic .sec 120px default; every other white band runs 84/85 */
.sec:has(>.container>.faq){padding:84px 0 85px}
@media(max-width:760px){.sec:has(>.container>.faq){padding:56px 0 56px}}
/* the AI pages' own accordion, bumped once to match */
.ai-acc summary{padding:23px 48px 23px 0;font-size:19.8px;line-height:27.7px}
.ai-acc summary::before,.ai-acc summary::after{top:36px;width:16px}
.ai-acc .ai-ans{font-size:16.5px;line-height:26.4px}

/* ---------- AI consulting investment card: two price tiers, $1,850 online / $2,850 in person ---------- */
.int-price-mode{margin-left:9px;font-family:"Poppins Wix",var(--display);font-weight:400;
  font-size:15px;line-height:15px;letter-spacing:.02em;color:#787474}

/* ---------- AI automations directory: 2 x 2 card grid, deliberately restrained ---------- */
.auto-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:30px;margin-top:38px}
.auto-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:16px;
  overflow:hidden;transition:transform .28s ease,box-shadow .28s ease,border-color .28s ease}
.auto-card:hover{transform:translateY(-4px);border-color:#CFDBE6;box-shadow:0 22px 46px -26px rgba(20,52,78,.5)}
.auto-media{display:block;line-height:0;background:var(--ground-2)}
.auto-media img{width:100%;height:auto;display:block}
.auto-body{padding:28px 30px 30px}
.auto-card h3{font-family:var(--display);font-weight:600;font-size:1.3rem;line-height:1.3;letter-spacing:-.01em;margin:0 0 12px}
.auto-card h3 a{color:var(--navy);text-decoration:none}
.auto-card h3 a:hover{text-decoration:underline}
.auto-card p{margin:0;color:var(--ink-2);font-size:1.02rem;line-height:1.62}
.auto-card .auto-proof{margin-top:14px;font-size:.9rem;line-height:1.5;color:var(--ink-3)}
.auto-more{display:inline-block;margin-top:18px;font-family:var(--display);font-weight:600;font-size:.86rem;
  letter-spacing:.02em;color:var(--navy);text-decoration:none}
.auto-more:hover{text-decoration:underline}
@media(max-width:860px){.auto-grid{grid-template-columns:1fr;gap:24px}}
@media(prefers-reduced-motion:reduce){.auto-card{transition:none}.auto-card:hover{transform:none}}

/* ---------- recovered 2026-09-01: rules that lived only in site.css and were lost with it ---------- */

/* header floats transparent over a hero and turns navy once you scroll past it */
/* fixed (not sticky) so the hero runs underneath it, transparent until you scroll past the hero */
body.has-hero .site-header{position:fixed;top:0;left:0;right:0;background:transparent}
body.has-hero .site-header.scrolled{background:var(--navy-deep)}

/* kit pages set their own headline case; the generic .hero h1 uppercases everything */
.kit-page>header.hero h1{text-transform:none}

/* footer socials: 44px icons, the two image badges, orange fill + spin on hover */
.site-footer .social a{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;
  border-radius:50%;background:transparent;position:relative;transition:background .2s ease,transform .2s ease}
.site-footer .social a svg{width:44px;height:44px;fill:#fff;display:block;transition:transform .2s ease}
.site-footer .social a.badge img{width:44px;height:44px;display:block;filter:none;transition:transform .2s ease}
.site-footer .social a:hover{background:var(--orange);text-decoration:none}
.site-footer .social a:hover svg,.site-footer .social a:hover img{transform:rotate(359deg) scale(1.2)}
@media(prefers-reduced-motion:reduce){.site-footer .social a:hover svg,.site-footer .social a:hover img{transform:scale(1.1)}}

/* secondary button: outlined in whatever colour its section's text is, so it reads on navy and on white */
.btn-secondary{background:transparent;border-color:currentColor;color:inherit}
.btn-secondary:hover{background:currentColor}
.kit-page>header.hero .btn-secondary:hover{background:#fff;color:var(--navy)}

/* inline colour helpers used in the kit page copy */
.c-navy{color:var(--navy)}
.c-orange{color:var(--orange)}
.blue{color:var(--blue)}
.orange{color:var(--orange)}

/* blog card avatar: the base .post-card img rule would otherwise stretch it to 16/9 */
.post-card .pc-avatar{width:33px;height:33px;aspect-ratio:auto;object-fit:cover;flex:0 0 33px}

/* ---------- recovered 2026-09-01: header bar, dropdowns, home hero, services tiles, parallax.
   Values are the ones signed off on 2026-08-27 (see the project memory) and re-checked against the
   live Wix site: 1261px content strip, logo at -7px, 836px menu box with equal grow items,
   261x48 CTA at strip x996, hero fixed 768px with the text box at top 233px and a 48px cap,
   tiles 263x241 blue/orange checkerboard with white line icons. The tile geometry itself lives in
   tools/_services_geo.css, so nothing here may override its padding, weights or sizes. ---------- */

/* ---- header bar ---- */
/* the navy fades in as you scroll past a hero instead of snapping. The base rule that carried
   this transition was lost with site.css, so the header was popping. */
.site-header{transition:background-color .32s ease}
.site-header .container.bar{max-width:calc(1261px + 2*var(--gutter))}
.site-header .bar{display:flex;align-items:center;justify-content:space-between;gap:0;min-height:104px}
.site-header .logo{flex:0 0 auto;display:inline-flex;align-items:center;margin-left:-7px}
/* logo up 20% on 2026-08-27 (44 -> 53px), then another 10% on 2026-09-01 (53 -> 58.3px). The bar
   keeps its fixed 104px, which still leaves 22.85px of air above and below. */
.site-header .logo img{height:58.3px;width:auto}
/* the ul keeps its default margin/padding, which pushed the row ~8px above the bar's centre */
/* 2026-09-01: the menu was 836px wide and left only 15px either side, so it crowded the logo and
   the CTA. Pulled in 20% to 669px. The labels themselves are 457px, so the room has to come out of
   the item padding (26px -> 12px a side); space-between then shares what is left as ~14px gaps, and
   because the bar is space-between too the 167px freed is split evenly, 135px against the logo and
   135px against the CTA. */
.site-header .nav{flex:0 0 669px;justify-content:space-between;align-items:center;gap:0;
  margin:0;padding:0;list-style:none;align-self:center}
/* Wix sizes each item to its text plus ~26px either side and lets space-between share the
   remainder as equal gaps (~8px). Growing the items instead made short labels sit in wide
   tracks, which is what produced the uneven spacing. */
.site-header .nav>li{position:relative;flex:0 0 auto;display:flex;align-items:center}
.site-header .nav a,.site-header .nav .parent{font-size:16px;font-weight:400;padding:10px 12px;
  line-height:1.25;white-space:nowrap;display:flex;align-items:center}
.site-header .nav a:hover,.site-header .nav .parent:hover,
.site-header .nav a[aria-current="page"]{color:#19ADFF}
.site-header .bar>.btn{flex:0 0 261px;display:inline-flex;align-items:center;justify-content:center;
  width:261px;height:48px;padding:0;line-height:1}

/* dropdown: navy panel, white uppercase items (the base panel is white on white, so items vanished) */
.nav .sub{background:var(--navy-deep);border:0;border-radius:0;padding:6px 0;min-width:262px;
  text-align:left;box-shadow:0 18px 40px -18px rgba(0,0,0,.55)}
.nav .sub a{display:block;padding:12px 20px;font-size:14px;letter-spacing:.05em;text-transform:uppercase;
  color:#fff;white-space:nowrap}
.nav .sub a:hover{color:#19ADFF;background:rgba(255,255,255,.06)}

/* ---- home hero: 768px tall, copy in a 482px column at x208, text box top 233px ---- */
.hero .bg{opacity:var(--media-opacity,.55)}
.hero.tall{height:775px;min-height:0;padding:0;align-items:flex-start}
/* the hero is a flex row, so the container must fill it or it shrinks to the h1 */
.hero.tall .container{max-width:calc(1261px + 2*var(--gutter));width:100%;padding-top:233px}
.hero.tall .stack{text-align:left;align-items:flex-start}
.hero.tall h1{text-transform:none;text-align:left;max-width:482px;margin:0}
.hero.tall .stack>p,.hero.tall .stack>.btn-row{max-width:482px;margin-left:0;margin-right:0}
/* Wix keeps the hero a fixed 775px at any window height, so only give way on very short windows */
@media(max-height:660px){.hero.tall{height:auto;min-height:520px}
  .hero.tall .container{padding-top:clamp(110px,20vh,233px)}}

/* "Extraordinary Results": logo blue with a crisp 2px white rim built from eight zero blur
   text-shadows. text-stroke was tried on 2026-08-27 and rejected for looking jagged. */
.hero.tall h1 .wix-color_41{color:#19ADFF;
  /* 16 zero blur copies rather than 8: at 48px the 8 direction ring showed steps on the
     curves. Still no blur, so the rim stays crisp. text-stroke was rejected 2026-08-27. */
  text-shadow:
     2.0px 0.0px 0 #fff,
     1.85px 0.77px 0 #fff,
     1.41px 1.41px 0 #fff,
     0.77px 1.85px 0 #fff,
     0.0px 2.0px 0 #fff,
     -0.77px 1.85px 0 #fff,
     -1.41px 1.41px 0 #fff,
     -1.85px 0.77px 0 #fff,
     -2.0px 0.0px 0 #fff,
     -1.85px -0.77px 0 #fff,
     -1.41px -1.41px 0 #fff,
     -0.77px -1.85px 0 #fff,
     -0.0px -2.0px 0 #fff,
     0.77px -1.85px 0 #fff,
     1.41px -1.41px 0 #fff,
     1.85px -0.77px 0 #fff}

/* ---- Our Services: watermark, blue centred heading, blue/orange checkerboard ---- */
.services-sec{position:relative;overflow:hidden;background:#fff}
.services-sec .watermark{position:absolute;inset:0;background-repeat:no-repeat;background-position:center;
  background-size:cover;opacity:.27;pointer-events:none;z-index:0}
.services-sec .container{position:relative;z-index:1}
.services-heading{text-align:center;color:var(--blue);font-family:var(--display);font-weight:600}
.service-tiles{display:grid;list-style:none;padding:0}
/* only colour + text behaviour here; size, padding and weights come from _services_geo.css */
.tile-service{box-sizing:border-box;display:flex;flex-direction:column;align-items:center;
  text-align:center;text-decoration:none;color:#fff}
.tile-service.blue{background:#3D9BE9}
.tile-service.orange{background:#ED5829}
/* the extracted Wix icons carry their original hex fills; on the tiles they are white line art */
.tile-service svg path,.tile-service svg polygon,.tile-service svg rect,.tile-service svg circle{fill:#fff}
.tile-service .l1,.tile-service .l2{display:block}

/* ---- horizontal parallax layer (site.js translates it +/-9% of its own width) ---- */
.vp-quote-bg{position:absolute;top:0;bottom:0;left:-13%;width:126%;
  background-size:cover;background-position:center;background-repeat:no-repeat;will-change:transform}
@media(prefers-reduced-motion:reduce){.vp-quote-bg{left:0;width:100%}}

/* Between the mobile menu breakpoint and about 1200px the bar ran out of room: logo + the fixed
   669px menu + the 261px CTA is 1085px, so the CTA was being pushed past the right edge. The menu
   gives up its fixed width there and tightens up instead. */
@media(max-width:1200px){
  .site-header .nav{flex:0 1 auto}
  .site-header .nav>li{margin:0 4px}
  .site-header .nav a,.site-header .nav .parent{padding:10px 8px;font-size:15px}
}

/* ---------- seam between the hero and the Einstein band (signed off 2026-08-27) ----------
   Band top padding 94px / bottom 40px. Inside that top padding sits the single aperture mark
   (the logo "O" from tools/make_shutter_band.py) flanked by two 340px x 2px rules using the same
   fade as the Testimonials heading, plus the light blue edge glow on the band's top and bottom.
   The band carries an inline background shorthand, so both layers have to be pseudo elements. */
.hero.tall + .sec{position:relative;padding-top:94px;padding-bottom:40px}

/* top and bottom edge glow */
.hero.tall + .sec::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
  background:
    linear-gradient(to bottom,rgba(61,155,233,.42) 0,rgba(61,155,233,.18) 5px,rgba(61,155,233,0) 16px) top/100% 16px no-repeat,
    linear-gradient(to top,rgba(61,155,233,.42) 0,rgba(61,155,233,.18) 5px,rgba(61,155,233,0) 16px) bottom/100% 16px no-repeat}

/* the aperture mark with a faded rule either side, all inside the band's top padding */
.hero.tall + .sec::after{content:"";position:absolute;top:25px;left:0;right:0;height:44px;pointer-events:none;z-index:1;
  background:
    url(/assets/media/shutter-mark.svg) center/48px 44px no-repeat,
    /* NB: a percentage background-position resolves against (container - layer), so the offset
       needed for a 340px rule that stops 54px short of centre is 224px, not 394px. */
    linear-gradient(to right,transparent,rgba(61,155,233,.75) 53.5%,transparent) calc(50% - 224px) center/340px 2px no-repeat,
    linear-gradient(to right,transparent,rgba(61,155,233,.75) 46.5%,transparent) calc(50% + 224px) center/340px 2px no-repeat}

.hero.tall + .sec>.container{position:relative;z-index:2}
@media(max-width:900px){
  .hero.tall + .sec{padding-top:72px}
  .hero.tall + .sec::after{background:url(/assets/media/shutter-mark.svg) center/44px 40px no-repeat}
}

/* ---------- home: fold behaviour, Einstein band CTA, client logo hover (2026-09-01) ---------- */

/* The hero is Wix's 775px wherever there is room, but gives way on shorter windows so
   "Albert Einstein said it best!" still clears the fold with ~22px beneath it.
   775 + 94 band padding + 32 line + 22 = 923px, so below that the hero shrinks. */
.hero.tall{height:min(775px,calc(100vh - 148px))}

/* Einstein band CTA at Wix's size (ours had shrunk to 170x44) */
.hero.tall + .sec .btn{font-size:16px;letter-spacing:.08em;height:58px;min-width:311px;padding:0 42px;
  display:inline-flex;align-items:center;justify-content:center;line-height:1;border-radius:5px}

/* client logos grow 10% on hover (they are not links, so the figure carries it) */
.gallery.logos figure{transition:transform .25s ease;will-change:transform}
.gallery.logos figure:hover{transform:scale(1.1);z-index:2;position:relative}
@media(prefers-reduced-motion:reduce){
  .gallery.logos figure{transition:none}
  .gallery.logos figure:hover{transform:none}}

/* ---------- 2026-09-01: two contrast faults on the navy testimonials band ----------
   Both come from base rules that assume everything inside a dark section sits on the dark
   background. The review cards do not: they are white panels dropped onto it.

   1. `.sec.dark a:not(.btn){color:#fff}` (0,3,1) outranked `.review-card .name a{color:inherit}`
      (0,2,1), so reviewer names were white on white and only appeared on hover, where the
      :hover rule repainted them blue.
   2. `.lead` sets its own `--ink-2`, so inheriting #fff from `.sec.dark` never reached it and
      the "Rated 5.0 on Google" line rendered as dark grey on blue. */

.sec.dark .review-card a:not(.btn),
.sec.tinted.dark .review-card a:not(.btn){color:inherit}
.sec.dark .review-card .name a:hover,
.sec.tinted.dark .review-card .name a:hover{color:var(--blue)}

.sec.dark .lead,.sec.tinted.dark .lead,.cta-band .lead{color:#fff}

/* ---------- 2026-09-01: the two buttons under the reviews marquee, 10% larger ----------
   Real size, not a transform, so the text stays crisp. .btn is .85rem / 12px 22px, so 10% up is
   .935rem / 13.2px 24.2px; letter-spacing is already .05em and scales with it, and the 2px border
   stays a hairline.

   That adds 4px of height. Handing it back through the row's own margin does not work, because the
   row is a <p> whose margin-top collapses with the .lead above it. The buttons are flex items, and
   flex item margins never collapse, so the 2px is taken off each of their own edges instead: the
   flex line keeps its old 44px, the buttons overflow it evenly, and nothing below moves.

   Same component on /google-ads and /our-process, so it is styled once. */

.reviews-cta .btn{font-size:.935rem;padding:13.2px 24.2px;margin-top:-2px;margin-bottom:-2px}

/* the footer's coffee CTA, 15% up on the same .85rem / 12px 22px base.
   Its wrapper's top margin is set in build_site.py, and on 2026-09-01 it went to 38px: the button
   had only 5.5px above it and 74.4px below it, which read as cramped against the list and adrift
   from the bar. 38px splits the column's 34.4px of slack so it sits about 38px under the list and
   about 42px above the bottom bar. The Services column still sets the height, so the footer stays
   476.3px. */
.site-footer .btn-primary{font-size:.9775rem;padding:13.8px 25.3px}

/* ---------- 2026-09-01: KEY WEB DESIGN / COMPONENTS INCLUDE, back in line with Wix ----------
   Wix runs this as two galleries: six icons three up, then four icons four up. Our markup already
   does that, but `.vp-icon-grid{grid-template-columns:repeat(4,1fr)}` is defined after
   `.wd-grid-3`, and at equal specificity the later rule wins, so the six were laid out four up and
   wrapped 4 + 2. These selectors carry the section class so they win outright.

   Measured on Wix at 1706px, in its own 1676px strip: grid 1 icon lefts 360/768/1176 (pitch 408),
   grid 2 356/631/906/1181 (pitch 275), every icon 138x124, labels 21px under the icon, row pitch
   214 in grid 1 and grid 2 starting 64px below grid 1. Column pitch fixes the grid widths at
   3*408 = 1224 and 4*275 = 1100. Those pitches are centre to centre, so the tracks carry the
   whole 408 / 275 and the column gap is 0; the items are only ~240px wide and centre in them. */

.wd-icons .vp-icon-grid.wd-grid-3{grid-template-columns:repeat(3,1fr);max-width:1224px;margin:0 auto;gap:46px 0}
.wd-icons .vp-icon-grid.wd-grid-4{grid-template-columns:repeat(4,1fr);max-width:1100px;margin:64px auto 0;gap:46px 0}
.wd-icons .vp-icon-art{width:138px;height:124px;margin:0 auto 21px}

@media(max-width:1300px){
  .wd-icons .vp-icon-grid.wd-grid-3,.wd-icons .vp-icon-grid.wd-grid-4{max-width:100%}
}
@media(max-width:760px){
  .wd-icons .vp-icon-grid.wd-grid-3,.wd-icons .vp-icon-grid.wd-grid-4{grid-template-columns:repeat(2,1fr);gap:40px 12px}
  .wd-icons .vp-icon-grid.wd-grid-4{margin-top:40px}
  .wd-icons .vp-icon-art{width:100px;height:90px}
}

/* ---------- 2026-09-01: footer logo up 30%, then another 10%: 40px -> 52px -> 57.2px ----------
   The 14px margin below it is the base rule's and is left alone, so the gap to the blurb keeps its
   rhythm. The column had 14px of slack under its social grid, which the first 12px of growth all
   but used up, so the second 5.2px has to come from somewhere: the gap above the social grid drops
   18px -> 14px, which also puts it in step with the logo's own 14px. The Services column is what
   sets the 311.5px grid height, and the footer stays 476.3px with about a pixel to spare. Anything
   more in this column and something else has to give. */

.site-footer .logo img{height:57.2px}
/* adjacent margins collapse to the larger of the two, so the blurb's own 15.2px has to come down
   as well or the social grid's 14px never takes effect */
.site-footer .footer-grid>div:first-child>p{margin-bottom:13px}
.site-footer .social{margin-top:14px}

/* ---------- 2026-09-01: /locations hub + the footer's "See more" ----------
   Fourteen cities in the footer column made it a third taller than every column beside it, so the
   column now shows seven and hands the rest to /locations. */

/* the region cards on the hub reuse .service-card, they just carry a list instead of a paragraph */
.loc-card .loc-list{list-style:none;padding:0;margin:14px 0 0;display:grid;gap:8px}
.loc-card .loc-list a{display:inline-block;font-weight:500}
.loc-card p{margin:0;color:var(--ink-2)}

/* footer: reads as the affordance it is without competing with the orange CTA below it */
.site-footer .see-more{display:inline-flex;align-items:center;gap:7px;margin-top:6px;
  font-weight:600;letter-spacing:.02em}
.site-footer .see-more span[aria-hidden]{transition:transform .2s ease}
.site-footer .see-more:hover span[aria-hidden]{transform:translateX(3px)}
@media(prefers-reduced-motion:reduce){.site-footer .see-more span[aria-hidden]{transition:none}
  .site-footer .see-more:hover span[aria-hidden]{transform:none}}

/* ---------- 2026-09-01: the CTA band button, 20% larger ----------
   .btn is .85rem / 12px 22px, so 20% up is 1.02rem / 14.4px 26.4px. The 2px border stays a
   hairline, which is why the measured height lands at 52.4px rather than a clean 53.2px.

   That is 8.1px taller, and it must not grow the band. The band's 8px margin-top is left alone so
   the 25px above the button is unchanged; the 8.1px comes off the bottom as a negative margin
   instead. A negative bottom margin on an inline-block shortens its line box, so the container
   loses exactly what the button gained, at every viewport width, without touching the band's own
   68px / 73px padding. The same band is on the ten service pages, so it is styled once. */

.cta-band .btn{font-size:1.02rem;padding:14.4px 26.4px;margin-bottom:-8.1px}

/* ---------- AI Portfolio hero, /ai-automation-services ----------
   Modeled on darkroomagency.com/case-studies (Ryan, 2026-09-03): a vertical list of project
   names on the left, idle ones faded and the active one full strength, and a fanned stack of
   three images on the right that swaps to whichever name is hovered. Pattern only. The type,
   palette, imagery and copy are all JBC's; nothing of theirs is used.

   Behaviour, in tools/_aip.js (merged into site.js): default active is the first item, the last
   hovered item STAYS active when the pointer leaves so the hero never blanks, keyboard focus
   activates too, and on touch there is no hover so a tap simply follows the link.

   Only the four automations that are actually live for a named business are listed. The page's
   standing honesty rule: nothing that has not shipped goes in the portfolio. */

.aip-hero{background:#fff;padding:52px 0 44px}
.aip-head{max-width:1160px;margin:0 auto;padding:0 var(--gutter);box-sizing:border-box}
.aip-head .eyebrow{margin:0 0 6px;font-family:var(--body);font-weight:600;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:#ED5829}
.aip-head h1{margin:0 0 10px;font-family:"Poppins Wix",var(--display);font-weight:600;font-size:clamp(28px,3vw,40px);line-height:1.15;letter-spacing:normal;text-transform:none;color:#005787}
.aip-lede{margin:0;max-width:600px;font-family:var(--body);font-size:16px;line-height:1.6;color:var(--ink-2)}

.aip-stage{max-width:1160px;margin:40px auto 0;padding:0 var(--gutter);box-sizing:border-box;
  display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:56px;align-items:start}

/* ---- the list. Opacity is the primary cue, exactly as on the reference; the short orange rule
   is the site's own accent, so the pattern reads as JBC rather than as a borrowed page. */
/* idle names sit at .52: Ryan asked for 20 percent darker than the .32 first cut (2026-09-03).
   Rendered on white, navy at .32 averaged about 197/255 and at .52 about 158/255, which is the
   20 percent. Hover and focus still go to 1. */
.aip-list{list-style:none;margin:0;padding:0}
.aip-item a{display:block;padding:7px 0 4px;font-family:"Poppins Wix",var(--display);font-weight:600;
  font-size:clamp(27px,3.5vw,48px);line-height:1.12;letter-spacing:-.012em;color:#005787;
  text-decoration:none;opacity:.52;transition:opacity .25s ease}
.aip-item a::after{content:"";display:block;width:44px;height:3px;margin-top:7px;border-radius:2px;
  background:#ED5829;transform:scaleX(0);transform-origin:left center;transition:transform .25s ease}
.aip-item.is-active a,.aip-item a:hover,.aip-item a:focus-visible{opacity:1;text-decoration:none;color:#005787}
.aip-item.is-active a::after{transform:scaleX(1)}

/* ---- the image sets. Every set sits in the same grid cell, so the column is as tall as the
   tallest set and nothing jumps when they swap. Only the active one is visible. */
.aip-show{display:grid}
.aip-set{grid-area:1/1;opacity:0;visibility:hidden;transition:opacity .3s ease,visibility 0s linear .3s}
.aip-set.is-active{opacity:1;visibility:visible;transition:opacity .3s ease}

/* ---- the fan: three cards in one 16:10 box, positioned in percentages so it scales.
   Front card top left and largest, middle card low right, back card peeking top right. */
.aip-fan{position:relative;margin:0;aspect-ratio:16/10}
.aip-card{position:absolute;display:block;aspect-ratio:16/10;object-fit:cover;object-position:top;
  border-radius:8px;background:#E8EFF6;box-shadow:0 22px 44px -20px rgba(8,45,67,.55)}
.aip-c3{right:0;top:0;width:44%;z-index:0}
.aip-c2{right:5%;top:26%;width:58%;z-index:1}
.aip-c1{left:0;top:5%;width:64%;z-index:2}

.aip-proof{margin:26px 0 0;max-width:540px;font-family:var(--body);font-size:16px;line-height:1.55;color:var(--ink)}
.aip-tags{margin:12px 0 0;display:flex;flex-wrap:wrap;gap:8px}
.aip-tags span{display:inline-block;padding:3px 11px;border:1px solid #005787;border-radius:999px;
  font-family:var(--body);font-weight:600;font-size:12px;line-height:1.6;letter-spacing:.02em;color:#005787}

@media(prefers-reduced-motion:reduce){
  .aip-item a,.aip-item a::after,.aip-set{transition:none}
}
@media(max-width:900px){
  /* the reference collapses to image first, then the list; same here */
  .aip-stage{grid-template-columns:1fr;gap:32px}
  .aip-show{order:-1}
  .aip-item a{font-size:clamp(26px,7vw,36px)}
  .aip-fan{aspect-ratio:16/11}
}

/* ---------- /website-design: Wix Partner Program Legend band (2026-09-07) ----------
   Sits between the hero and PORTFOLIO. The official badge (black disc, white type) on the site's white
   ground, beside a short factual line. Legend is the highest of Wix's four partner levels (Pioneer,
   Creator, Icon, Legend; 5000+ points, per Wix's own levels article). Linked from the footer badge. */
.wd-partner{background:#fff;padding:36px 0 8px}
.wd-partner .container{display:flex;align-items:center;justify-content:center;gap:22px;flex-wrap:wrap;text-align:left}
.wd-partner img{width:104px;height:104px;flex:0 0 auto;display:block}
.wd-partner .eyebrow{margin:0 0 4px;font-family:var(--body);font-weight:600;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:#ED5829}
.wd-partner h2{margin:0 0 4px;font-family:"Poppins Wix",var(--display);font-weight:600;font-size:clamp(20px,2vw,26px);line-height:1.2;letter-spacing:normal;text-transform:none;color:#005787}
.wd-partner p{margin:0;max-width:520px;font-family:var(--body);font-size:16px;line-height:1.55;color:var(--ink-2)}
@media(max-width:600px){.wd-partner .container{flex-direction:column;text-align:center}.wd-partner img{width:92px;height:92px}}

/* ---------- phone layout fixes (2026-09-07, found the evening the site went live) ----------
   The desktop geometry files reproduce Wix at 1261px and several of them never had a phone
   branch. This file is loaded last, so it wins. Every rule here is scoped to a max-width query
   and leaves the signed-off desktop values alone.

   1. Header. The CTA is a fixed 261px button; with the logo and the Menu toggle that is 514px, so
      on a 390px phone the CTA ran off the edge and the Menu button sat at x=427, off screen. No
      phone visitor could open the navigation. Below 1024px the CTA shrinks to its content, and
      below 560px it shows the short "Call" label (markup in build_site.py nav_html). */
.header-cta .cta-short{display:none}
@media(max-width:1023px){
  .site-header .bar{min-height:72px;gap:10px}
  .site-header .logo{margin-left:0}
  .site-header .logo img{height:44px}
  .site-header .bar>.btn{flex:0 1 auto;width:auto;min-width:0;height:40px;padding:0 16px;
    font-size:12px;letter-spacing:.06em;white-space:nowrap;margin-left:auto}
  .site-header .bar>.btn:hover{transform:none}
  .menu-toggle{flex:0 0 auto;padding:8px 0 8px 6px}
}
@media(max-width:560px){
  .site-header .header-cta .cta-full{display:none}
  .site-header .header-cta .cta-short{display:inline}
  .site-header .bar>.btn{padding:0 14px}
}

/* 2. Home hero: Wix pins it at 775px with 233px of top padding, which on a phone is a screen and a
      half of navy before the headline. */
@media(max-width:760px){
  .hero.tall{height:auto;min-height:0}
  .hero.tall .container{padding-top:128px;padding-bottom:56px}
}

/* 3. Our Services tiles. tools/_services_geo.css only defines the 263x241 desktop tiles inside a
      min-width:900px query; below that the SVG icons had no height and scaled to the full tile
      width, so each service was a screen-tall icon with the label squeezed underneath. */
@media(max-width:899px){
  .services-sec{padding:44px 0 52px}
  .services-heading{font-size:clamp(28px,7.5vw,40px);line-height:1.2;letter-spacing:.03em;margin:0 0 24px}
  .service-tiles{grid-template-columns:repeat(2,1fr);gap:12px;max-width:560px;margin:0 auto;justify-content:stretch}
  .service-tiles .tile-service:nth-child(n+4):nth-child(-n+6){margin-top:0}
  .tile-service{width:auto;height:auto;aspect-ratio:1/1;border-radius:5px;padding:20px 8px 0;justify-content:flex-start}
  .tile-service svg{width:auto;height:46px;max-width:92px;margin-bottom:12px}
  .tile-service .l1,.tile-service .l2{font-size:clamp(14px,4.2vw,18px);line-height:1.25}
}

/* 4. Our Process: the What we do / Engagement splits keep "auto auto" columns below 680px because
      that rule is more specific than the generic 1fr fallback, so the list and the artwork sat
      side by side in 423px and the list was pushed 35px off the left edge. */
@media(max-width:680px){
  .op-work .op-split,.op-engage .op-split{grid-template-columns:1fr;justify-items:center}
  .op-work .op-split-art{max-width:220px}
  .op-work .op-list,.op-engage .op-list{max-width:100%}
}

/* 5. Website design portfolio: 06-portfolio-cards.css keeps two columns down to phone width, and
      two 262px mockup cards do not fit in 390px. One column below 600px. */
@media(max-width:600px){
  .wd-grid{grid-template-columns:1fr;gap:48px}
  .wd-card{max-width:100%}
  .wd-card img{max-width:100%;height:auto}
}

/* 6. SEO services: _seo.css has a 1100px branch, but the per section widths (.seo-s1 .seo-checks
      542px, .seo-sN .seo-copy 506/526px, .seo-s3/.seo-s6 .seo-h2 513px) are more specific than its
      .seo-text{width:auto} reset, and a grid item grows to its content's min width, so the text
      column was 542px inside a 390px phone. */
@media(max-width:1100px){
  .seo-two>*{min-width:0}
  .seo-s1 .seo-copy,.seo-s1 .seo-checks,.seo-s2 .seo-copy,.seo-s3 .seo-h2,.seo-s3 .seo-copy,
  .seo-s5 .seo-copy,.seo-s5 .seo-checks,.seo-s6 .seo-h2,.seo-s6 .seo-copy,.seo-s7 .seo-copy,
  .seo-s8 .seo-copy,.seo-h2{width:auto;max-width:100%}
  .seo-s4,.seo-s9{padding-left:var(--gutter);padding-right:var(--gutter)}
  .seo-pdfs{gap:24px}
  .seo-pdf,.seo-pdf img{width:min(227px,42vw)}
  .seo-pdf img{height:auto}
  .seo-pdf span{width:auto}
  .seo-boxes{grid-template-columns:1fr;max-width:420px;margin:0 auto}
}

/* 7. AI strategy workshop: the 1100px branch in _int.css resets every positioned block except the
      pricing card's inline sized rule (style width), which stayed 404px wide. */
@media(max-width:1100px){
  .int-rcard .int-rrule{width:auto!important}
  .int-th,.int-td,.int-td-b,.int-h3,.int-stat-l,.int-stat-v{white-space:normal}
}

/* 8. Graphic design components: _gd.css drops the icon grid to one column below 600px, which is a
      screen per icon. Two columns, like the video and drone pages already do. */
@media(max-width:600px){
  .gd-grid{grid-template-columns:repeat(2,1fr);gap:32px 12px}
}

/* 9. Our Process hero: below 1100px the title goes static and block, so its "?" wrapped onto its
      own line. Inline keeps "HOW WE DO IT?" together. */
@media(max-width:1100px){
  .op-how-h{display:inline}
}
