/* ===========================================================
   TandemHelp — personal assistance
   TandemHelp light-mode brand system.
   =========================================================== */

:root{
  --dark:#003B2B;          /* forest green */
  --body:#424242;          /* body copy */
  --accent:#5ca00d;        /* bright primary green */
  --accent-hover:#6dbc10;  /* brighter hover green */
  --mint:#9BE8B2;          /* mint green */
  --cream:#F7F3E8;         /* warm cream */
  --white:#fff;
  --bg:var(--cream);
  --line:rgba(234,234,234,.7);
  --line-soft:rgba(234,234,234,.4);

  --shell:1200px;          /* content max width */
  --gutter:24px;
  --pad-section:120px;
  --radius-lg:24px;
  --radius-md:16px;
  --radius-sm:8px;
  --radius-xs:4px;
  --sticky-top:120px;

  --ease:cubic-bezier(.44,0,.56,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
  --font:"Manrope",sans-serif;
  --feat:"blwf" on,"cv09" on,"cv03" on,"cv04" on,"cv11" on;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;scroll-behavior:smooth}
body{
  /* Keep the decorative grid above the page color and below all page content. */
  position:relative;isolation:isolate;
  margin:0;background:var(--bg);color:var(--body);
  font-family:var(--font);font-feature-settings:var(--feat);
  font-variation-settings:normal;
  overflow-x:hidden;
}
img,video{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4,p,figure{margin:0}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
ul{margin:0;padding:0;list-style:none}

/* ---------- Type scale ---------- */
.h1{font-size:4rem;font-weight:600;line-height:1.1em;color:var(--dark);font-feature-settings:var(--feat)}
.h2{font-size:3rem;font-weight:600;line-height:1.2em;color:var(--dark)}
.h3-lg{font-size:2rem;font-weight:600;line-height:1.3em;color:var(--dark);display:block}
.h3{font-size:1.375rem;font-weight:600;line-height:1.3em;color:var(--dark);display:block}
.h4{font-size:1.125rem;font-weight:600;line-height:1.4em;color:var(--dark)}
.lead{font-size:1.25rem;font-weight:400;line-height:1.4em;color:var(--body)}
.body{font-size:1.125rem;font-weight:400;line-height:1.5em;color:var(--body)}
.body-sm{font-size:1rem;font-weight:400;line-height:1.5em;color:var(--body);display:block}
.small{font-size:.875rem;font-weight:400;line-height:1.5em;color:var(--body)}
.light,.lead--light{color:var(--white)}
.muted{color:var(--body)}
.center-text{text-align:center}
.richtext p+p{margin-top:18px}

.eyebrow{
  display:flex;align-items:center;gap:6px;width:max-content;
  font-size:.875rem;font-weight:500;line-height:1.3em;letter-spacing:1.6px;
  text-transform:uppercase;color:var(--dark);
}
.eyebrow i{width:12px;height:12px;border-radius:2px;background:var(--accent-hover);flex:none}
.eyebrow--light{color:var(--white)}

/* ---------- Layout helpers ---------- */
.container{width:100%;max-width:var(--shell);margin-inline:auto}
.section{padding:var(--pad-section) var(--gutter);position:relative;z-index:1}
.section--rule{border-bottom:1px solid var(--line)}
.stack-12{display:flex;flex-direction:column;gap:12px}
.stack-16{display:flex;flex-direction:column;gap:16px}
.stack-24{display:flex;flex-direction:column;gap:24px}
.stack-48{display:flex;flex-direction:column;gap:48px}
.center{align-items:center}

/* ---------- Vertical grid lines ---------- */
.grid-lines{
  position:absolute;inset:0;z-index:0;pointer-events:none;
  display:flex;justify-content:space-between;padding:0 56px;
}
.grid-lines i{width:1px;background:var(--line)}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:8px;width:max-content;
  padding:8px 8px 8px 24px;border-radius:var(--radius-sm);
  font-size:1rem;font-weight:600;line-height:1.5em;
  transition:background-color .4s var(--ease),transform .4s var(--ease);
}
.btn--accent{background:var(--accent);color:var(--white)}
.btn--accent:hover{background:var(--accent-hover)}
.btn--light{background:var(--white);color:var(--dark)}
.btn--light:hover{background:#f0f0f0}
.btn--sm{padding:12px 20px}
.btn__arrow{
  width:32px;height:32px;border-radius:var(--radius-xs);flex:none;
  display:grid;place-items:center;overflow:hidden;
}
.btn__arrow--accent{background:var(--accent)}
.btn__arrow--light{background:var(--white)}
.btn__arrow svg{width:15px;height:11px;transition:transform .45s var(--ease-out)}
.btn__arrow--accent svg{fill:var(--white)}
.btn__arrow--light svg{fill:var(--dark)}
.btn:hover .btn__arrow svg{animation:arrow-cycle .5s var(--ease-out)}
@keyframes arrow-cycle{
  40%{transform:translateX(28px);opacity:0}
  41%{transform:translateX(-28px);opacity:0}
  to{transform:translateX(0);opacity:1}
}

/* ---------- Header ---------- */
.header{
  position:fixed;top:28px;left:50%;transform:translateX(-50%);
  width:100%;max-width:calc(var(--shell) + 24px);padding:0 12px;z-index:10;
  animation:header-in .7s var(--ease-out) both;
}
@keyframes header-in{from{opacity:0;transform:translateX(-50%) translateY(-12px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}
.header__bar{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  max-width:1152px;margin-inline:auto;
  background:var(--white);border-radius:12px;padding:8px 8px 8px 16px;
}
.header__brand{display:flex;align-items:center;gap:12px}
.logo{display:inline-flex;align-items:center;white-space:nowrap}
.logo img{display:block;width:204px;height:auto;object-fit:contain;mix-blend-mode:multiply;transition:opacity .3s var(--ease)}
.logo:hover img{opacity:.84}
.header__nav{display:flex;align-items:center;justify-content:flex-end;gap:28px;flex:1 0 0}

.navlink{display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding-top:4px;width:max-content}
.navlink span{font-size:1rem;font-weight:400;line-height:1.5em;color:var(--body);transition:color .4s var(--ease)}
.navlink i{display:block;height:2px;width:0;background:var(--accent);border-radius:1px;transition:width .35s var(--ease-out)}
.navlink:hover span,.navlink.is-current span{color:var(--dark)}
.navlink:hover i,.navlink.is-current i{width:100%}

.burger{display:none;width:44px;height:44px;position:relative;flex:none}
.burger span{
  position:absolute;left:10px;width:24px;height:3px;border-radius:10px;background:var(--accent);
  transition:transform .35s var(--ease-out),top .35s var(--ease-out);
}
.burger span:first-child{top:16px}
.burger span:last-child{top:25px}
.burger[aria-expanded="true"] span:first-child{top:20.5px;transform:rotate(45deg)}
.burger[aria-expanded="true"] span:last-child{top:20.5px;transform:rotate(-45deg)}

/* ---------- Hero ---------- */
.hero{padding:12px 12px 0;position:relative;z-index:3}
.hero__inner{
  position:relative;overflow:hidden;border-radius:var(--radius-lg);
  background:var(--dark);min-height:100vh;
  display:flex;flex-direction:column;justify-content:flex-end;align-items:center;
  padding:120px 0;gap:32px;
}
.hero__media{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1}
.hero__scrim{position:absolute;inset:0;z-index:2;background:linear-gradient(90deg,rgba(0,0,0,.6) 0%,rgba(0,0,0,0) 100%)}
.hero__content{position:relative;z-index:5;padding:0 var(--gutter)}
.hero__text{display:flex;flex-direction:column;align-items:flex-start;gap:32px;max-width:674px}
.hero .h1{color:var(--white)}
.hero .lead{max-width:574px}

/* ---------- Intro ---------- */
.intro__wrap{display:flex;flex-direction:column;align-items:center;gap:32px;max-width:936px;margin-inline:auto}
.intro__icon{width:96px;height:62px;object-fit:cover}
.intro__head{text-align:center}
.intro__head em{font-style:normal;color:var(--accent)}
.intro__head .word{display:inline-block;opacity:.001;transform:translateY(10px)}
.intro__head.is-in .word{opacity:1;transform:none;transition:opacity .5s var(--ease-out),transform .5s var(--ease-out)}

/* ---------- Services ---------- */
.services__grid{display:flex;align-items:flex-start;gap:48px}
.services__left{
  flex:1 0 0;max-width:394px;display:flex;flex-direction:column;align-items:flex-start;gap:32px;
  position:sticky;top:var(--sticky-top);
}
.services__right{flex:1 0 0;display:flex;flex-direction:column;gap:20px}

.svc-card{
  display:flex;align-items:flex-end;
  height:460px;padding:24px;border-radius:var(--radius-md);overflow:hidden;
  position:sticky;top:var(--sticky-top);
  transform:scale(.9);opacity:1;
  transition:transform .8s var(--ease-out);
}
.svc-card.is-in{transform:scale(1)}
.svc-card__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1;transition:transform .7s var(--ease-out)}
.svc-card:hover .svc-card__img{transform:scale(1.04)}
.svc-card__scrim{position:absolute;inset:0;z-index:2;background:linear-gradient(0deg,rgba(0,0,0,.3) 0%,rgba(0,0,0,0) 50%)}
.svc-card__body{
  position:relative;z-index:5;flex:1 0 0;display:flex;align-items:flex-end;gap:12px;
  background:var(--white);border-radius:var(--radius-sm);padding:24px;
}
.svc-card__text{flex:1 0 0;display:flex;flex-direction:column;gap:12px}
.svc-card__arrow{
  width:48px;height:48px;flex:none;border-radius:var(--radius-xs);background:var(--accent);
  display:grid;place-items:center;overflow:hidden;transition:background-color .4s var(--ease);
}
.svc-card__arrow svg{width:22px;height:17px;fill:var(--white);transform:rotate(-45deg);transition:transform .45s var(--ease-out)}
.svc-card:hover .svc-card__arrow{background:var(--accent-hover)}
.svc-card:hover .svc-card__arrow svg{animation:arrow-diag .55s var(--ease-out)}
@keyframes arrow-diag{
  40%{transform:rotate(-45deg) translateX(34px);opacity:0}
  41%{transform:rotate(-45deg) translateX(-34px);opacity:0}
  to{transform:rotate(-45deg) translateX(0);opacity:1}
}

/* ---------- Our Goal ---------- */
.goal__top{display:flex;flex-direction:column;align-items:center;gap:24px}
.goal__head{max-width:739px}
.goal__sub{max-width:560px}

.trust{display:flex;align-items:center;gap:8px;width:100%;max-width:356px}
.trust__faces{position:relative;flex:1 0 0;min-height:56px}
.trust__faces img{
  position:absolute;top:0;bottom:0;width:56px;height:56px;border-radius:100px;
  object-fit:cover;border:3px solid var(--white);
  transition:transform .4s var(--ease-out);
}
.trust__faces img:nth-child(1){left:0;z-index:4}
.trust__faces img:nth-child(2){left:40px;z-index:3}
.trust__faces img:nth-child(3){left:83px;z-index:2}
.trust__faces img:nth-child(4){right:0;z-index:1}
.trust__faces:hover img:nth-child(1){transform:translateX(-6px)}
.trust__faces:hover img:nth-child(4){transform:translateX(6px)}
.trust__meta{flex:1 0 0;display:flex;flex-direction:column;gap:2px}
.trust__row{display:flex;align-items:center;gap:8px}
.trust__row .small{color:var(--dark)}

.stars{display:inline-flex;align-items:center;gap:4px}
.stars svg{width:20px;height:20px;fill:var(--accent)}
.stars--sm{gap:4px}

.videoplate{
  position:relative;display:block;width:100%;aspect-ratio:1152/724;
  border-radius:var(--radius-md);overflow:hidden;
}
.videoplate img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease-out)}
.videoplate:hover img{transform:scale(1.03)}
.videoplate__play{
  position:absolute;inset:0;display:grid;place-items:center;z-index:2;
  transition:transform .4s var(--ease-out);
}
.videoplate__play svg{width:120px;height:120px}
.videoplate:hover .videoplate__play{transform:scale(1.08)}

.trusted .h3{width:100%}
.marquee{
  width:100%;overflow:hidden;
  -webkit-mask-image:linear-gradient(to right,transparent 0%,#000 12.5%,#000 87.5%,transparent 100%);
  mask-image:linear-gradient(to right,transparent 0%,#000 12.5%,#000 87.5%,transparent 100%);
}
.marquee__track{display:flex;align-items:center;gap:24px;width:max-content;animation:marquee 32s linear infinite}
.marquee:hover .marquee__track{animation-play-state:paused}
.marquee__track img{height:24px;width:auto;object-fit:contain;flex:none;padding:8px;box-sizing:content-box;opacity:.55}
@keyframes marquee{to{transform:translateX(-50%)}}

/* ---------- About ---------- */
.about__grid{display:flex;align-items:center;gap:24px}
.about__media{position:relative;flex:1 0 0;align-self:stretch;border-radius:var(--radius-md);overflow:hidden}
/* absolutely placed so the column has no intrinsic height and stretches to the card */
.about__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease-out)}
.about__media:hover img{transform:scale(1.04)}
.about__card{
  /* basis 64px == the card's own h-padding, which the original adds
     outside the shared free space (content-box flex sizing) */
  flex:1 1 64px;background:var(--white);border-radius:var(--radius-md);
  padding:32px;display:flex;flex-direction:column;align-items:flex-start;gap:32px;
}

/* ---------- Testimonials ---------- */
.testi__wrap{display:flex;align-items:flex-start;gap:24px;height:346px}

.ratecard{
  position:relative;flex:1 0 0;max-width:368px;height:346px;
  border-radius:var(--radius-md);overflow:hidden;
  display:flex;flex-direction:column;justify-content:flex-end;padding:24px;
}
.ratecard__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1;transform:scale(1.3);transition:transform 1.1s var(--ease-out)}
.ratecard.is-in .ratecard__img{transform:scale(1)}
.ratecard__scrim{position:absolute;inset:0;z-index:2;background:linear-gradient(0deg,rgba(0,0,0,.7) 0%,rgba(0,0,0,0) 49%)}
.ratecard__body{position:relative;z-index:4;display:flex;flex-direction:column;align-items:flex-start;gap:8px}
.ratecard__row{display:flex;align-items:center;gap:12px;width:100%}
.ratecard__num{
  flex:1 0 0;max-width:162px;color:var(--white);
  font-size:3rem;font-weight:600;line-height:1.2em;font-variant-numeric:tabular-nums;
}
.ratecard__star{width:40px;height:40px;flex:none}

.carousel{position:relative;flex:1 0 0;height:100%;min-width:0}
.carousel__viewport{overflow:hidden;height:100%}
.carousel__track{
  display:flex;gap:24px;height:100%;
  transition:transform .65s var(--ease-out);
}
.carousel__nav{position:absolute;top:-114px;right:0;display:flex;gap:16px;z-index:3}
.carousel__btn{width:56px;height:56px;border-radius:var(--radius-xs);display:grid;place-items:center;transition:opacity .3s var(--ease),transform .3s var(--ease)}
.carousel__btn:hover{transform:translateY(-2px)}
.carousel__btn[disabled]{opacity:.35;cursor:default;transform:none}
.carousel__btn img{width:56px;height:56px}
.carousel__dots{display:none}

.quote{
  flex:none;width:calc(50% - 12px);height:346px;
  background:var(--white);border-radius:var(--radius-md);padding:24px;
  display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start;
}
.quote__who{display:flex;align-items:center;gap:12px;width:100%}
.quote__who img{width:64px;height:64px;flex:none;border-radius:100px;object-fit:cover}
.quote__who>div{flex:1 0 0;display:flex;flex-direction:column;gap:4px}

/* ---------- Why Choose Us ---------- */
.why__head{max-width:564px;margin-inline:auto}
.why__grid{display:flex;align-items:flex-start;gap:24px}
.why__media{
  flex:1 0 0;aspect-ratio:1.41;border-radius:var(--radius-md);overflow:hidden;
  position:sticky;top:var(--sticky-top);
}
.why__media video{width:100%;height:100%;object-fit:cover;background:var(--dark)}
.why__list{flex:1 0 0;display:flex;flex-direction:column;gap:24px}
.feature{
  display:flex;flex-direction:column;align-items:flex-start;gap:24px;
  background:var(--white);border-radius:var(--radius-md);padding:24px;
  transform:scale(.9);transition:transform .8s var(--ease-out),box-shadow .4s var(--ease);
}
.feature.is-in{transform:scale(1)}
.feature:hover{box-shadow:0 2px 4px rgba(27,47,4,.04),0 12px 32px rgba(27,47,4,.07)}
.feature__icon{width:40px;height:40px;object-fit:contain;transition:transform .45s var(--ease-out)}
.feature:hover .feature__icon{transform:translateY(-3px) scale(1.06)}

/* ---------- Blog ---------- */
.blog__grid{display:grid;grid-template-columns:repeat(3,minmax(250px,1fr));gap:20px}
.post{
  position:relative;aspect-ratio:.88756;padding:24px;border-radius:var(--radius-md);overflow:hidden;
  display:flex;flex-direction:column;justify-content:space-between;align-items:flex-end;
}
.post__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1;transition:transform .8s var(--ease-out)}
.post:hover .post__img{transform:scale(1.05)}
.post__scrim{position:absolute;inset:0;z-index:2;background:linear-gradient(0deg,rgba(0,0,0,.3) 0%,rgba(0,0,0,0) 50%)}
.post__arrow{
  position:relative;z-index:4;width:40px;height:40px;flex:none;border-radius:var(--radius-xs);
  background:var(--white);display:grid;place-items:center;overflow:hidden;transition:background-color .4s var(--ease);
}
.post__arrow svg{width:22px;height:17px;fill:var(--accent);transform:rotate(-45deg)}
.post:hover .post__arrow{background:var(--accent)}
.post:hover .post__arrow svg{fill:var(--white);animation:arrow-diag .55s var(--ease-out)}
.post__body{
  position:relative;z-index:4;width:100%;background:var(--white);
  border-radius:var(--radius-sm);padding:16px;display:flex;gap:8px;
  flex-direction:column;align-items:flex-start;
}
.post__meta{display:flex;align-items:center;gap:4px;width:100%}
.post__body .h3{margin-top:8px}

/* ---------- CTA ---------- */
.cta{padding:0 12px;position:relative;z-index:3}
.cta__inner{
  position:relative;overflow:hidden;border-radius:var(--radius-lg);background:var(--dark);
  min-height:100vh;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:32px;
}
.cta__media{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1;will-change:transform}
.cta__row{position:relative;z-index:5;padding:80px var(--gutter);display:flex;justify-content:flex-start}
.cta__card{
  flex:1 0 0;max-width:564px;background:var(--white);border-radius:var(--radius-md);
  padding:32px;display:flex;flex-direction:column;align-items:flex-start;gap:32px;
}

/* ---------- Footer ---------- */
.footer{padding:64px 0 16px;position:relative;z-index:1}
.footer__inner{display:flex;flex-direction:column;gap:40px}
.footer__top{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:0 var(--gutter) 40px;border-bottom:1px solid var(--line-soft);
}
.footer__brand{flex:1 0 0;max-width:428px;display:flex;flex-direction:column;align-items:flex-start;gap:8px}
.footer__brand .logo img{width:250px}
.footer__social{flex:1 0 0;max-width:194px;display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.socials{display:flex;align-items:center;gap:8px}
.socials a{
  width:40px;height:40px;border-radius:var(--radius-sm);background:var(--accent);
  display:grid;place-items:center;transition:background-color .4s var(--ease),transform .4s var(--ease-out);
}
.socials a:hover{background:var(--accent-hover);transform:translateY(-3px)}
.socials svg{width:24px;height:24px;fill:none;stroke:var(--white);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

.footer__mid{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;padding:0 var(--gutter)}
.footer__col{display:flex;flex-direction:column;align-items:flex-start;gap:12px;width:max-content}
.footer__links{display:flex;flex-direction:column;align-items:flex-start;gap:8px;width:max-content}
.footer__bottom{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 var(--gutter)}
.footer__credit{text-align:right}
.footer__credit a{transition:color .4s var(--ease)}
.footer__credit a:hover{color:var(--accent);text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}

/* ---------- Lightbox ---------- */
.lightbox{
  position:fixed;inset:0;z-index:50;background:rgba(10,16,2,.88);
  display:grid;place-items:center;padding:24px;
  animation:fade .3s var(--ease-out) both;
}
.lightbox[hidden]{display:none}
.lightbox video{width:min(1152px,100%);border-radius:var(--radius-md);background:#000}
.lightbox__close{
  position:absolute;top:24px;right:24px;width:44px;height:44px;border-radius:var(--radius-xs);
}
.lightbox__close span{position:absolute;left:10px;top:20.5px;width:24px;height:3px;border-radius:10px;background:var(--white)}
.lightbox__close span:first-child{transform:rotate(45deg)}
.lightbox__close span:last-child{transform:rotate(-45deg)}
@keyframes fade{from{opacity:0}to{opacity:1}}

/* ---------- Scroll reveals ---------- */
[data-reveal]{opacity:0;transition:opacity .9s var(--ease-out),transform .9s var(--ease-out)}
[data-reveal="up"]{transform:translateY(80px)}
[data-reveal="left"]{transform:translateX(-80px)}
[data-reveal="right"]{transform:translateX(80px)}
[data-reveal].is-in{opacity:1;transform:none}
[data-delay="1"]{transition-delay:.1s}
[data-delay="2"]{transition-delay:.2s}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  html{scroll-behavior:auto}
  [data-reveal],.svc-card,.feature,.ratecard__img{opacity:1!important;transform:none!important}
}

/* ===========================================================
   Tablet  (810–1199)
   =========================================================== */
@media (max-width:1199.98px){
  :root{--pad-section:80px}
  .h1{font-size:3.5rem}
  .h2{font-size:2.5rem}
  .h3-lg{font-size:1.75rem}

  .header{top:0;max-width:none;padding:0}
  .header__bar{max-width:none;border-radius:0;padding:12px 14px 12px 24px}
  .header__brand{flex:1 0 0;justify-content:space-between}
  .burger{display:block}
  .header__nav{
    display:none;position:absolute;top:100%;left:0;right:0;
    flex-direction:column;align-items:flex-start;gap:16px;
    background:var(--white);padding:24px;
  }
  .header__nav.is-open{display:flex}

  .hero{padding:64px 0 0}
  .hero__inner{border-radius:0;min-height:auto;padding:160px 0 80px}

  .services__grid{gap:32px}
  .services__left{max-width:296px}
  .svc-card{height:360px}
  .goal__top{gap:32px}
  .blog__grid{grid-template-columns:repeat(2,minmax(250px,1fr))}
  .quote{width:100%}
  .cta{padding:0}
  .cta__inner{border-radius:0;min-height:auto;padding:240px 0 80px}
  .cta__row{padding:0 var(--gutter)}
  .footer__brand{max-width:296px}
  .footer__mid{display:grid;grid-template-columns:repeat(2,minmax(50px,1fr));gap:32px}
  .footer__col{width:100%}
}

/* ===========================================================
   Mobile  (≤809)
   =========================================================== */
@media (max-width:809.98px){
  :root{--pad-section:64px;--sticky-top:88px}
  .h1{font-size:2.25rem}
  .h2{font-size:2rem}
  .h3-lg{font-size:1.375rem}
  .lead{font-size:1rem}
  .body{font-size:1rem}
  .eyebrow{font-size:.75rem}
  .btn{font-size:.875rem}

  .grid-lines{display:none}

  .hero__inner{padding:128px 0 64px}
  .hero__scrim{background:linear-gradient(90deg,rgba(0,0,0,.5) 0%,rgba(0,0,0,0) 155%)}
  .hero__text{gap:24px;max-width:none}
  .stack-24{gap:16px}
  .stack-48{gap:32px}

  .intro__wrap{gap:24px}
  .intro__icon{width:72px;height:auto}

  .services__grid{flex-direction:column;gap:40px}
  .services__left{position:static;max-width:none;width:100%;gap:24px}
  .services__right{width:100%}
  .svc-card{position:relative;top:auto;height:auto;aspect-ratio:.928571;padding:16px;transform:none}
  .svc-card__body{padding:16px}

  .trust{flex-direction:column;max-width:none;align-items:center}
  .trust__faces{width:100%;max-width:180px;flex:none}
  .trust__faces img{width:54px;height:54px}
  .trust__faces img:nth-child(2){left:40px}
  .trust__faces img:nth-child(3){left:83px}
  .trust__meta{flex:none;width:100%;align-items:center}
  .trust__row{justify-content:center}
  .videoplate__play svg{width:64px;height:64px}
  .marquee__track{animation-duration:22s}

  .about__grid{flex-direction:column}
  .about__media{flex:none;width:100%;aspect-ratio:1.09615;align-self:auto}
  .about__card{flex:none;width:100%;padding:24px;gap:24px}

  .testi .container{gap:32px}
  .testi__wrap{flex-direction:column;height:auto;gap:24px}
  .ratecard{flex:none;width:100%;max-width:none}
  .ratecard__num{font-size:2.25rem;font-weight:400}
  .ratecard__star{width:32px;height:32px}
  .ratecard__body{align-items:center;text-align:center}
  .ratecard__row{justify-content:center;gap:4px}
  .carousel{flex:none;width:100%;height:346px;padding-bottom:40px}
  .carousel__nav{display:none}
  .carousel__dots{display:flex;justify-content:center;gap:12px;position:absolute;bottom:0;left:50%;transform:translateX(-50%)}
  .carousel__dots button{width:8px;height:8px;border-radius:50%;background:var(--accent);opacity:.5;transition:opacity .3s var(--ease)}
  .carousel__dots button[aria-current="true"]{opacity:1}
  .quote{width:100%}

  .why__grid{flex-direction:column}
  .why__media{position:static;flex:none;width:100%;height:auto;aspect-ratio:1.41}
  .why__list{flex:none;width:100%}
  .feature{transform:none;width:100%}

  .blog__grid{grid-template-columns:1fr}
  .post{padding:16px}

  .cta__inner{padding:128px 0 64px}
  .cta__card{flex:none;width:100%;max-width:none;padding:24px;gap:24px}

  .footer{padding:48px 0 16px}
  .footer__inner{gap:32px}
  .footer__top{flex-direction:column;align-items:flex-start;gap:24px}
  .footer__brand,.footer__social{flex:none;width:100%;max-width:296px}
  .footer__brand .logo img{width:250px}
  .footer__mid{display:flex;flex-direction:column;gap:28px}
  .footer__bottom{flex-direction:column;align-items:flex-start;gap:8px}
  .footer__credit{text-align:left}
}

/* ===========================================================
   Sub-page components
   =========================================================== */
.stack-32{display:flex;flex-direction:column;gap:32px}

/* ---------- Service grid (services index) ---------- */
.svc-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.svc-grid .svc-card{position:relative;top:auto;height:460px;transform:none}

/* ---------- FAQs ---------- */
.faqs__grid{display:flex;align-items:flex-start;gap:48px}
.faqs__intro{
  flex:1 0 0;max-width:394px;position:sticky;top:var(--sticky-top);
  display:flex;flex-direction:column;align-items:flex-start;gap:32px;
}
.faqs__list{flex:1 0 0;display:flex;flex-direction:column;gap:12px}
.faq{background:var(--white);border-radius:var(--radius-md);padding:0 24px}
.faq summary{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:24px 0;cursor:pointer;list-style:none;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary:focus-visible{outline:2px solid var(--accent);outline-offset:4px;border-radius:4px}
.faq__sign{position:relative;width:16px;height:16px;flex:none}
.faq__sign::before,.faq__sign::after{
  content:"";position:absolute;inset:50% 0 auto 0;height:2px;border-radius:2px;
  background:var(--accent);transform:translateY(-50%);transition:transform .35s var(--ease-out);
}
.faq__sign::after{transform:translateY(-50%) rotate(90deg)}
.faq[open] .faq__sign::after{transform:translateY(-50%) rotate(0)}
.faq__body{padding:0 0 24px;max-width:72ch}

/* ---------- Service detail ---------- */
.svc-detail__grid{display:flex;align-items:flex-start;gap:48px}
.svc-detail__aside{flex:1 0 0;max-width:394px;position:sticky;top:var(--sticky-top)}
.svc-detail__body{flex:1 0 0;display:flex;flex-direction:column;gap:48px;min-width:0}
.person{
  position:relative;height:464px;border-radius:var(--radius-md);overflow:hidden;
  display:flex;flex-direction:column;justify-content:flex-end;padding:16px;
}
.person__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1}
.person__scrim{position:absolute;inset:0;z-index:2;background:linear-gradient(0deg,rgba(0,0,0,.45) 0%,rgba(0,0,0,0) 55%)}
.person__body{
  position:relative;z-index:4;background:var(--white);border-radius:var(--radius-sm);
  padding:20px;display:flex;flex-direction:column;align-items:flex-start;gap:16px;
}

.inline-cta{
  background:var(--white);border-radius:var(--radius-md);padding:32px;
  display:flex;flex-direction:column;align-items:flex-start;gap:24px;
}

/* ---------- Long-form copy ---------- */
.prose{display:flex;flex-direction:column;gap:16px}
.prose .h3-lg{margin-top:16px}
.prose .h3-lg:first-child,.prose .h3:first-child{margin-top:0}
.prose .h3{margin-top:8px}
.prose--article{max-width:72ch;background:var(--white);border-radius:var(--radius-md);padding:40px}
.ticks{display:flex;flex-direction:column;gap:12px}
.ticks li{
  position:relative;padding-left:30px;
  font-size:1.125rem;font-weight:400;line-height:1.5em;color:var(--body);
}
.ticks li::before{
  content:"";position:absolute;left:0;top:.55em;width:14px;height:8px;
  border-left:2px solid var(--accent);border-bottom:2px solid var(--accent);
  transform:translateY(-50%) rotate(-45deg);
}
.ticks strong{color:var(--dark);font-weight:600}

/* ---------- Blog post head + pager ---------- */
.post-head{padding-top:calc(var(--pad-section) + 64px)}
.post-head__title{max-width:936px}
.post-head__meta{display:flex;align-items:center;gap:8px}
.post-head__cover{border-radius:var(--radius-md);overflow:hidden;aspect-ratio:1920/1080}
.post-head__cover img{width:100%;height:100%;object-fit:cover}
.post-nav{display:flex;justify-content:space-between;gap:24px;margin-top:48px}
.post-nav__link{
  flex:1 1 0;max-width:46%;display:flex;flex-direction:column;gap:4px;
  background:var(--white);border-radius:var(--radius-md);padding:24px;
  transition:transform .4s var(--ease-out),box-shadow .4s var(--ease);
}
.post-nav__link:hover{transform:translateY(-3px);box-shadow:0 12px 32px rgba(27,47,4,.07)}
.post-nav__link--next{margin-left:auto;text-align:right;align-items:flex-end}
.post-nav__link .small{color:var(--accent);font-weight:600}

/* ---------- About: mission, stats, team, awards ---------- */
.mission{max-width:936px;margin-inline:auto;text-align:center}
.mission strong{color:var(--accent);font-weight:600}
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.stat{
  background:var(--white);border-radius:var(--radius-md);padding:32px;
  display:flex;flex-direction:column;gap:8px;align-items:flex-start;
}
.stat__num{
  font-size:3rem;font-weight:600;line-height:1.2em;color:var(--accent);
  font-variant-numeric:tabular-nums;
}
.team__head{max-width:564px;margin-inline:auto}
.team{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.member{
  margin:0;position:relative;border-radius:var(--radius-md);overflow:hidden;
  aspect-ratio:384/484;display:flex;flex-direction:column;justify-content:flex-end;padding:16px;
}
.member img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1;transition:transform .8s var(--ease-out)}
.member:hover img{transform:scale(1.04)}
.member figcaption{
  position:relative;z-index:3;background:var(--white);border-radius:var(--radius-sm);
  padding:16px;display:flex;flex-direction:column;gap:4px;
}
.awards{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:40px}
.awards img{width:184px;height:104px;object-fit:contain;opacity:.65;transition:opacity .4s var(--ease)}
.awards img:hover{opacity:1}

/* ---------- Contact ---------- */
.contact__grid{display:flex;align-items:flex-start;gap:24px}
.contact__form-card{
  flex:1 1 64px;background:var(--white);border-radius:var(--radius-md);padding:32px;
  display:flex;flex-direction:column;gap:32px;
}
.contact__details{
  flex:1 1 64px;background:var(--white);border-radius:var(--radius-md);padding:32px;
  display:flex;flex-direction:column;gap:32px;
}
.form{display:flex;flex-direction:column;gap:16px}
.form__row{display:flex;gap:16px}
.form__row .field{flex:1 1 0;min-width:0}
.field{display:flex;flex-direction:column;gap:8px}
.field__label{font-size:.875rem;font-weight:500;line-height:1.5em;color:var(--dark)}
.field input,.field select,.field textarea{
  font:inherit;font-size:1rem;color:var(--dark);background:var(--bg);
  border:1px solid transparent;border-radius:var(--radius-sm);padding:12px 14px;width:100%;
  transition:border-color .3s var(--ease),background-color .3s var(--ease);
}
.field textarea{resize:vertical;min-height:112px}
.field input:focus,.field select:focus,.field textarea:focus{
  outline:none;border-color:var(--accent);background:var(--white);
}
.field input:user-invalid{border-color:#c0392b}
.form__note{color:var(--accent);font-weight:600}
.details{display:flex;flex-direction:column;gap:24px;margin:0}
.details__item{display:flex;flex-direction:column;gap:4px}
.details dd{margin:0}
.contact__photo{border-radius:var(--radius-md);overflow:hidden;aspect-ratio:3/2}
.contact__photo img{width:100%;height:100%;object-fit:cover}

/* ---------- Sub-page responsive ---------- */
@media (max-width:1199.98px){
  .faqs__grid,.svc-detail__grid{gap:32px}
  .faqs__intro{max-width:296px}
  .svc-detail__aside{max-width:296px}
  .person{height:400px}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .post-head{padding-top:calc(var(--pad-section) + 56px)}
}
@media (max-width:809.98px){
  .svc-grid{grid-template-columns:1fr}
  .svc-grid .svc-card{height:auto;aspect-ratio:.928571}
  .faqs__grid,.svc-detail__grid,.contact__grid{flex-direction:column}
  .faqs__intro,.svc-detail__aside{position:static;max-width:none;width:100%;flex:none}
  .faqs__list,.svc-detail__body{width:100%;flex:none}
  .faq{padding:0 20px}
  .faq summary{padding:20px 0}
  .inline-cta{padding:24px}
  .prose--article{padding:24px}
  .ticks li{font-size:1rem}
  .post-head{padding-top:calc(var(--pad-section) + 48px)}
  .post-nav{flex-direction:column}
  .post-nav__link{max-width:none}
  .post-nav__link--next{margin-left:0;text-align:left;align-items:flex-start}
  .stats{grid-template-columns:1fr}
  .stat{padding:24px}
  .team{grid-template-columns:1fr}
  .awards{gap:24px}
  .awards img{width:140px;height:80px}
  .contact__form-card,.contact__details{flex:none;width:100%;padding:24px}
  .form__row{flex-direction:column}
}

/* ---------- Quick Links (bare page) ---------- */
.linkpage{min-height:100vh;display:grid;place-items:center;padding:64px var(--gutter);position:relative;z-index:1}
.linkpage__card{width:100%;max-width:600px;display:flex;flex-direction:column;align-items:center;gap:24px}
.linkpage__card .logo img{width:240px}
.linkpage__card .body-sm{max-width:420px}
.linkpage__list{width:100%;display:flex;flex-direction:column;gap:16px;margin-top:8px}
.btn--block{width:100%;justify-content:center;padding:12px 24px}
.btn--block:hover{transform:translateY(-2px)}

/* ---------- Legal pages ---------- */
.link{color:var(--accent);text-decoration:underline;text-underline-offset:3px;transition:color .3s var(--ease)}
.link:hover{color:var(--dark)}
.legal-note{margin-top:16px;padding:16px;border-radius:var(--radius-sm);background:var(--bg)}