/* Artistic Home Care — shared site styles (colours and type from artistichomecare.ca) */
@property --r { syntax: '<length>'; inherits: true; initial-value: 0px; }
@property --sr { syntax: '<length>'; inherits: true; initial-value: 0px; }
@property --split { syntax: '<percentage>'; inherits: true; initial-value: 54%; }

:root, .ahc {
  --accent: #FF758C;
  --accent-deep: color-mix(in srgb, var(--accent) 52%, #2a0a14);
  --pink: #EA5C74;
  --violet: #554FF2;
  --ink: #0E1D4D;
  --night: #0B1640;
  --cyan: #00B7CD;
  --muted: #545B78;
  --soft: #F6F6FB;
  --blush: #FFF0F3;
  --display: 'Poppins', system-ui, sans-serif;
  --body: 'Poppins', system-ui, sans-serif;
  --gut: 60px;
  --hdr: 82px;
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
}
body { margin: 0; background: #fff; font-family: var(--body); color: var(--ink); }
/* shared Header / Footer imports must not add a layout box, so the sticky header and footer reveal work */
.ahc > [data-sc-name="Header"], .ahc > [data-sc-name="Footer"] { display: contents; }
a { color: inherit; text-decoration: none; }
a:hover { color: inherit; }
.ahc { position: relative; isolation: isolate; overflow-x: clip; font-family: var(--body); color: var(--ink); background: #fff; line-height: 1.55; }
.ahc *, .ahc *::before, .ahc *::after, .hdr *, .foot *, .drawer * { box-sizing: border-box; }
.ahc p, .foot p { margin: 0; }
.ahc h1, .ahc h2, .ahc h3, .ahc h4 { margin: 0; }
.ahc img { display: block; max-width: 100%; }
.wrap { position: relative; z-index: 1; width: 100%; max-width: 1440px; margin: 0 auto; padding: 0 var(--gut); }
.d0 { --i: 0; } .d1 { --i: 1; } .d2 { --i: 2; } .d3 { --i: 3; } .d4 { --i: 4; } .d5 { --i: 5; } .d6 { --i: 6; } .d7 { --i: 7; }
.k0 { --k: 0; } .k1 { --k: 1; } .k2 { --k: 2; } .k3 { --k: 3; } .k4 { --k: 4; } .k5 { --k: 5; }

/* paint palette */
.f-acc { fill: var(--accent); } .f-pink { fill: #EA5C74; } .f-violet { fill: #554FF2; } .f-navy { fill: #0E1D4D; } .f-navy2 { fill: #1A2B6B; }
.f-cyan { fill: #00B7CD; } .f-blush { fill: #FFD3DC; } .f-lilac { fill: #CFCBFF; } .f-sky { fill: #BFEFF5; } .f-cream { fill: #FFF5F2; } .f-white { fill: #fff; }
.stk { fill: none; stroke-linecap: round; stroke-linejoin: round; }
.s-ink { stroke: #0E1D4D; } .s-white { stroke: #fff; } .s-acc { stroke: var(--accent); } .s-violet { stroke: #554FF2; } .s-cyan { stroke: #00B7CD; }
.sw3 { stroke-width: 3; } .sw6 { stroke-width: 6; } .sw8 { stroke-width: 8; } .sw10 { stroke-width: 10; } .sw12 { stroke-width: 12; } .sw14 { stroke-width: 14; } .sw18 { stroke-width: 18; }
.i { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
.i--s { width: 16px; height: 16px; }
.i--l { width: 26px; height: 26px; }
.i--fill { fill: currentColor; stroke: none; }

/* imagery */
.ph { position: relative; overflow: hidden; background: #FFF5F2; }
.ph > svg, .ph > img { position: absolute; inset: 0; width: 100%; height: 100%; display: block; object-fit: cover; }
.ph--photo::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 55%, rgba(11,22,64,0.28)); pointer-events: none; }
.ph__tag { position: absolute; left: 16px; bottom: 16px; z-index: 2; display: inline-flex; align-items: center; gap: 8px; padding: 7px 12px; border-radius: 999px; background: rgba(255,255,255,0.94); color: var(--ink); font: 600 0.72rem/1 var(--body); letter-spacing: 0.03em; box-shadow: 0 4px 14px rgba(14,29,77,0.1); }

/* buttons */
.btn { position: relative; overflow: hidden; z-index: 1; display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 46px; padding: 13px 22px; border-radius: 10px; border: 0; cursor: pointer; font: 600 0.84rem/1 var(--body); letter-spacing: 0.06em; text-transform: uppercase; white-space: nowrap; transition: color 0.4s var(--ease), transform 0.4s var(--ease), box-shadow 0.4s ease, border-color 0.4s ease; }
.btn::before { content: ''; position: absolute; inset: 0; z-index: -1; transform: translateY(101%); transition: transform 0.45s var(--ease); }
.btn:hover::before, .btn:focus-visible::before { transform: translateY(0); }
.btn:hover { transform: translateY(-2px); }
.btn:disabled { opacity: 0.45; cursor: not-allowed; transform: none; }
.btn--dark { background: var(--ink); color: #fff; }
.btn--dark::before { background: var(--violet); }
.btn--dark:hover { color: #fff; box-shadow: 0 12px 26px rgba(85,79,242,0.35); }
.btn__box { width: 24px; height: 24px; border-radius: 6px; background: var(--accent); color: var(--ink); display: flex; align-items: center; justify-content: center; transition: transform 0.4s cubic-bezier(0.34,1.56,0.64,1), background-color 0.3s ease; }
.btn--dark:hover .btn__box { transform: translate(2px,-2px) rotate(45deg); background: #fff; }
.btn--accent { background: var(--accent); color: var(--ink); text-transform: none; letter-spacing: 0; font-size: 0.95rem; padding: 16px 30px; }
.btn--accent::before { background: #fff; }
.btn--accent:hover { color: var(--ink); box-shadow: 0 12px 26px rgba(0,0,0,0.18); }
.btn--ghost { background: transparent; color: #fff; border: 1px solid rgba(255,255,255,0.42); text-transform: none; letter-spacing: 0; font-weight: 500; font-size: 0.95rem; padding: 16px 30px; }
.btn--ghost::before { background: #fff; }
.btn--ghost:hover { color: var(--ink); border-color: #fff; }
.btn--line { background: transparent; color: var(--ink); border: 1px solid rgba(14,29,77,0.3); text-transform: none; letter-spacing: 0; font-weight: 600; font-size: 0.93rem; padding: 15px 26px; }
.btn--line::before { background: var(--ink); }
.btn--line:hover { color: #fff; border-color: var(--ink); }
.btn--call { background: rgba(255,255,255,0.4); color: var(--ink); border: 1px solid rgba(14,29,77,0.2); text-transform: none; letter-spacing: 0; font-weight: 600; font-size: 0.95rem; }
.btn--call::before { background: #fff; }
.btn--call:hover { color: var(--ink); }
.btn--ig { color: #fff; background: linear-gradient(135deg, #feda75 0%, #fa7e1e 24%, #d62976 52%, #962fbf 76%, #4f5bd5 100%); text-transform: none; letter-spacing: 0.02em; }
.btn--ig::before { background: linear-gradient(135deg, #4f5bd5 0%, #962fbf 24%, #d62976 52%, #fa7e1e 76%, #feda75 100%); }
.btn--ig:hover { color: #fff; box-shadow: 0 12px 28px rgba(150,47,191,0.3); }

/* section heads */
.eyebrow { display: flex; align-items: center; gap: 9px; margin: 0 0 16px; font: 600 0.78rem/1 var(--body); letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted); }
.eyebrow i { width: 8px; height: 8px; border-radius: 50%; background: var(--accent); display: inline-block; box-shadow: 10px 0 0 var(--violet); margin-right: 10px; }
.eyebrow--on-dark { color: var(--accent); }
.h2 { display: flex; flex-direction: column; margin: 0 0 22px; font-family: var(--display); font-size: clamp(2rem, 3.6vw, 3.1rem); line-height: 1.06; letter-spacing: -0.02em; text-transform: uppercase; color: var(--ink); }
.h2 .l { font-weight: 300; } .h2 .b { font-weight: 600; }
.h2--light { color: #fff; }
.lede { font-size: 1.02rem; line-height: 1.75; color: #4A5170; font-weight: 300; }
.center { text-align: center; align-items: center; }
.center .eyebrow { justify-content: center; }
.head-c { display: flex; flex-direction: column; align-items: center; text-align: center; margin-bottom: 56px; }
.head-c .eyebrow { justify-content: center; }
.head-c .lede { max-width: 600px; }
.ul-wrap { position: relative; align-self: flex-start; padding-bottom: 0.2em; }
.center .ul-wrap, .head-c .ul-wrap { align-self: center; }
.uline { position: absolute; left: -2%; bottom: 0; width: 104%; height: 0.32em; overflow: visible; pointer-events: none; }
.uline path { fill: none; stroke: var(--accent); stroke-width: 16; stroke-linecap: round; stroke-dasharray: 1; }

/* preloader */
.pre { position: fixed; inset: 0; z-index: 5000; background: var(--accent); display: flex; align-items: center; justify-content: center; animation: pre-out 0.6s ease 1.95s forwards; }
.pre__in { width: min(360px, 80%); text-align: center; }
.pre__logo { width: 250px; margin: 0 auto 6px; animation: pre-logo 1.2s var(--ease) both; }
.pre__stroke { width: 220px; height: 34px; display: block; margin: 0 auto 18px; }
.pre__stroke path { stroke-dasharray: 1; stroke-dashoffset: 1; animation: pre-draw 1.4s var(--ease) 0.35s forwards; }
.pre__bar { height: 4px; border-radius: 4px; background: rgba(14,29,77,0.14); overflow: hidden; }
.pre__bar span { display: block; height: 100%; width: 0; background: var(--ink); animation: pre-bar 1.75s var(--ease) forwards; }
.pre__status { margin-top: 12px; font: 600 0.72rem/1 var(--body); letter-spacing: 0.16em; text-transform: uppercase; color: var(--ink); }
@keyframes pre-logo { from { opacity: 0; transform: translateY(14px) scale(0.94); } to { opacity: 1; transform: none; } }
@keyframes pre-draw { to { stroke-dashoffset: 0; } }
@keyframes pre-bar { to { width: 100%; } }
@keyframes pre-out { to { opacity: 0; visibility: hidden; transform: translateY(-3%); } }

/* scroll progress + cursor */
.progress { position: fixed; top: 0; left: 0; z-index: 2100; width: 100%; height: 3px; background: var(--violet); transform-origin: 0 50%; transform: scaleX(0); pointer-events: none; }
@supports (animation-timeline: scroll()) {
  .progress { animation: grow-x linear both; animation-timeline: scroll(root); }
}
@keyframes grow-x { from { transform: scaleX(0); } to { transform: scaleX(1); } }
.cur { display: none; position: fixed; top: 0; left: 0; z-index: 4500; pointer-events: none; border-radius: 50%; }
.ahc-cur .cur { display: block; }
.cur--dot { width: 8px; height: 8px; margin: -4px 0 0 -4px; background: var(--violet); }
.cur--ring { width: 40px; height: 40px; margin: -20px 0 0 -20px; border: 2px solid var(--violet); transition: width 0.3s var(--ease), height 0.3s var(--ease), margin 0.3s var(--ease), background-color 0.3s ease, border-color 0.3s ease; }
.cur--ring.is-link { width: 68px; height: 68px; margin: -34px 0 0 -34px; border-color: var(--accent); background: color-mix(in srgb, var(--accent) 22%, transparent); }
body[data-dc-editor-on]:not([data-dc-editor-tool="interact"]) .cur { display: none !important; }

/* header */
.hdr { position: sticky; top: 0; z-index: 1000; height: var(--hdr); font-family: var(--body); color: var(--ink); }
.hdr--alone { background: var(--accent); }
.hdr__bg { position: absolute; inset: 0; background: rgba(255,255,255,0.74); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); border-bottom: 1px solid rgba(14,29,77,0.08); box-shadow: 0 4px 20px rgba(14,29,77,0.06); }
.hdr__in { position: relative; height: 100%; max-width: 1440px; margin: 0 auto; padding: 0 var(--gut); display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.logo { position: relative; display: block; width: 136px; height: 50px; flex-shrink: 0; }
.logo__img { position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: contain; object-position: left center; }
.logo__img--w { opacity: 0; }
@supports (animation-timeline: scroll()) {
  .hdr__bg, .logo__img--p { animation: fade-in-x linear both; animation-timeline: scroll(root); animation-range: 0px 180px; }
  .logo__img--w { animation: fade-out-x linear both; animation-timeline: scroll(root); animation-range: 0px 180px; }
}
@keyframes fade-in-x { from { opacity: 0; } to { opacity: 1; } }
@keyframes fade-out-x { from { opacity: 1; } to { opacity: 0; } }
.nav { height: 100%; }
.nav__list { display: flex; align-items: center; gap: 32px; height: 100%; margin: 0; padding: 0; list-style: none; }
.nav__item { position: static; height: 100%; display: flex; align-items: center; }
.nav__link { display: flex; align-items: center; gap: 6px; padding: 10px 0; font: 500 0.8rem/1 var(--display); letter-spacing: 0.09em; text-transform: uppercase; color: var(--ink); position: relative; }
.nav__link::after { content: ''; position: absolute; left: 0; right: 0; bottom: 2px; height: 2px; border-radius: 2px; background: var(--violet); transform: scaleX(0); transform-origin: right center; transition: transform 0.4s var(--ease); }
.nav__link:hover::after, .has-mega:hover > .nav__link::after, .nav__link.is-active::after { transform: scaleX(1); transform-origin: left center; }
.roll { display: inline-block; position: relative; overflow: hidden; height: 1.3em; line-height: 1.3em; vertical-align: middle; }
.roll > span { display: inline-block; transition: transform 0.35s var(--ease); }
.roll::before { content: attr(data-text); position: absolute; top: 100%; left: 0; width: 100%; transition: transform 0.35s var(--ease); }
.nav__link:hover .roll > span, .nav__link:hover .roll::before, .way:hover .roll > span, .way:hover .roll::before, .scard:hover .roll > span, .scard:hover .roll::before { transform: translateY(-100%); }
.chev { transition: transform 0.25s ease; }
.has-mega:hover .chev, .has-mega:focus-within .chev { transform: rotate(180deg); }
.mega { position: absolute; top: calc(100% - 6px); left: 50%; transform: translate(-50%, 12px); width: min(880px, calc(100% - 40px)); padding: 16px; border-radius: 22px; background: #F9F9FD; border: 1px solid rgba(14,29,77,0.06); box-shadow: 0 24px 60px rgba(14,29,77,0.16); opacity: 0; visibility: hidden; pointer-events: none; transition: opacity 0.3s ease, transform 0.35s var(--ease), visibility 0.3s ease; }
.mega--sm { width: min(700px, calc(100% - 40px)); }
.has-mega:hover .mega, .has-mega:focus-within .mega { opacity: 1; visibility: visible; pointer-events: auto; transform: translate(-50%, 0); }
.mega .mi, .mega__feat { opacity: 0; transform: translateY(8px); transition: opacity 0.35s ease, transform 0.45s var(--ease), background 0.2s ease, box-shadow 0.2s ease; }
.has-mega:hover .mega .mi, .has-mega:focus-within .mega .mi, .has-mega:hover .mega__feat, .has-mega:focus-within .mega__feat { opacity: 1; transform: none; }
.mega .mi:nth-child(2) { transition-delay: 0.03s; } .mega .mi:nth-child(3) { transition-delay: 0.06s; } .mega .mi:nth-child(4) { transition-delay: 0.09s; }
.mega .mi:nth-child(5) { transition-delay: 0.12s; } .mega .mi:nth-child(6) { transition-delay: 0.15s; } .mega .mi:nth-child(7) { transition-delay: 0.18s; } .mega .mi:nth-child(8) { transition-delay: 0.21s; }
.mega__grid { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 16px; align-items: stretch; }
.mega__feat { position: relative; overflow: hidden; border-radius: 16px; min-height: 230px; padding: 20px; display: flex; flex-direction: column; justify-content: flex-end; color: #fff; background: var(--night); }
.mega__feat img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease); }
.mega__feat::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(11,22,64,0) 30%, rgba(11,22,64,0.9) 100%); }
.mega__feat:hover img { transform: scale(1.08); }
.mega__feat-t { position: relative; z-index: 1; font: 600 1.1rem/1.25 var(--display); margin-bottom: 4px; }
.mega__feat-d { position: relative; z-index: 1; font-size: 0.78rem; color: rgba(255,255,255,0.92); line-height: 1.4; }
.mega__list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 14px; align-content: center; }
.mega__list--one { grid-template-columns: minmax(0, 1fr); }
.mi { display: flex; align-items: center; gap: 14px; padding: 10px 12px; border-radius: 12px; }
.mi:hover { background: #fff; box-shadow: 0 6px 16px rgba(14,29,77,0.06); }
.mi__ic { width: 42px; height: 42px; border-radius: 11px; background: #fff; border: 1px solid rgba(14,29,77,0.07); display: flex; align-items: center; justify-content: center; color: var(--ink); flex-shrink: 0; transition: background 0.25s ease, color 0.25s ease, transform 0.35s var(--ease); }
.mi:hover .mi__ic { background: var(--accent); transform: rotate(-6deg) scale(1.05); }
.mi__c { flex: 1; min-width: 0; }
.mi__t { display: block; font: 500 0.92rem/1.25 var(--display); color: var(--ink); margin-bottom: 2px; }
.mi__d { display: block; font-size: 0.76rem; line-height: 1.35; color: #5F6684; }
.mi__ar { color: #B8BCD0; transition: transform 0.2s ease, color 0.2s ease; }
.mi:hover .mi__ar { color: var(--violet); transform: translateX(3px); }
.new { font-style: normal; display: inline-block; margin-left: 6px; padding: 2px 7px; border-radius: 999px; background: var(--violet); color: #fff; font: 600 0.6rem/1.45 var(--body); letter-spacing: 0.08em; text-transform: uppercase; vertical-align: 2px; }
.hdr__actions { display: flex; align-items: center; gap: 10px; }
.burger { display: none; width: 46px; height: 46px; border-radius: 12px; border: 1px solid rgba(14,29,77,0.15); background: rgba(255,255,255,0.75); color: var(--ink); align-items: center; justify-content: center; cursor: pointer; }

/* drawer */
.drawer { position: fixed; inset: 0; z-index: 3000; font-family: var(--body); color: var(--ink); }
.drawer__ov { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; padding: 0; background: rgba(11,22,64,0.55); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); cursor: pointer; animation: fade-in 0.3s ease; }
.drawer__panel { position: absolute; top: 0; right: 0; width: 88%; max-width: 380px; height: 100%; background: #fff; padding: 24px; display: flex; flex-direction: column; gap: 18px; box-shadow: -10px 0 30px rgba(0,0,0,0.15); animation: slide-in 0.45s var(--ease); overflow-y: auto; }
.drawer__head { display: flex; align-items: center; justify-content: space-between; padding-bottom: 18px; border-bottom: 1px solid rgba(14,29,77,0.08); }
.drawer__logo { width: 130px; }
.drawer__close { width: 44px; height: 44px; border-radius: 50%; border: 0; background: var(--soft); color: var(--ink); display: flex; align-items: center; justify-content: center; cursor: pointer; }
.drawer__nav { display: flex; flex-direction: column; flex: 1; }
.drawer__link { display: flex; align-items: center; justify-content: space-between; padding: 15px 0; border-bottom: 1px solid rgba(14,29,77,0.06); font: 500 1rem/1 var(--display); text-transform: uppercase; letter-spacing: 0.06em; animation: in-right 0.5s var(--ease) both; }
.drawer__link.is-active { color: var(--pink); }
.drawer__link:nth-child(2) { animation-delay: 0.05s; } .drawer__link:nth-child(3) { animation-delay: 0.1s; } .drawer__link:nth-child(4) { animation-delay: 0.15s; } .drawer__link:nth-child(5) { animation-delay: 0.2s; } .drawer__link:nth-child(6) { animation-delay: 0.25s; }
.drawer__foot { display: flex; flex-direction: column; gap: 10px; }
.drawer__foot .btn { width: 100%; }
@keyframes slide-in { from { transform: translateX(100%); } to { transform: none; } }
@keyframes fade-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes in-right { from { opacity: 0; transform: translateX(24px); } to { opacity: 1; transform: none; } }

/* main shell */
.main { position: relative; z-index: 1; background: #fff; box-shadow: 0 15px 35px rgba(14,29,77,0.14); }

/* home hero */
.hero { position: relative; margin-top: calc(var(--hdr) * -1); min-height: 880px; display: flex; flex-direction: column; background: var(--accent); overflow: hidden; }
.hero__reveal { position: absolute; inset: 0; z-index: 0; pointer-events: none; -webkit-mask-image: radial-gradient(circle var(--r) at var(--mx, 50%) var(--my, 50%), #000 32%, transparent 100%); mask-image: radial-gradient(circle var(--r) at var(--mx, 50%) var(--my, 50%), #000 32%, transparent 100%); transition: --r 0.5s var(--ease); }
.hero__reveal img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: 70% 40%; }
.hero__reveal::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(255,255,255,0.08), rgba(255,117,140,0.18)); }
.hs { position: absolute; z-index: 1; pointer-events: none; }
.hs path { stroke: rgba(255,255,255,0.55); }
.hs--ink path { stroke: rgba(14,29,77,0.16); }
.hs--1 { top: 17%; left: 5%; width: 260px; }
.hs--2 { top: 23%; right: 6%; width: 210px; }
.hs--3 { bottom: 25%; left: 9%; width: 190px; }
.hs--4 { bottom: 30%; right: 10%; width: 240px; }
.hs--dot { width: 26px; height: 26px; border-radius: 50%; background: rgba(255,255,255,0.6); }
.hs--d1 { top: 33%; left: 22%; } .hs--d2 { top: 62%; right: 24%; width: 16px; height: 16px; background: var(--violet); opacity: 0.55; } .hs--d3 { top: 15%; right: 30%; width: 12px; height: 12px; } .hs--d4 { bottom: 34%; left: 30%; width: 10px; height: 10px; background: var(--ink); opacity: 0.25; }
.bob { animation: bob 4.2s ease-in-out infinite alternate; }
.bob--2 { animation-duration: 4.8s; animation-delay: -1.5s; } .bob--3 { animation-duration: 3.9s; animation-delay: -3s; } .bob--4 { animation-duration: 5.2s; animation-delay: -2s; }
@keyframes bob { from { transform: translateY(0) rotate(0deg); } to { transform: translateY(-14px) rotate(3deg); } }
.hero__in { position: relative; z-index: 2; flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 150px var(--gut) 36px; }
.hero__kicker { display: inline-flex; align-items: center; gap: 10px; font: 600 0.8rem/1 var(--body); letter-spacing: 0.22em; text-transform: uppercase; margin-bottom: 22px; padding: 9px 16px; border-radius: 999px; background: rgba(255,255,255,0.35); }
.hero__kicker i { width: 7px; height: 7px; border-radius: 50%; background: var(--violet); display: inline-block; }
.hero__title { display: flex; flex-direction: column; align-items: center; margin: 0 0 26px; font-family: var(--display); text-transform: uppercase; }
.mask { display: block; overflow: hidden; padding-bottom: 0.04em; }
.hero__light { display: block; font-weight: 300; font-size: clamp(1.7rem, 4.2vw, 4rem); line-height: 1.12; letter-spacing: 0.04em; color: var(--ink); }
.hero__boldwrap { position: relative; padding-bottom: 0.16em; }
.hero__bold { display: block; font-weight: 600; font-size: clamp(2.7rem, 8.2vw, 7.4rem); line-height: 1; letter-spacing: -0.03em; background: radial-gradient(circle var(--sr) at var(--tx, 50%) var(--ty, 50%), #fff 0%, #fff 99%, var(--ink) 100%); -webkit-background-clip: text; background-clip: text; color: transparent; transition: --sr 0.35s var(--ease); }
.hero__boldwrap .uline { height: 0.18em; bottom: 0.02em; left: 8%; width: 84%; }
.hero__boldwrap .uline path { stroke: rgba(255,255,255,0.92); stroke-width: 22; }
.hero__lede { max-width: 590px; margin: 0 auto 30px; font-size: 1.08rem; line-height: 1.65; color: #16224f; font-weight: 400; }
.hero__cta { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; }
.cue { margin-top: 38px; display: inline-flex; align-items: center; gap: 8px; font: 600 0.74rem/1 var(--body); letter-spacing: 0.18em; text-transform: uppercase; color: var(--ink); }
.cue .i { animation: cue 2s ease-in-out infinite; }
@keyframes cue { 0%, 20%, 50%, 80%, 100% { transform: translateY(0); } 40% { transform: translateY(5px); } 60% { transform: translateY(3px); } }
.stats { position: relative; z-index: 2; border-top: 1px solid rgba(14,29,77,0.14); padding: 24px var(--gut); }
.stats__grid { max-width: 1440px; margin: 0 auto; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.stat { padding: 0 24px; text-align: center; }
.stat + .stat { border-left: 1px solid rgba(14,29,77,0.16); }
.stat b { display: block; font: 600 1.12rem/1.25 var(--display); margin-bottom: 4px; }
.stat span { font-size: 0.92rem; line-height: 1.45; color: var(--ink); font-weight: 400; }

/* time-based entrance */
.in { animation: in-up 1s var(--ease) both; animation-delay: calc(var(--base, 0.15s) + var(--i, 0) * 0.1s); }
.mask > .in-mask { animation: in-mask 1.15s var(--ease) both; animation-delay: calc(var(--base, 0.15s) + var(--i, 0) * 0.1s); }
.hero__boldwrap .uline path, .phero .uline path { animation: ul-draw 1.1s var(--ease) both; animation-delay: calc(var(--base, 0.15s) + 0.75s); }
.has-pre { --base: 2.2s; }
@keyframes in-up { from { opacity: 0; transform: translateY(30px); } to { opacity: 1; transform: none; } }
@keyframes in-mask { from { transform: translateY(108%); } to { transform: none; } }
@keyframes ul-draw { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }

/* pinned story (home) — enabled by JS only in a real browser viewport */
.story-dots { display: none; }
.story-on .story { position: relative; height: 430vh; margin-top: calc(var(--hdr) * -1); }
.story-on .story__stage > .hero .hero__in { padding-top: 120px; padding-bottom: 20px; }
.story-on .story__stage { position: sticky; top: 0; height: 100vh; overflow: hidden; }
.story-on .story__stage > .hero, .story-on .story__stage > .scene { position: absolute; inset: 0; margin: 0; min-height: 0; height: 100%; }
.story-on .story__stage > .hero { z-index: 1; transform: scale(calc(1 + var(--r1, 0) * 0.3)); opacity: calc(1 - var(--r1, 0) * 0.85); transform-origin: 50% 46%; }
.story-on .story__stage > .sa { z-index: 2; display: flex; flex-direction: column; justify-content: center; padding-top: 96px; padding-bottom: 30px; clip-path: circle(calc(var(--r1, 0) * 88%) at 50% 50%); transform: scale(calc(1 - var(--r2, 0) * 0.06)); }
.story-on .story__stage > .sb { z-index: 3; display: flex; flex-direction: column; justify-content: center; padding-top: 96px; padding-bottom: 30px; clip-path: inset(calc((1 - var(--r2, 0)) * 100%) 0 0 0); }
.story-on .story__stage > .sc { z-index: 4; display: flex; flex-direction: column; justify-content: center; padding-top: 70px; clip-path: circle(calc(var(--r3, 0) * 112%) at 50% 100%); }
.story-on .story .rv, .story-on .story .sbl, .story-on .story .stat, .story-on .story .sb__title > span, .story-on .story .sc__title > span, .story-on .story .draw .stk { animation: none; }
.story-on .sa .blk { opacity: var(--r1, 0); transform: translateX(calc((1 - var(--r1, 0)) * -70px)); }
.story-on .sa .sa__col--r .blk { transform: translateX(calc((1 - var(--r1, 0)) * 70px)); }
.story-on .sa .sa__center { transform: scale(calc(0.86 + var(--r1, 0) * 0.14)); }
.story-on .sa .draw .stk { stroke-dasharray: 1; stroke-dashoffset: calc(1 - var(--r1, 0)); }
.story-on .sa .sa__art { max-width: 360px; }
.story-on .sa .scene__cue { margin-top: 28px; }
.story-on .sb .sb__title > span { opacity: var(--r2, 0); transform: translateY(calc((1 - var(--r2, 0)) * 40px)); }
.story-on .sb .sbl { opacity: clamp(0, calc(var(--r2, 0) * 1.6 - var(--k, 0) * 0.18), 1); transform: translateX(calc((1 - clamp(0, calc(var(--r2, 0) * 1.6 - var(--k, 0) * 0.18), 1)) * 90px)); }
.story-on .sc .chip-f { scale: clamp(0, calc(var(--r3, 0) * 1.5 - var(--k, 0) * 0.08), 1); }
.story-on .sc .sc__title { opacity: var(--r3, 0); transform: translateY(calc((1 - var(--r3, 0)) * 50px)) scale(calc(0.9 + var(--r3, 0) * 0.1)); }
.story-on .sc .sc__stage { min-height: 480px; }
.story-on .sc .stats { margin-top: 30px; }
.story-on .story-dots { position: absolute; right: 26px; top: 50%; z-index: 20; display: flex; flex-direction: column; gap: 12px; transform: translateY(-50%); }
.story-dot { display: block; width: 10px; height: 10px; border-radius: 999px; border: 2px solid var(--ink); background: transparent; transition: height 0.4s var(--ease), background 0.3s ease, border-color 0.3s ease; }
.story-dot.is-on { height: 28px; background: var(--ink); }
.story-on .story__stage.on-dark .story-dot { border-color: #fff; }
.story-on .story__stage.on-dark .story-dot.is-on { background: #fff; }

/* marquee */
.mq { position: relative; z-index: 2; overflow: hidden; background: var(--ink); color: #fff; padding: 22px 0; }
.mq__track { display: flex; align-items: center; width: max-content; animation: mq 40s linear infinite; }
.mq:hover .mq__track { animation-play-state: paused; }
.mq__item { display: inline-flex; align-items: center; font: 500 1.25rem/1 var(--display); text-transform: uppercase; letter-spacing: 0.05em; white-space: nowrap; }
.mq__item svg { width: 22px; height: 22px; margin: 0 32px; color: var(--accent); }
.mq__item:nth-child(even) svg { color: var(--cyan); }
@keyframes mq { to { transform: translateX(-50%); } }
.mq2 { overflow: hidden; background: #fff; padding: 80px 0 30px; }
.mq2__track { display: flex; align-items: center; width: max-content; animation: mq 50s linear infinite reverse; }
.mq2__item { display: inline-flex; align-items: center; white-space: nowrap; font: 700 clamp(3rem, 7.5vw, 7rem)/1.05 var(--display); text-transform: uppercase; letter-spacing: -0.02em; color: transparent; -webkit-text-stroke: 2px var(--ink); }
.mq2__item.is-fill { color: var(--accent); -webkit-text-stroke: 0; }
.mq2__item svg { width: 0.5em; height: 0.5em; margin: 0 0.45em; color: var(--violet); }

/* scene A */
.scene { position: relative; overflow: hidden; padding: 120px var(--gut); }
.sa { background: #fff; }
.sa__grid { position: relative; z-index: 1; width: 100%; max-width: 1440px; margin: 0 auto; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr) minmax(0, 1fr); gap: 48px; align-items: center; }
.sa__col { display: flex; flex-direction: column; gap: 70px; }
.sa__col--r { text-align: right; align-items: flex-end; }
.blk__label { font: 300 clamp(1.2rem, 1.7vw, 1.9rem)/1.05 var(--display); text-transform: uppercase; margin-bottom: 8px; }
.blk__title { font: 600 clamp(1.35rem, 1.8vw, 2.1rem)/1.05 var(--display); text-transform: uppercase; margin-bottom: 14px; transition: color 0.3s ease; }
.blk:hover .blk__title { color: var(--violet); }
.blk p { max-width: 330px; font-size: 0.98rem; font-weight: 300; line-height: 1.6; color: #4A5170; }
.sa__center { display: flex; flex-direction: column; align-items: center; text-align: center; }
.sa__tag { font: 600 0.8rem/1 var(--body); letter-spacing: 0.2em; text-transform: uppercase; margin-bottom: 14px; color: var(--muted); }
.sa__title { display: flex; flex-direction: column; align-items: center; font-family: var(--display); text-transform: uppercase; margin-bottom: 8px; }
.sa__title .l { font-weight: 300; font-size: clamp(1.5rem, 2.7vw, 2.5rem); line-height: 1.12; letter-spacing: 0.03em; }
.sa__title .b { font-weight: 600; font-size: clamp(2.2rem, 4.2vw, 4.2rem); line-height: 1; letter-spacing: -0.03em; }
.sa__art { width: 100%; max-width: 440px; height: auto; display: block; }
.sa__art .spin { transform-origin: 322px 88px; animation: spin 16s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.scene__cue { position: relative; z-index: 1; display: flex; justify-content: center; margin-top: 56px; }
.scene__cue .cue { margin-top: 0; }

/* scene B */
.sb { background: var(--night); color: #fff; }
.sb__glow { position: absolute; top: 20%; left: 78%; width: 900px; height: 900px; border-radius: 50%; transform: translate(-50%, -50%); background: radial-gradient(circle, color-mix(in srgb, var(--accent) 30%, transparent) 0%, color-mix(in srgb, var(--accent) 9%, transparent) 40%, transparent 70%); pointer-events: none; animation: glow-drift 14s ease-in-out infinite alternate; }
.sb__glow--v { top: 85%; left: 12%; width: 700px; height: 700px; background: radial-gradient(circle, rgba(85,79,242,0.32) 0%, rgba(85,79,242,0.08) 42%, transparent 70%); animation-duration: 18s; }
@keyframes glow-drift { from { transform: translate(-50%, -50%) scale(1); } to { transform: translate(-44%, -56%) scale(1.12); } }
.sb__dust { position: absolute; inset: -10%; opacity: 0.18; pointer-events: none; background-image: radial-gradient(circle, rgba(255,255,255,0.75) 0 1px, transparent 1.6px), radial-gradient(circle, rgba(255,117,140,0.6) 0 1.2px, transparent 1.8px), radial-gradient(circle, rgba(255,255,255,0.4) 0 0.8px, transparent 1.4px); background-size: 112px 112px, 176px 176px, 236px 236px; background-position: 12px 18px, 64px 42px, 28px 86px; animation: dust 24s ease-in-out infinite alternate; }
@keyframes dust { from { transform: translate3d(-1.2%, -1%, 0); } to { transform: translate3d(1.5%, 1.6%, 0); } }
.sb__grid { position: relative; z-index: 1; width: 100%; max-width: 1440px; margin: 0 auto; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 80px; align-items: center; }
.sb__title { display: flex; flex-direction: column; font-family: var(--display); text-transform: uppercase; margin-bottom: 26px; }
.sb__title .l { font-weight: 300; font-size: clamp(1.4rem, 2.4vw, 2.4rem); line-height: 1.12; letter-spacing: 0.04em; }
.sb__title .b { font-weight: 600; font-size: clamp(2.3rem, 4.4vw, 4.4rem); line-height: 1; letter-spacing: -0.03em; color: var(--accent); margin: 8px 0; }
.sb__copy { max-width: 480px; font-size: 1.02rem; line-height: 1.75; font-weight: 300; color: rgba(255,255,255,0.82); margin-bottom: 30px; }
.sb__lines { display: flex; flex-direction: column; }
.sbl { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 18px; align-items: end; padding: 24px 0; border-bottom: 1px solid rgba(255,255,255,0.13); }
.sbl:first-child { border-top: 1px solid rgba(255,255,255,0.13); }
.sbl::after { content: ''; position: absolute; left: 0; bottom: -1px; height: 1px; width: 100%; background: var(--accent); transform: scaleX(0); transform-origin: left; transition: transform 0.6s var(--ease); }
.sbl:hover::after { transform: scaleX(1); }
.sbl__t { display: flex; flex-direction: column; font-family: var(--display); text-transform: uppercase; line-height: 1; transition: transform 0.45s var(--ease); }
.sbl:hover .sbl__t { transform: translateX(10px); }
.sbl__t .l { font-weight: 300; font-size: clamp(0.95rem, 1.35vw, 1.25rem); letter-spacing: 0.05em; color: rgba(255,255,255,0.85); margin-bottom: 6px; }
.sbl__t .b { font-weight: 600; font-size: clamp(1.6rem, 2.7vw, 2.7rem); letter-spacing: -0.02em; transition: color 0.3s ease; }
.sbl:hover .sbl__t .b { color: var(--accent); }
.sbl__d { max-width: 240px; font-size: 0.88rem; line-height: 1.5; font-weight: 300; color: rgba(255,255,255,0.75); text-align: right; }

/* scene C */
.sc { background: var(--accent); padding-bottom: 0; }
.sc__stage { position: relative; z-index: 1; width: 100%; max-width: 1200px; margin: 0 auto; min-height: 620px; display: flex; align-items: center; justify-content: center; }
.sc__title { display: flex; flex-direction: column; align-items: center; text-align: center; font-family: var(--display); text-transform: uppercase; }
.sc__title .l { font-weight: 300; font-size: clamp(1.6rem, 3.8vw, 3.8rem); line-height: 1.12; letter-spacing: 0.04em; }
.sc__title .b { font-weight: 600; font-size: clamp(2.3rem, 5.6vw, 5.4rem); line-height: 1; letter-spacing: -0.03em; margin-top: 6px; }
.sc__sub { margin-top: 22px; max-width: 520px; font: 400 1.02rem/1.65 var(--body); text-transform: none; letter-spacing: 0; color: #16224f; }
.chip-f { position: absolute; display: inline-flex; align-items: center; gap: 10px; padding: 11px 18px 11px 11px; border-radius: 999px; background: #fff; color: var(--ink); font: 500 0.88rem/1 var(--body); box-shadow: 0 14px 30px rgba(14,29,77,0.16); white-space: nowrap; }
.chip-f__ic { width: 34px; height: 34px; border-radius: 50%; background: var(--blush); color: var(--pink); display: flex; align-items: center; justify-content: center; }
.chip-f:nth-child(even) .chip-f__ic { background: #EEEDFF; color: var(--violet); }
.cf1 { top: 3%; left: 4%; } .cf2 { top: 0; left: 41%; } .cf3 { top: 8%; right: 5%; } .cf4 { bottom: 6%; left: 10%; } .cf5 { bottom: 0; left: 43%; } .cf6 { bottom: 9%; right: 7%; }
.sc .stats { margin-top: 70px; }

/* generic sections */
.sec { position: relative; padding: 120px 0; overflow: clip; }
.sec--tight { padding: 80px 0; }
.sec--soft { background: var(--soft); }
.sec--blush { background: var(--blush); }
.sec--dark { background: var(--night); color: #fff; }
.blob { position: absolute; z-index: 0; pointer-events: none; }
.blob--a { top: 60px; left: -90px; width: 300px; }
.blob--b { top: 40px; right: -80px; width: 260px; }
.blob--c { bottom: -30px; right: -40px; width: 180px; }
.blob--d { bottom: 50px; left: -50px; width: 150px; }

/* about block */
.about__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: 70px; align-items: start; }
.about__media { position: sticky; top: 120px; }
.about__img { height: 560px; border-radius: 26px; box-shadow: 0 24px 50px rgba(14,29,77,0.1); }
.badge { position: absolute; right: -26px; bottom: 34px; z-index: 3; display: flex; align-items: center; gap: 14px; padding: 12px 20px 12px 12px; border-radius: 16px; background: #fff; border: 1px solid rgba(14,29,77,0.05); box-shadow: 0 18px 45px rgba(14,29,77,0.16); animation: bob 5s ease-in-out infinite alternate; }
.badge__ic { width: 40px; height: 40px; border-radius: 11px; background: var(--accent); color: var(--ink); display: flex; align-items: center; justify-content: center; }
.badge__tag { display: block; font: 600 0.64rem/1.1 var(--body); letter-spacing: 0.1em; color: var(--muted); }
.badge__t { display: block; font: 600 1.15rem/1.15 var(--display); margin-top: 3px; }
.feats { display: flex; flex-direction: column; gap: 22px; margin-top: 34px; }
.feat { padding-bottom: 22px; border-bottom: 1px solid #ECEDF4; transition: padding-left 0.35s var(--ease); }
.feat:last-child { border-bottom: 0; padding-bottom: 0; }
.feat:hover { padding-left: 10px; }
.feat__ic { width: 44px; height: 44px; border-radius: 12px; background: #EEEDFF; color: var(--violet); display: flex; align-items: center; justify-content: center; margin-bottom: 12px; transition: background 0.3s ease, color 0.3s ease, transform 0.35s var(--ease); }
.feat:hover .feat__ic { background: var(--accent); color: var(--ink); transform: translateY(-3px) rotate(-6deg); }
.feat h4 { font: 500 1.1rem/1.3 var(--display); margin-bottom: 6px; }
.feat p { font-size: 0.93rem; line-height: 1.65; color: #5A617E; font-weight: 300; }

/* rotating text badge */
.spinbadge { position: absolute; width: 150px; height: 150px; z-index: 4; pointer-events: none; }
.spinbadge__ring { width: 100%; height: 100%; animation: spin 18s linear infinite; }
.spinbadge__ring text { font: 600 11.5px var(--body); letter-spacing: 0.24em; text-transform: uppercase; fill: var(--ink); }
.spinbadge__core { position: absolute; inset: 34px; border-radius: 50%; background: var(--accent); color: #fff; display: flex; align-items: center; justify-content: center; box-shadow: 0 10px 24px rgba(14,29,77,0.18); }
.spinbadge--light .spinbadge__ring text { fill: #fff; }

/* video feature */
.vid { position: relative; overflow: hidden; background: var(--night); color: #fff; padding: 120px 0; }
.vid__grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr); gap: 80px; align-items: center; }
.vid__stage { position: relative; display: flex; justify-content: center; }
.phone { position: relative; width: 330px; aspect-ratio: 9 / 16; border-radius: 40px; padding: 10px; background: linear-gradient(160deg, #24357a, #0a1236); box-shadow: 0 40px 80px rgba(0,0,0,0.45), inset 0 0 0 1px rgba(255,255,255,0.12); }
.phone__screen { position: relative; width: 100%; height: 100%; border-radius: 31px; overflow: hidden; background: #000; }
.phone__screen video, .phone__screen img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.phone__notch { position: absolute; top: 18px; left: 50%; z-index: 3; width: 86px; height: 22px; border-radius: 20px; background: #05091c; transform: translateX(-50%); }
.vplay { position: absolute; left: 50%; top: 50%; z-index: 4; width: 84px; height: 84px; border-radius: 50%; border: 0; cursor: pointer; background: var(--accent); color: var(--ink); display: flex; align-items: center; justify-content: center; transform: translate(-50%, -50%); box-shadow: 0 0 0 0 color-mix(in srgb, var(--accent) 60%, transparent); animation: ring-pulse 2.2s infinite; transition: transform 0.35s var(--ease), opacity 0.3s ease; }
.vplay:hover { transform: translate(-50%, -50%) scale(1.08); }
.vplay .i { width: 30px; height: 30px; margin-left: 4px; }
.vplay.is-playing { opacity: 0; pointer-events: none; }
@keyframes ring-pulse { 0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--accent) 60%, transparent); } 70% { box-shadow: 0 0 0 22px transparent; } 100% { box-shadow: 0 0 0 0 transparent; } }
.vctl { position: absolute; right: 14px; bottom: 14px; z-index: 5; width: 44px; height: 44px; border-radius: 50%; border: 0; cursor: pointer; background: rgba(11,22,64,0.6); color: #fff; display: flex; align-items: center; justify-content: center; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.vid__float { position: absolute; z-index: 5; display: flex; align-items: center; gap: 12px; padding: 12px 16px; border-radius: 16px; background: #fff; color: var(--ink); box-shadow: 0 20px 40px rgba(0,0,0,0.3); font: 500 0.86rem/1.3 var(--body); }
.vid__float b { display: block; font-weight: 600; }
.vid__float--a { left: 2%; top: 18%; animation: bob 5s ease-in-out infinite alternate; }
.vid__float--b { right: 2%; bottom: 16%; animation: bob 4.4s ease-in-out -2s infinite alternate; }
.vid__float .ic { width: 38px; height: 38px; border-radius: 10px; background: var(--blush); color: var(--pink); display: flex; align-items: center; justify-content: center; }
.vid__float--b .ic { background: #EEEDFF; color: var(--violet); }
.vid .spinbadge { left: -12px; bottom: 8%; }
.chapters { display: flex; flex-direction: column; margin: 30px 0 34px; }
.chapter { display: flex; align-items: center; gap: 16px; padding: 16px 0; border-bottom: 1px solid rgba(255,255,255,0.12); width: 100%; background: none; border-left: 0; border-right: 0; border-top: 0; color: #fff; font: inherit; text-align: left; cursor: pointer; transition: padding-left 0.35s var(--ease); }
.chapter:first-child { border-top: 1px solid rgba(255,255,255,0.12); }
.chapter:hover { padding-left: 8px; }
.chapter__n { font: 600 0.78rem/1 var(--body); letter-spacing: 0.1em; color: var(--accent); width: 40px; }
.chapter__t { flex: 1; font: 500 1.05rem/1.3 var(--display); }
.chapter__time { font-size: 0.82rem; color: rgba(255,255,255,0.6); }

/* ways (care plans split) */
.sec--ways { padding-top: 40px; }
.ways { position: relative; height: 580px; border-radius: 28px; overflow: hidden; background: var(--night); box-shadow: 0 25px 60px rgba(14,29,77,0.16); --split: 54%; transition: --split 0.7s var(--ease); }
.way { position: absolute; inset: 0; padding: 50px 60px; display: flex; flex-direction: column; justify-content: space-between; color: #fff; overflow: hidden; }
.way__bg { position: absolute; inset: 0; z-index: 0; transform: scale(1.02); transition: transform 1.8s var(--ease); }
.way__bg svg { width: 100%; height: 100%; display: block; }
.way__photo { position: absolute; top: 0; height: 100%; object-fit: cover; }
.way--l .way__photo { left: 0; width: 70%; object-position: 50% 30%; }
.way--r .way__photo { right: 0; width: 72%; object-position: 60% 30%; }
.way__tint { position: absolute; inset: 0; mix-blend-mode: multiply; opacity: 0.45; }
.way--l .way__tint { background: linear-gradient(120deg, #0E1D4D 10%, transparent 70%); }
.way--r .way__tint { background: linear-gradient(240deg, #1A2B6B 10%, transparent 70%); }
.way:hover .way__bg { transform: scale(1.1); }
.way__scrim { position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, rgba(11,22,64,0.12) 0%, rgba(11,22,64,0.66) 100%); }
.way__top, .way__bot { position: relative; z-index: 2; }
.way--l { z-index: 2; clip-path: polygon(0 0, var(--split) 0, calc(var(--split) - 12%) 100%, 0 100%); }
.way--r { z-index: 1; align-items: flex-end; text-align: right; }
.way__seam { position: absolute; inset: 0; z-index: 3; pointer-events: none; background: rgba(255,255,255,0.92); clip-path: polygon(calc(var(--split) - 0.15%) 0, calc(var(--split) + 0.15%) 0, calc(var(--split) - 11.85%) 100%, calc(var(--split) - 12.15%) 100%); }
.way__badge { display: inline-block; padding: 8px 20px; border-radius: 30px; background: rgba(255,255,255,0.16); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); border: 1px solid rgba(255,255,255,0.28); font: 600 0.72rem/1.2 var(--body); letter-spacing: 0.1em; text-transform: uppercase; }
.way__title { display: flex; flex-direction: column; margin-bottom: 12px; font-family: var(--display); font-size: clamp(2.3rem, 3.7vw, 3.7rem); line-height: 1.06; letter-spacing: -0.02em; }
.way__title .w { font-weight: 500; color: #fff; }
.way__title .a { font-weight: 300; color: var(--accent); }
.way__desc { max-width: 360px; margin: 0 0 16px; font-size: 0.93rem; line-height: 1.6; color: rgba(255,255,255,0.92); opacity: 0; visibility: hidden; transform: translateY(16px); transition: opacity 0.5s var(--ease), transform 0.5s var(--ease), visibility 0.5s ease; }
.way--r .way__desc { margin-left: auto; }
.way:hover .way__desc, .way:focus-visible .way__desc { opacity: 1; visibility: visible; transform: none; }
.way__act { display: inline-flex; align-items: center; gap: 12px; font: 600 0.84rem/1 var(--body); letter-spacing: 0.08em; color: var(--accent); }
.way--r .way__act { flex-direction: row-reverse; }
.way__arrow { width: 38px; height: 38px; border-radius: 50%; background: var(--accent); color: var(--ink); display: flex; align-items: center; justify-content: center; transition: transform 0.35s cubic-bezier(0.34,1.56,0.64,1); }
.way:hover .way__arrow { transform: translate(3px, -3px) rotate(8deg); }

/* models */
.models { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 36px; perspective: 1400px; }
.model { position: relative; overflow: hidden; height: 100%; border-radius: 28px; padding: 52px; display: flex; flex-direction: column; transform: rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)); transition: transform 0.6s var(--ease), box-shadow 0.4s ease; will-change: transform; }
.model:hover { box-shadow: 0 30px 60px rgba(14,29,77,0.14); }
.model--light { background: var(--blush); color: var(--ink); }
.model--dark { background: var(--ink); color: #fff; }
.model__orb { position: absolute; top: -70px; right: -70px; width: 240px; height: 240px; border-radius: 50%; background: rgba(255,255,255,0.06); transition: transform 0.8s var(--ease); }
.model--light .model__orb { background: rgba(255,255,255,0.7); }
.model:hover .model__orb { transform: scale(1.25); }
.pill { align-self: flex-start; padding: 8px 18px; border-radius: 50px; font: 600 0.7rem/1.2 var(--body); letter-spacing: 0.09em; text-transform: uppercase; margin-bottom: 24px; position: relative; display: inline-block; }
.pill--dark { background: var(--ink); color: #fff; }
.pill--acc { background: var(--accent); color: var(--ink); }
.pill--violet { background: var(--violet); color: #fff; }
.model__t { position: relative; font: 500 clamp(1.8rem, 2.6vw, 2.5rem)/1.12 var(--display); letter-spacing: -0.01em; margin-bottom: 16px; }
.model__d { position: relative; font-size: 0.97rem; line-height: 1.7; margin-bottom: 34px; font-weight: 300; }
.model--light .model__d { color: #4A5170; }
.model--dark .model__d { color: rgba(255,255,255,0.8); }
.mboxes { display: flex; flex-direction: column; gap: 16px; position: relative; }
.mbox { border-radius: 16px; padding: 24px 26px; transition: padding-left 0.35s var(--ease), background 0.3s ease; }
.model--light .mbox { background: #fff; box-shadow: 0 4px 15px rgba(14,29,77,0.04); }
.model--dark .mbox { background: rgba(255,255,255,0.07); }
.mbox:hover { padding-left: 34px; }
.mbox__ic { width: 44px; height: 44px; border-radius: 12px; display: flex; align-items: center; justify-content: center; margin-bottom: 14px; transition: background 0.3s ease, color 0.3s ease, transform 0.35s var(--ease); }
.model--light .mbox__ic { background: #FFE1E7; color: var(--pink); }
.model--dark .mbox__ic { background: color-mix(in srgb, var(--accent) 18%, transparent); color: var(--accent); }
.mbox:hover .mbox__ic { background: var(--accent); color: var(--ink); transform: translateY(-3px) rotate(-6deg); }
.mbox h4 { font: 500 1.08rem/1.3 var(--display); margin-bottom: 6px; }
.mbox p { font-size: 0.89rem; line-height: 1.6; font-weight: 300; }
.model--light .mbox p { color: #5A617E; }
.model--dark .mbox p { color: rgba(255,255,255,0.74); }

/* services explorer */
.svc { background: var(--soft); }
.svc__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 30px; margin-bottom: 40px; flex-wrap: wrap; }
.svc__tabs { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 36px; }
.svc-tab { min-height: 44px; padding: 11px 18px; border-radius: 999px; border: 1px solid rgba(14,29,77,0.16); background: #fff; color: var(--ink); cursor: pointer; font: 500 0.87rem/1 var(--body); transition: background 0.25s ease, color 0.25s ease, border-color 0.25s ease, transform 0.3s var(--ease), box-shadow 0.3s ease; }
.svc-tab:hover { border-color: var(--violet); color: var(--violet); transform: translateY(-2px); }
.svc-tab.is-on { background: var(--ink); color: #fff; border-color: var(--ink); box-shadow: 0 10px 22px rgba(14,29,77,0.2); }
.svc__panel { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 56px; align-items: center; padding: 48px; border-radius: 28px; background: #fff; box-shadow: 0 20px 50px rgba(14,29,77,0.06); }
.svc__kick { display: inline-block; font: 600 0.76rem/1 var(--body); letter-spacing: 0.15em; text-transform: uppercase; color: var(--violet); margin-bottom: 14px; }
.svc__t { font: 600 clamp(2.1rem, 3.6vw, 3.4rem)/1.02 var(--display); text-transform: uppercase; letter-spacing: -0.03em; margin-bottom: 18px; }
.svc__d { font-size: 1rem; line-height: 1.75; font-weight: 300; color: #4A5170; margin-bottom: 24px; max-width: 520px; }
.chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 32px; }
.chip { padding: 8px 14px; border-radius: 999px; background: var(--blush); font: 500 0.83rem/1.2 var(--body); color: var(--ink); transition: background 0.25s ease, transform 0.3s var(--ease); }
.chip:hover { background: #FFE1E7; transform: translateY(-2px); }
.svc__img { height: 440px; border-radius: 22px; }
.svc__note { margin-top: 14px; font-size: 0.9rem; color: var(--muted); }
.svc__actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }

/* reviews */
.rev__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; }
.rev { display: flex; flex-direction: column; justify-content: space-between; height: 100%; padding: 40px 34px; border-radius: 24px; background: #fff; border: 1px solid #ECEDF4; box-shadow: 0 10px 30px rgba(14,29,77,0.04); transition: translate 0.35s var(--ease), box-shadow 0.35s ease, border-color 0.3s ease; }
.rev:hover { translate: 0 -6px; box-shadow: 0 20px 45px rgba(14,29,77,0.1); border-color: #FFD3DC; }
.stars { display: flex; gap: 4px; color: #F5A524; margin-bottom: 22px; }
.rev__q { font-size: 1.05rem; line-height: 1.65; font-weight: 300; color: #5A617E; font-style: italic; margin-bottom: 34px; }
.rev__by { display: flex; align-items: center; gap: 14px; padding-top: 22px; border-top: 1px solid #ECEDF4; }
.rev__av { width: 46px; height: 46px; border-radius: 50%; background: var(--blush); color: var(--pink); display: flex; align-items: center; justify-content: center; font: 600 0.82rem/1 var(--body); }
.rev__n { font: 500 1rem/1.2 var(--display); margin-bottom: 3px; }
.rev__r { font: 600 0.68rem/1 var(--body); letter-spacing: 0.08em; color: var(--muted); }

/* reviews carousel */
.rev__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 40px; flex-wrap: wrap; }
.rev__ctl { display: flex; gap: 12px; }
.rev__btn { width: 52px; height: 52px; border-radius: 50%; border: 1px solid #DCDEEA; background: #fff; color: var(--ink); display: flex; align-items: center; justify-content: center; cursor: pointer; transition: background 0.3s ease, color 0.3s ease, border-color 0.3s ease, transform 0.35s var(--ease); }
.rev__btn:hover { background: var(--ink); color: #fff; border-color: var(--ink); transform: scale(1.06); }
.rev__vp { overflow: hidden; padding: 12px 6px 30px; margin: 0 -6px; }
.rev__track { --per: 3; display: flex; gap: 28px; transition: transform 0.75s var(--ease); will-change: transform; }
.rev__track > .rev { position: relative; flex: 0 0 calc((100% - 28px * (var(--per) - 1)) / var(--per)); min-width: 0; height: auto; }
.rev__mark { position: absolute; top: 26px; right: 26px; width: 46px; height: 46px; fill: var(--blush); transition: fill 0.3s ease, transform 0.5s var(--ease); }
.rev:hover .rev__mark { fill: #FFD3DC; transform: rotate(-8deg) scale(1.08); }
.rev__track .rev__q { font-style: normal; color: #3F4664; }
.rev__dots { display: flex; justify-content: center; gap: 8px; margin-top: 18px; }
.rev__dot { width: 10px; height: 10px; padding: 0; border: 0; border-radius: 10px; background: #D3D6E4; cursor: pointer; transition: width 0.4s var(--ease), background 0.3s ease; }
.rev__dot.is-on { width: 30px; background: var(--ink); }
@media (max-width: 1180px) { .rev__track { --per: 2; } }
@media (max-width: 768px) { .rev__track { --per: 1; align-items: flex-start; } .rev__ctl { display: none; } }

/* featured quote (about page) */
.quote { position: relative; overflow: hidden; margin: 0; border-radius: 30px; padding: 64px 70px; background: var(--blush); display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 40px; align-items: start; }
.quote__mark { width: 90px; height: 90px; fill: var(--accent); }
.quote blockquote { margin: 0; font: 400 clamp(1.2rem, 1.9vw, 1.65rem)/1.55 var(--display); color: var(--ink); }
.quote figcaption { margin-top: 26px; display: flex; align-items: center; gap: 14px; }
.quote .stars { margin: 0 0 18px; }
.quote__orb { position: absolute; right: -80px; bottom: -80px; width: 260px; height: 260px; border-radius: 50%; background: rgba(255,255,255,0.7); }
@media (max-width: 768px) { .quote { grid-template-columns: minmax(0, 1fr); padding: 36px 24px; gap: 14px; } .quote__mark { width: 56px; height: 56px; } }

/* careers band */
.careers { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr); border-radius: 28px; overflow: hidden; background: #EEEDFF; }
.careers__txt { padding: 60px; display: flex; flex-direction: column; justify-content: center; }
.careers__img { min-height: 380px; }

/* CTA + forms */
.cta { position: relative; overflow: hidden; border-radius: 28px; background: var(--ink); color: #fff; padding: 72px 64px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 0.95fr); gap: 56px; align-items: center; box-shadow: 0 24px 55px rgba(14,29,77,0.2); }
.cta--solo { grid-template-columns: minmax(0, 1fr); text-align: center; justify-items: center; }
.cta__glow { position: absolute; top: var(--gy, 20%); left: var(--gx, 80%); width: 540px; height: 540px; border-radius: 50%; transform: translate(-50%, -50%); background: radial-gradient(circle, color-mix(in srgb, var(--accent) 32%, transparent) 0%, color-mix(in srgb, var(--accent) 9%, transparent) 40%, transparent 70%); pointer-events: none; transition: top 0.7s var(--ease), left 0.7s var(--ease); }
.cta__glow--v { top: 90%; left: 8%; width: 460px; height: 460px; background: radial-gradient(circle, rgba(85,79,242,0.35) 0%, rgba(85,79,242,0.08) 42%, transparent 70%); transition: none; }
.cta__l, .cta__form { position: relative; z-index: 1; }
.cta__title { display: flex; flex-direction: column; font-family: var(--display); font-size: clamp(2.2rem, 3.8vw, 3.6rem); line-height: 1.08; letter-spacing: -0.02em; text-transform: uppercase; margin-bottom: 22px; }
.cta--solo .cta__title { align-items: center; }
.cta__title .w { font-weight: 500; }
.cta__title .a { font-weight: 300; color: var(--accent); }
.cta__d { font-size: 1rem; line-height: 1.75; color: rgba(255,255,255,0.8); max-width: 520px; margin-bottom: 30px; font-weight: 300; }
.cta--solo .cta__d { margin-left: auto; margin-right: auto; }
.cta__rows { display: flex; flex-direction: column; gap: 14px; margin-bottom: 32px; }
.cta__row { display: flex; align-items: center; gap: 14px; font-size: 0.97rem; color: rgba(255,255,255,0.94); }
.cta__row .ic { width: 42px; height: 42px; border-radius: 12px; background: rgba(255,255,255,0.08); color: var(--accent); display: flex; align-items: center; justify-content: center; transition: background 0.3s ease, color 0.3s ease, transform 0.35s var(--ease); }
a.cta__row:hover .ic { background: var(--accent); color: var(--ink); transform: rotate(-8deg); }
.cta__btns { display: flex; flex-wrap: wrap; gap: 14px; }
.cta--solo .cta__btns { justify-content: center; }
.form { background: #fff; color: var(--ink); border-radius: 22px; padding: 34px; display: flex; flex-direction: column; gap: 16px; }
.form--card { box-shadow: 0 24px 60px rgba(14,29,77,0.1); border: 1px solid #ECEDF4; }
.form__t { font: 600 1.25rem/1.25 var(--display); text-transform: uppercase; }
.form__s { font-size: 0.9rem; color: var(--muted); margin-top: -8px; }
.fld { display: flex; flex-direction: column; gap: 7px; }
.fld > label, .fld__l { font: 600 0.7rem/1 var(--body); letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted); }
.fld input, .fld select, .fld textarea { width: 100%; min-height: 48px; padding: 12px 14px; border-radius: 11px; border: 1px solid #DCDEEA; background: #FAFAFD; font: 400 0.95rem/1.4 var(--body); color: var(--ink); outline: none; transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease; }
.fld textarea { resize: vertical; min-height: 96px; }
.fld input:focus, .fld select:focus, .fld textarea:focus { border-color: var(--violet); background: #fff; box-shadow: 0 0 0 4px rgba(85,79,242,0.15); }
.fld input[type="file"] { padding: 10px; min-height: 0; }
.fld-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.form .btn { width: 100%; margin-top: 4px; }
.opts { display: flex; flex-wrap: wrap; gap: 8px; }
.opt { position: relative; display: inline-flex; }
.opt input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.opt span { display: inline-flex; align-items: center; gap: 8px; min-height: 42px; padding: 10px 16px; border-radius: 999px; border: 1px solid #DCDEEA; background: #FAFAFD; font: 500 0.86rem/1 var(--body); cursor: pointer; transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease; }
.opt input:checked + span { background: var(--ink); color: #fff; border-color: var(--ink); }
.opt input:focus-visible + span { box-shadow: 0 0 0 4px rgba(85,79,242,0.2); }
.done { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; padding: 10px 0; animation: in-up 0.7s var(--ease) both; }
.done__ic { width: 58px; height: 58px; border-radius: 50%; background: var(--accent); color: var(--ink); display: flex; align-items: center; justify-content: center; animation: pop-in 0.6s cubic-bezier(0.34,1.56,0.64,1) both; }
.done__ic .i { width: 26px; height: 26px; stroke-width: 2.4; }
.done h4 { font: 600 1.4rem/1.2 var(--display); }
.done p { color: var(--muted); }
@keyframes pop-in { from { transform: scale(0.4); opacity: 0; } to { transform: none; opacity: 1; } }

/* wizard (careers) */
.wiz__bar { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-bottom: 6px; }
.wiz__step { display: flex; flex-direction: column; gap: 8px; font: 600 0.7rem/1.2 var(--body); letter-spacing: 0.08em; text-transform: uppercase; color: #9AA0B8; }
.wiz__step i { display: block; height: 4px; border-radius: 4px; background: #E6E7F0; overflow: hidden; position: relative; }
.wiz__step i::after { content: ''; position: absolute; inset: 0; background: var(--violet); transform: scaleX(0); transform-origin: left; transition: transform 0.6s var(--ease); }
.wiz__step.is-done, .wiz__step.is-on { color: var(--ink); }
.wiz__step.is-done i::after, .wiz__step.is-on i::after { transform: scaleX(1); }
.wiz__panel { display: flex; flex-direction: column; gap: 16px; animation: in-right 0.55s var(--ease) both; }
.wiz__nav { display: flex; gap: 10px; }
.wiz__nav .btn { flex: 1; }

/* feed */
.feed__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 46px; flex-wrap: wrap; }
.feed__grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 18px; }
.tile { position: relative; display: block; aspect-ratio: 9 / 15; border-radius: 18px; overflow: hidden; border: 1px solid #ECEDF4; box-shadow: 0 6px 20px rgba(14,29,77,0.05); transition: translate 0.4s var(--ease), box-shadow 0.4s ease; background: #F3EFF5; }
.tile:hover { translate: 0 -6px; box-shadow: 0 16px 35px rgba(14,29,77,0.14); }
.tile img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: scale 0.7s var(--ease); }
.tile:hover img { scale: 1.08; }
.tile__ov { position: absolute; inset: 0; z-index: 2; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; padding: 18px; text-align: center; background: rgba(11,22,64,0.66); color: #fff; opacity: 0; transition: opacity 0.35s ease; font: 500 0.82rem/1.4 var(--body); }
.tile__ov .i { width: 34px; height: 34px; }
.tile:hover .tile__ov, .tile:focus-visible .tile__ov { opacity: 1; }
.tile__badge { position: absolute; top: 10px; right: 10px; z-index: 3; width: 30px; height: 30px; border-radius: 50%; background: rgba(11,22,64,0.5); color: #fff; display: flex; align-items: center; justify-content: center; }
.tile__date { position: absolute; left: 10px; bottom: 10px; z-index: 3; padding: 5px 10px; border-radius: 999px; background: rgba(255,255,255,0.92); font: 600 0.68rem/1 var(--body); letter-spacing: 0.04em; color: var(--ink); }

/* inner page hero */
.phero { position: relative; margin-top: calc(var(--hdr) * -1); padding: 170px 0 90px; background: var(--accent); overflow: hidden; }
.phero__grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr); gap: 60px; align-items: center; }
.crumbs { display: flex; align-items: center; gap: 10px; margin-bottom: 22px; font: 500 0.82rem/1 var(--body); color: #16224f; }
.crumbs a { opacity: 0.75; transition: opacity 0.2s ease; }
.crumbs a:hover { opacity: 1; }
.phero__title { display: flex; flex-direction: column; margin: 0 0 34px; font-family: var(--display); text-transform: uppercase; }
.phero__title .hero__light { font-size: clamp(1.5rem, 3vw, 2.9rem); }
.phero__title .hero__bold { font-size: clamp(2.1rem, 4.5vw, 4.3rem); background: none; color: var(--ink); }
.phero .ul-wrap { align-self: flex-start; }
.phero .uline path { stroke: #fff; stroke-width: 18; }
.phero__lede { max-width: 540px; font-size: 1.06rem; line-height: 1.7; color: #16224f; margin-bottom: 30px; }
.phero__cta { display: flex; flex-wrap: wrap; gap: 12px; }
.phero__media { position: relative; height: 480px; }
.phero__img { position: absolute; border-radius: 26px; overflow: hidden; box-shadow: 0 30px 60px rgba(14,29,77,0.25); }
.phero__img img { width: 100%; height: 100%; object-fit: cover; }
.phero__img--a { right: 0; top: 0; width: 78%; height: 78%; animation: in-up 1.1s var(--ease) both 0.25s; }
.phero__img--b { left: 0; bottom: 0; width: 46%; height: 52%; border: 6px solid var(--accent); animation: in-up 1.1s var(--ease) both 0.45s; }
.phero .spinbadge { left: 34%; top: 0; }

/* service cards (services page) */
.sgrid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; }
.scard { position: relative; display: flex; flex-direction: column; border-radius: 24px; overflow: hidden; background: #fff; border: 1px solid #ECEDF4; box-shadow: 0 10px 30px rgba(14,29,77,0.05); transition: translate 0.4s var(--ease), box-shadow 0.4s ease; height: 100%; }
.scard:hover { translate: 0 -8px; box-shadow: 0 26px 50px rgba(14,29,77,0.12); }
.scard__img { position: relative; height: 230px; overflow: hidden; background: #FFF5F2; }
.scard__img img, .scard__img svg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: scale 0.9s var(--ease); }
.scard:hover .scard__img img, .scard:hover .scard__img svg { scale: 1.08; }
.scard__num { position: absolute; left: 16px; top: 16px; z-index: 2; padding: 6px 12px; border-radius: 999px; background: rgba(255,255,255,0.94); font: 600 0.72rem/1 var(--body); letter-spacing: 0.08em; }
.scard__body { flex: 1; display: flex; flex-direction: column; padding: 26px 26px 28px; }
.scard__kick { font: 600 0.7rem/1 var(--body); letter-spacing: 0.14em; text-transform: uppercase; color: var(--violet); margin-bottom: 10px; }
.scard__t { font: 600 1.45rem/1.15 var(--display); margin-bottom: 10px; }
.scard__d { font-size: 0.92rem; line-height: 1.65; font-weight: 300; color: #4A5170; margin-bottom: 16px; }
.ticks { list-style: none; margin: 0 0 22px; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.ticks li { display: flex; align-items: center; gap: 10px; font-size: 0.88rem; color: var(--ink); }
.ticks li .i { width: 18px; height: 18px; color: var(--pink); }
.scard__go { margin-top: auto; display: inline-flex; align-items: center; gap: 10px; font: 600 0.8rem/1 var(--body); letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink); }
.scard__go .way__arrow { width: 32px; height: 32px; }
.scard:hover .scard__go .way__arrow { transform: translate(3px, -3px) rotate(8deg); }

/* feature band (nanny) */
.feature { position: relative; overflow: hidden; border-radius: 32px; background: linear-gradient(135deg, #FFE3E9 0%, #FFF4F6 60%, #EEEDFF 100%); padding: 70px 64px; display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr); gap: 50px; align-items: center; }
.feature .phone { width: 300px; margin: 0 auto; }
.feature__list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin: 26px 0 32px; }
.feature__item { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border-radius: 14px; background: rgba(255,255,255,0.8); font: 500 0.9rem/1.3 var(--body); transition: transform 0.35s var(--ease), box-shadow 0.35s ease; }
.feature__item:hover { transform: translateY(-3px); box-shadow: 0 12px 24px rgba(14,29,77,0.08); }
.feature__item .ic { width: 38px; height: 38px; border-radius: 10px; background: var(--accent); color: #fff; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }

/* steps */
.steps { position: relative; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 22px; }
.steps__line { position: absolute; left: 6%; right: 6%; top: 34px; height: 2px; background: repeating-linear-gradient(90deg, rgba(255,255,255,0.35) 0 8px, transparent 8px 16px); }
.step { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; }
.step__n { position: relative; z-index: 1; width: 70px; height: 70px; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin-bottom: 20px; background: var(--night); border: 2px solid var(--accent); color: var(--accent); font: 600 1.15rem/1 var(--display); transition: background 0.3s ease, color 0.3s ease, transform 0.4s var(--ease); }
.step:hover .step__n { background: var(--accent); color: var(--ink); transform: scale(1.08) rotate(-6deg); }
.step h4 { font: 600 1.08rem/1.3 var(--display); margin-bottom: 8px; }
.step p { font-size: 0.88rem; line-height: 1.6; color: rgba(255,255,255,0.74); font-weight: 300; }

/* about page */
.mv { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; }
.mv__card { position: relative; overflow: hidden; border-radius: 28px; padding: 54px 48px; min-height: 330px; display: flex; flex-direction: column; justify-content: flex-end; }
.mv__card--m { background: var(--ink); color: #fff; }
.mv__card--v { background: var(--accent); color: var(--ink); }
.mv__big { position: absolute; top: 26px; right: 34px; font: 700 7rem/1 var(--display); opacity: 0.12; letter-spacing: -0.04em; }
.mv__lbl { font: 600 0.76rem/1 var(--body); letter-spacing: 0.16em; text-transform: uppercase; margin-bottom: 16px; }
.mv__card--m .mv__lbl { color: var(--accent); }
.mv__q { font: 500 clamp(1.5rem, 2.3vw, 2.2rem)/1.25 var(--display); letter-spacing: -0.01em; max-width: 520px; }
.values { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 22px; }
.value { padding: 34px 28px; border-radius: 22px; background: #fff; border: 1px solid #ECEDF4; transition: translate 0.4s var(--ease), box-shadow 0.4s ease, background 0.3s ease; }
.value:hover { translate: 0 -6px; box-shadow: 0 22px 44px rgba(14,29,77,0.1); }
.value__ic { width: 56px; height: 56px; border-radius: 16px; background: var(--blush); color: var(--pink); display: flex; align-items: center; justify-content: center; margin-bottom: 20px; transition: transform 0.4s var(--ease), background 0.3s ease, color 0.3s ease; }
.value:nth-child(even) .value__ic { background: #EEEDFF; color: var(--violet); }
.value:hover .value__ic { transform: rotate(-8deg) scale(1.06); background: var(--accent); color: #fff; }
.value h4 { font: 600 1.15rem/1.3 var(--display); margin-bottom: 8px; }
.value p { font-size: 0.9rem; line-height: 1.65; color: #5A617E; font-weight: 300; }
.strip { display: grid; grid-template-columns: 1.3fr 1fr 1fr 1.3fr; gap: 18px; }
.strip .ph { height: 300px; border-radius: 22px; }
.strip .ph:nth-child(even) { margin-top: 50px; }

/* careers page */
.roles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.role { position: relative; overflow: hidden; display: flex; flex-direction: column; padding: 34px 30px; border-radius: 24px; background: #fff; border: 1px solid #ECEDF4; transition: translate 0.4s var(--ease), box-shadow 0.4s ease; }
.role:hover { translate: 0 -6px; box-shadow: 0 22px 44px rgba(14,29,77,0.1); }
.role::before { content: ''; position: absolute; left: 0; top: 0; height: 4px; width: 100%; background: linear-gradient(90deg, var(--accent), var(--violet)); transform: scaleX(0); transform-origin: left; transition: transform 0.6s var(--ease); }
.role:hover::before { transform: scaleX(1); }
.role__ic { width: 52px; height: 52px; border-radius: 14px; background: var(--blush); color: var(--pink); display: flex; align-items: center; justify-content: center; margin-bottom: 20px; }
.role h4 { font: 600 1.25rem/1.25 var(--display); margin-bottom: 8px; }
.role p { font-size: 0.9rem; line-height: 1.65; color: #5A617E; font-weight: 300; margin-bottom: 18px; }
.role__tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: auto; }
.role__tags span { padding: 6px 12px; border-radius: 999px; background: var(--soft); font: 500 0.76rem/1.2 var(--body); }
.apply { display: grid; grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr); gap: 60px; align-items: start; }
.apply__aside { position: sticky; top: 120px; }
.perks { display: flex; flex-direction: column; gap: 14px; margin-top: 28px; }
.perk { display: flex; gap: 14px; align-items: flex-start; }
.perk .ic { width: 40px; height: 40px; border-radius: 12px; background: #EEEDFF; color: var(--violet); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.perk b { display: block; font: 600 1rem/1.3 var(--display); margin-bottom: 2px; }
.perk span { font-size: 0.9rem; color: #5A617E; font-weight: 300; line-height: 1.55; }

/* contact page */
.ccards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.ccard { position: relative; overflow: hidden; display: flex; flex-direction: column; gap: 6px; padding: 30px 28px; border-radius: 22px; background: #fff; border: 1px solid #ECEDF4; box-shadow: 0 10px 30px rgba(14,29,77,0.05); transition: translate 0.4s var(--ease), box-shadow 0.4s ease; }
.ccard:hover { translate: 0 -6px; box-shadow: 0 22px 44px rgba(14,29,77,0.12); }
.ccard__ic { width: 52px; height: 52px; border-radius: 14px; background: var(--accent); color: #fff; display: flex; align-items: center; justify-content: center; margin-bottom: 14px; transition: transform 0.4s var(--ease); }
.ccard:hover .ccard__ic { transform: rotate(-8deg) scale(1.06); }
.ccard:nth-child(2) .ccard__ic { background: var(--violet); }
.ccard:nth-child(3) .ccard__ic { background: var(--cyan); }
.ccard__l { font: 600 0.72rem/1 var(--body); letter-spacing: 0.12em; text-transform: uppercase; color: var(--muted); }
.ccard__v { font: 600 1.2rem/1.35 var(--display); word-break: break-word; }
.ccard__s { font-size: 0.86rem; color: #5A617E; font-weight: 300; }
.contact__grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr); gap: 50px; align-items: start; }
.areas { position: relative; overflow: hidden; border-radius: 28px; padding: 44px 40px; background: var(--night); color: #fff; }
.areas__chips { display: flex; flex-wrap: wrap; gap: 10px; margin: 22px 0 10px; }
.areas__chip { display: inline-flex; align-items: center; gap: 8px; padding: 10px 16px; border-radius: 999px; background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.14); font: 500 0.9rem/1 var(--body); transition: background 0.3s ease, transform 0.35s var(--ease); }
.areas__chip:hover { background: var(--accent); color: var(--ink); transform: translateY(-2px); }
.areas__chip .i { width: 16px; height: 16px; color: var(--accent); }
.areas__chip:hover .i { color: var(--ink); }
.areas__map { position: relative; height: 210px; margin-top: 18px; }
.areas__map svg { width: 100%; height: 100%; }
.pin { transform-box: fill-box; transform-origin: 50% 100%; animation: pin-drop 2.6s var(--ease) infinite; }
.pin--2 { animation-delay: 0.4s; } .pin--3 { animation-delay: 0.8s; }
@keyframes pin-drop { 0%, 60%, 100% { transform: translateY(0); } 30% { transform: translateY(-8px); } }
.pulse { transform-box: fill-box; transform-origin: center; animation: map-pulse 2.6s ease-out infinite; }
@keyframes map-pulse { from { transform: scale(0.4); opacity: 0.9; } to { transform: scale(2.4); opacity: 0; } }
.faq { display: flex; flex-direction: column; gap: 12px; max-width: 920px; margin: 0 auto; }
.faq__item { border-radius: 18px; background: #fff; border: 1px solid #ECEDF4; overflow: hidden; transition: box-shadow 0.3s ease, border-color 0.3s ease; }
.faq__item.is-open { border-color: #FFD3DC; box-shadow: 0 16px 36px rgba(14,29,77,0.08); }
.faq__q { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 22px 26px; background: none; border: 0; cursor: pointer; text-align: left; font: 500 1.05rem/1.35 var(--display); color: var(--ink); }
.faq__pm { width: 34px; height: 34px; border-radius: 50%; background: var(--blush); color: var(--pink); display: flex; align-items: center; justify-content: center; flex-shrink: 0; transition: transform 0.4s var(--ease), background 0.3s ease, color 0.3s ease; }
.faq__item.is-open .faq__pm { transform: rotate(45deg); background: var(--accent); color: #fff; }
.faq__a { padding: 0 26px 24px; font-size: 0.95rem; line-height: 1.7; color: #4A5170; font-weight: 300; animation: in-up 0.45s var(--ease) both; }

/* footer */
.foot { position: sticky; bottom: 0; z-index: 0; overflow: hidden; background: var(--accent); color: var(--ink); padding: 80px 0 0; font-family: var(--body); }
.foot__grid { display: grid; grid-template-columns: 1.35fr 1fr 1.05fr 1fr 1.2fr; gap: 40px; margin-bottom: 56px; }
.foot__logo { width: 150px; display: block; }
.foot__hl { margin-top: 22px; display: flex; flex-direction: column; gap: 10px; font-size: 0.92rem; line-height: 1.65; }
.foot__h { font: 600 0.78rem/1 var(--body); letter-spacing: 0.14em; text-transform: uppercase; margin-bottom: 22px; }
.foot__links { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 13px; }
.foot__links a { font-size: 0.93rem; position: relative; transition: color 0.2s ease; }
.foot__links a::after { content: ''; position: absolute; left: 0; bottom: -2px; height: 1.5px; width: 100%; background: var(--ink); transform: scaleX(0); transform-origin: right; transition: transform 0.4s var(--ease); }
.foot__links a:hover::after { transform: scaleX(1); transform-origin: left; }
.foot__contact li { display: flex; align-items: center; gap: 12px; font-size: 0.93rem; }
.foot__big { width: 100%; max-width: 1000px; margin: 10px auto 30px; opacity: 0.95; display: block; }
.foot__bot { display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; padding: 26px 0 32px; border-top: 1px solid rgba(14,29,77,0.2); font-size: 0.86rem; }
.socials { display: flex; gap: 12px; }
.soc { width: 44px; height: 44px; border-radius: 50%; overflow: hidden; display: block; border: 1px solid rgba(14,29,77,0.16); }
.soc__roll { display: flex; flex-direction: column; height: 200%; transition: transform 0.35s var(--ease); }
.soc:hover .soc__roll, .soc:focus-visible .soc__roll { transform: translateY(-50%); }
.soc__d { height: 50%; display: flex; align-items: center; justify-content: center; color: #fff; }
.soc__d--back { background: #fff; color: var(--ink); }
.soc--fb .soc__d--front { background: #1877F2; }
.soc--ig .soc__d--front { background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285aeb 90%); }
.soc--tt .soc__d--front { background: #000; }
.fab { position: fixed; right: 32px; bottom: 28px; z-index: 1500; display: inline-flex; align-items: center; gap: 12px; padding: 12px 20px; min-height: 48px; border-radius: 12px; background: var(--ink); color: #fff; border: 1px solid rgba(255,255,255,0.15); box-shadow: 0 12px 30px rgba(14,29,77,0.32); font: 600 0.84rem/1 var(--body); letter-spacing: 0.06em; transition: transform 0.35s var(--ease), background 0.3s ease; }
.fab:hover { color: #fff; background: var(--violet); transform: translateY(-3px) scale(1.03); }
@supports (animation-timeline: scroll()) {
  .fab { animation: fab-hide linear both; animation-timeline: scroll(root); animation-range: calc(100% - 240px) calc(100% - 110px); }
}
@keyframes fab-hide { from { opacity: 1; visibility: visible; } to { opacity: 0; visibility: hidden; translate: 0 16px; } }
.fab__ic { position: relative; display: flex; }
.fab__dot { position: absolute; top: -3px; right: -4px; width: 9px; height: 9px; border-radius: 50%; background: #22C55E; border: 2px solid var(--ink); animation: pulse 2s infinite; }
@keyframes pulse { 0% { box-shadow: 0 0 0 0 rgba(34,197,94,0.8); } 70% { box-shadow: 0 0 0 7px rgba(34,197,94,0); } 100% { box-shadow: 0 0 0 0 rgba(34,197,94,0); } }

/* scroll-driven reveals (the end state is the default, so everything shows when motion is off) */
@supports (animation-timeline: view()) {
  .rv { animation: rv-up linear both; animation-timeline: view(); animation-range: entry 0% cover 28%; }
  .rv--l { animation-name: rv-left; }
  .rv--r { animation-name: rv-right; }
  .rv--2 { animation-range: entry 8% cover 34%; }
  .rv--3 { animation-range: entry 16% cover 40%; }
  .rv--4 { animation-range: entry 22% cover 44%; }
  .h2 > span, .cta__title > span, .sb__title > span, .sc__title > span { animation: line-in linear both; animation-timeline: view(); animation-range: entry 10% cover 30%; }
  .h2 > span + span, .cta__title > span + span, .sb__title > span + span, .sc__title > span + span { animation-range: entry 18% cover 36%; }
  .sb__title > span + span + span { animation-range: entry 26% cover 42%; }
  .uline--view path { animation: ul-draw linear both; animation-timeline: view(); animation-range: entry 45% cover 52%; }
  .draw .stk { stroke-dasharray: 1; animation: ul-draw linear both; animation-timeline: view(); animation-range: entry 25% cover 55%; }
  .ph { animation: wipe linear both; animation-timeline: view(); animation-range: entry 0% cover 38%; }
  .ph > svg, .ph > img, .way__photo { animation: zoom-out linear both; animation-timeline: view(); animation-range: entry 0% exit 100%; }
  .blob { animation: drift linear both; animation-timeline: view(); animation-range: cover 0% cover 100%; }
  .tile, .scard, .value, .role, .ccard, .step { animation: pop linear both; animation-timeline: view(); animation-range: entry 0% cover 24%; }
  .k1.tile, .k1.scard, .k1.value, .k1.role, .k1.ccard, .k1.step { animation-range: entry 4% cover 28%; }
  .k2.tile, .k2.scard, .k2.value, .k2.role, .k2.ccard, .k2.step { animation-range: entry 8% cover 32%; }
  .k3.tile, .k3.value, .k3.step { animation-range: entry 12% cover 36%; }
  .k4.tile, .k4.step { animation-range: entry 16% cover 40%; }
  .k5.tile { animation-range: entry 20% cover 44%; }
  .sbl { animation: rv-right linear both; animation-timeline: view(); animation-range: entry 0% cover 30%; }
  .stat { animation: rv-up linear both; animation-timeline: view(); animation-range: entry 0% cover 20%; }
  .hero .stat { animation: none; }
  .steps__line { animation: grow-x linear both; animation-timeline: view(); animation-range: entry 10% cover 45%; transform-origin: left; }
  .strip .ph:nth-child(even) > img { animation-name: zoom-out; }
  .mv__big { animation: drift-x linear both; animation-timeline: view(); animation-range: cover 0% cover 100%; }
}
@keyframes rv-up { from { opacity: 0; transform: translateY(40px); } to { opacity: 1; transform: none; } }
@keyframes rv-left { from { opacity: 0; transform: translateX(-50px); } to { opacity: 1; transform: none; } }
@keyframes rv-right { from { opacity: 0; transform: translateX(50px); } to { opacity: 1; transform: none; } }
@keyframes line-in { from { opacity: 0; transform: translateY(55%); clip-path: inset(0 0 100% 0); } to { opacity: 1; transform: none; clip-path: inset(0 0 -20% 0); } }
@keyframes wipe { from { clip-path: inset(14% 14% 14% 14% round 28px); } to { clip-path: inset(0 0 0 0 round 0px); } }
@keyframes zoom-out { from { transform: scale(1.2); } to { transform: scale(1); } }
@keyframes drift { from { transform: translateY(80px) rotate(-8deg); } to { transform: translateY(-80px) rotate(8deg); } }
@keyframes drift-x { from { transform: translateX(40px); } to { transform: translateX(-40px); } }
@keyframes pop { from { opacity: 0; transform: translateY(40px) scale(0.92); } to { opacity: 1; transform: none; } }

@media (prefers-reduced-motion: reduce) {
  .ahc *, .ahc *::before, .ahc *::after, .hdr *, .foot * { animation: none !important; transition-duration: 0.01ms !important; }
  .pre, .cur { display: none !important; }
}

/* responsive */
@media (max-width: 1180px) {
  .nav { display: none; }
  .burger { display: flex; }
  .sa__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .sa__center { grid-column: 1 / -1; order: -1; }
  .sa__col--r { text-align: left; align-items: flex-start; }
  .sb__grid, .about__grid, .models, .svc__panel, .cta, .careers, .vid__grid, .phero__grid, .feature, .apply, .contact__grid { grid-template-columns: minmax(0, 1fr); }
  .about__media, .apply__aside { position: relative; top: 0; }
  .about__img { height: 440px; }
  .badge { right: 16px; }
  .rev__grid, .sgrid, .roles, .ccards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .values { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .steps { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 40px; }
  .steps__line { display: none; }
  .feed__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .foot__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .foot__grid > div:first-child { grid-column: 1 / -1; }
  .cf2, .cf5 { left: 36%; }
  .phero__media { height: 420px; }
}
@media (max-width: 768px) {
  :root, .ahc { --gut: 20px; }
  .hdr__talk { display: none; }
  .logo { width: 116px; height: 44px; }
  .hero { min-height: 760px; }
  .hero__in { padding-top: 130px; }
  .hs--1, .hs--4 { width: 150px; }
  .hs--2, .hs--3 { display: none; }
  .stats__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 18px; }
  .stat { padding: 0 10px; }
  .stat + .stat { border-left: 0; }
  .stat:nth-child(even) { border-left: 1px solid rgba(14,29,77,0.16); }
  .stat b { font-size: 1rem; }
  .stat span { font-size: 0.82rem; }
  .mq__item { font-size: 1rem; }
  .mq__item svg { margin: 0 20px; }
  .scene, .sec, .vid { padding-top: 80px; padding-bottom: 80px; }
  .sa__grid { grid-template-columns: minmax(0, 1fr); gap: 40px; }
  .sa__col { gap: 40px; }
  .sb__grid { gap: 40px; }
  .sbl { grid-template-columns: minmax(0, 1fr); }
  .sbl__d { text-align: left; max-width: none; }
  .chip-f { display: none; }
  .sc__stage { min-height: 380px; }
  .sc .stats { margin-top: 40px; }
  .ways { height: auto; display: flex; flex-direction: column; border-radius: 22px; }
  .way { position: relative; min-height: 320px; padding: 28px 24px; clip-path: none; }
  .way--l { order: -1; }
  .way--r { align-items: flex-start; text-align: left; }
  .way--r .way__act { flex-direction: row; }
  .way--r .way__desc { margin-left: 0; }
  .way--l .way__photo, .way--r .way__photo { left: 0; right: 0; width: 100%; }
  .way__seam { display: none; }
  .way__desc { opacity: 1; visibility: visible; transform: none; }
  .model { padding: 34px 22px; border-radius: 22px; }
  .svc__panel { padding: 24px; gap: 28px; border-radius: 22px; }
  .svc__tabs { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 6px; margin-left: calc(var(--gut) * -1); margin-right: calc(var(--gut) * -1); padding-left: var(--gut); padding-right: var(--gut); }
  .svc-tab { flex-shrink: 0; }
  .svc__img { height: 280px; }
  .rev__grid, .sgrid, .roles, .ccards, .values, .mv { grid-template-columns: minmax(0, 1fr); }
  .steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .careers__txt { padding: 34px 24px; }
  .careers__img { min-height: 240px; }
  .cta { padding: 40px 22px; gap: 34px; border-radius: 22px; }
  .form { padding: 24px 20px; }
  .fld-row { grid-template-columns: minmax(0, 1fr); }
  .feed__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .mq2 { padding-top: 50px; }
  .foot__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px 20px; }
  .foot__grid > div:last-child { grid-column: 1 / -1; }
  .fab { right: 16px; bottom: 16px; }
  .fab__txt { display: none; }
  .blob { display: none; }
  .phone { width: 260px; }
  .vid__float, .vid .spinbadge { display: none; }
  .phero { padding: 130px 0 60px; }
  .phero__media { height: 320px; }
  .phero .spinbadge { display: none; }
  .feature { padding: 34px 22px; border-radius: 22px; }
  .feature__list { grid-template-columns: minmax(0, 1fr); }
  .strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .strip .ph { height: 200px; }
  .strip .ph:nth-child(even) { margin-top: 0; }
  .mv__card { padding: 36px 26px; min-height: 0; }
  .areas { padding: 30px 22px; }
}

/* ===== SEO pages: city, service, areas, blog ===== */
@media (max-width: 1360px) { .nav__list { gap: 22px; } }
.mega--areas .mi__d { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* quick answer: an answer-first block that search engines and AI assistants can quote */
.qa { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 0.75fr); border-radius: 28px; overflow: hidden; background: #fff; border: 1px solid #ECEDF4; box-shadow: 0 18px 44px rgba(14,29,77,0.08); }
.qa__main { padding: 42px 46px; display: flex; flex-direction: column; justify-content: center; }
.qa__lbl { align-self: flex-start; display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 999px; background: var(--blush); color: var(--pink); font: 600 0.72rem/1 var(--body); letter-spacing: 0.12em; text-transform: uppercase; margin-bottom: 18px; }
.qa__lbl .i { width: 15px; height: 15px; }
.qa__q { font: 600 1.3rem/1.35 var(--display); margin-bottom: 12px; }
.qa__a { font-size: 1.06rem; line-height: 1.75; color: #2A3354; }
.qa__facts { list-style: none; margin: 0; padding: 36px; background: var(--night); color: #fff; display: flex; flex-direction: column; justify-content: center; gap: 18px; }
.qa__fact { display: flex; gap: 14px; align-items: flex-start; }
.qa__fact .ic { width: 38px; height: 38px; border-radius: 11px; background: rgba(255,255,255,0.08); color: var(--accent); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.qa__fact b { display: block; font: 600 0.68rem/1 var(--body); letter-spacing: 0.12em; text-transform: uppercase; color: rgba(255,255,255,0.58); margin: 3px 0 6px; }
.qa__fact span { display: block; font-size: 0.92rem; line-height: 1.5; }
.qa__fact a { color: var(--accent); font-weight: 600; }

/* link cards (services in a city, cities for a service) */
.lgrid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.lcard { position: relative; display: flex; align-items: center; gap: 16px; padding: 22px; border-radius: 20px; background: #fff; border: 1px solid #ECEDF4; transition: translate 0.4s var(--ease), box-shadow 0.4s ease, border-color 0.3s ease; }
.lcard:hover { translate: 0 -5px; box-shadow: 0 20px 40px rgba(14,29,77,0.1); border-color: #FFD3DC; }
.lcard__ic { width: 50px; height: 50px; border-radius: 14px; background: var(--blush); color: var(--pink); display: flex; align-items: center; justify-content: center; flex-shrink: 0; font: 600 0.9rem/1 var(--display); transition: transform 0.4s var(--ease), background 0.3s ease, color 0.3s ease; }
.lcard:nth-child(even) .lcard__ic { background: #EEEDFF; color: var(--violet); }
.lcard:hover .lcard__ic { background: var(--accent); color: #fff; transform: rotate(-8deg); }
.lcard__c { flex: 1; min-width: 0; }
.lcard__t { display: block; font: 600 1.02rem/1.3 var(--display); margin-bottom: 3px; }
.lcard__d { display: block; font-size: 0.85rem; line-height: 1.5; color: #5A617E; font-weight: 300; }
.lcard__ar { color: var(--ink); opacity: 0.35; transition: opacity 0.3s ease, transform 0.4s var(--ease); }
.lcard:hover .lcard__ar { opacity: 1; transform: translateX(4px); }
.lcard--on { border-color: var(--accent); box-shadow: 0 0 0 3px #FFE1E7; }

/* local section */
.local { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr); gap: 56px; align-items: start; }
.local .chips { margin: 26px 0 0; }
.hosp { list-style: none; margin: 20px 0 0; padding: 0; display: flex; flex-direction: column; gap: 10px; position: relative; }
.hosp li { display: flex; gap: 12px; align-items: center; padding: 14px 16px; border-radius: 14px; background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.1); font-size: 0.92rem; line-height: 1.4; }
.hosp .i { color: var(--accent); }
.areas__h { position: relative; font: 600 0.72rem/1 var(--body); letter-spacing: 0.14em; text-transform: uppercase; color: rgba(255,255,255,0.6); margin-top: 28px; }
a.areas__chip { cursor: pointer; }

/* include list (service pages) */
.incl { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.incl__item { display: flex; align-items: center; gap: 12px; padding: 18px; border-radius: 16px; background: #fff; border: 1px solid #ECEDF4; font: 500 0.92rem/1.35 var(--body); transition: transform 0.35s var(--ease), box-shadow 0.35s ease; }
.incl__item:hover { transform: translateY(-3px); box-shadow: 0 12px 24px rgba(14,29,77,0.08); }
.incl__item .ic { width: 36px; height: 36px; border-radius: 10px; background: var(--accent); color: #fff; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }

/* regions (areas hub + home) */
.regions { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 22px; }
.region { padding: 30px 26px 18px; border-radius: 24px; background: #fff; border: 1px solid #ECEDF4; display: flex; flex-direction: column; transition: translate 0.4s var(--ease), box-shadow 0.4s ease; }
.region:hover { translate: 0 -5px; box-shadow: 0 22px 44px rgba(14,29,77,0.09); }
.region__h { display: flex; align-items: center; gap: 10px; font: 600 0.74rem/1 var(--body); letter-spacing: 0.14em; text-transform: uppercase; color: var(--violet); margin-bottom: 10px; }
.region__h i { width: 9px; height: 9px; border-radius: 50%; background: var(--accent); }
.region__links { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.region__links a { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 14px 0; border-bottom: 1px solid #F0F1F6; transition: color 0.2s ease, padding 0.35s var(--ease); }
.region__links li:last-child a { border-bottom: 0; }
.region__links a:hover { color: var(--pink); padding-left: 6px; }
.region__links b { display: block; font: 600 1.05rem/1.2 var(--display); }
.region__links small { display: block; font: 300 0.8rem/1.4 var(--body); color: #5A617E; margin-top: 3px; }
.region__links .i { opacity: 0.4; }

/* blog index */
.bcats { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin-bottom: 44px; }
.bcat { padding: 12px 18px; border-radius: 999px; border: 1px solid rgba(14,29,77,0.14); background: #fff; font: 500 0.86rem/1 var(--body); color: var(--ink); cursor: pointer; transition: background 0.25s ease, color 0.25s ease, border-color 0.25s ease, transform 0.3s var(--ease); }
.bcat:hover { transform: translateY(-2px); border-color: var(--ink); }
.bcat.is-on { background: var(--ink); color: #fff; border-color: var(--ink); }
.bfeat { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr); border-radius: 30px; overflow: hidden; background: var(--night); color: #fff; margin-bottom: 44px; transition: translate 0.4s var(--ease), box-shadow 0.4s ease; }
.bfeat:hover { translate: 0 -6px; box-shadow: 0 30px 60px rgba(14,29,77,0.25); }
.bfeat__img { position: relative; min-height: 430px; overflow: hidden; }
.bfeat__img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: scale 0.9s var(--ease); }
.bfeat:hover .bfeat__img img { scale: 1.06; }
.bfeat__body { padding: 52px 48px; display: flex; flex-direction: column; justify-content: center; }
.bmeta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; font: 500 0.8rem/1.3 var(--body); color: #5A617E; }
.bfeat .bmeta { color: rgba(255,255,255,0.68); }
.btag { display: inline-block; padding: 7px 12px; border-radius: 999px; background: var(--blush); color: var(--pink); font: 600 0.68rem/1 var(--body); letter-spacing: 0.1em; text-transform: uppercase; }
.bfeat .btag { background: var(--accent); color: var(--ink); }
.bfeat__t { font: 600 clamp(1.6rem, 2.4vw, 2.3rem)/1.2 var(--display); margin: 18px 0 14px; }
.bfeat__d { font-size: 1rem; line-height: 1.7; color: rgba(255,255,255,0.78); font-weight: 300; margin-bottom: 28px; }
.bfeat__go { display: inline-flex; align-items: center; gap: 12px; font: 600 0.82rem/1 var(--body); letter-spacing: 0.08em; text-transform: uppercase; color: #fff; }
.bgrid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 26px; }
.bcard { display: flex; flex-direction: column; border-radius: 22px; background: #fff; border: 1px solid #ECEDF4; overflow: hidden; transition: translate 0.4s var(--ease), box-shadow 0.4s ease; }
.bcard:hover { translate: 0 -6px; box-shadow: 0 22px 44px rgba(14,29,77,0.1); }
.bcard__img { position: relative; height: 180px; overflow: hidden; }
.bcard__img svg { position: absolute; inset: 0; width: 100%; height: 100%; transition: scale 0.9s var(--ease); }
.bcard:hover .bcard__img svg { scale: 1.08; }
.bcard__soon { position: absolute; top: 14px; right: 14px; z-index: 1; padding: 7px 11px; border-radius: 999px; background: var(--ink); color: #fff; font: 600 0.64rem/1 var(--body); letter-spacing: 0.1em; text-transform: uppercase; }
.bcard__body { padding: 24px 24px 26px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.bcard__t { font: 600 1.12rem/1.38 var(--display); }
.bcard__d { font-size: 0.88rem; line-height: 1.6; color: #5A617E; font-weight: 300; }
.bcard__kw { margin-top: auto; padding-top: 6px; font: 500 0.74rem/1.4 var(--body); color: var(--violet); }
.bnews { margin-top: 70px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 40px; align-items: center; padding: 50px 54px; border-radius: 30px; background: linear-gradient(135deg, #FFE3E9 0%, #FFF4F6 60%, #EEEDFF 100%); }
.bnews form { display: flex; gap: 10px; }
.bnews input { flex: 1; min-width: 0; height: 54px; padding: 0 18px; border-radius: 12px; border: 1px solid rgba(14,29,77,0.16); background: #fff; font: 400 0.95rem/1 var(--body); color: var(--ink); }

/* blog post */
.post-hero { position: relative; margin-top: calc(var(--hdr) * -1); padding: 160px 0 110px; background: var(--blush); overflow: hidden; }
.post-hero__in { max-width: 920px; position: relative; z-index: 1; }
.post-hero h1 { font: 600 clamp(2rem, 3.6vw, 3.2rem)/1.15 var(--display); letter-spacing: -0.015em; margin: 18px 0 22px; color: var(--ink); }
.post-hero .lede { max-width: 740px; font-size: 1.1rem; color: #2A3354; }
.byline { display: flex; align-items: center; gap: 14px; margin-top: 30px; flex-wrap: wrap; }
.byline__av { width: 48px; height: 48px; border-radius: 50%; background: var(--accent); color: #fff; display: flex; align-items: center; justify-content: center; font: 600 1rem/1 var(--display); flex-shrink: 0; }
.byline b { display: block; font: 600 0.95rem/1.3 var(--display); }
.byline span { font-size: 0.84rem; color: #5A617E; }
.byline__sep { width: 1px; height: 34px; background: rgba(14,29,77,0.15); }
.post-cover { position: relative; z-index: 2; border-radius: 28px; overflow: hidden; height: 460px; margin-top: -70px; box-shadow: 0 30px 60px rgba(14,29,77,0.18); }
.post-cover img { width: 100%; height: 100%; object-fit: cover; }
.post { display: grid; grid-template-columns: minmax(0, 780px) 300px; justify-content: center; gap: 80px; align-items: start; }
.prose { max-width: 780px; font-size: 1.04rem; line-height: 1.8; color: #2A3354; }
.prose h2 { font: 600 1.65rem/1.3 var(--display); color: var(--ink); margin: 52px 0 16px; scroll-margin-top: 110px; }
.prose h3 { font: 600 1.18rem/1.4 var(--display); color: var(--ink); margin: 30px 0 10px; }
.prose p { margin: 0 0 18px; }
.prose ul, .prose ol { margin: 0 0 22px; padding-left: 1.3em; }
.prose li { margin-bottom: 10px; }
.prose a { color: var(--pink); font-weight: 500; text-decoration: underline; text-underline-offset: 3px; }
.prose strong { color: var(--ink); font-weight: 600; }
.keys { border-radius: 22px; padding: 30px 32px; background: var(--soft); border-left: 5px solid var(--accent); margin: 0 0 34px; }
.keys__h { font: 600 0.76rem/1 var(--body); letter-spacing: 0.14em; text-transform: uppercase; color: var(--pink); margin-bottom: 14px; }
.keys ul { margin: 0; }
.prose .qlist { counter-reset: q; list-style: none; padding: 0; }
.qlist li { counter-increment: q; position: relative; padding: 18px 20px 18px 68px; border-radius: 16px; background: #fff; border: 1px solid #ECEDF4; margin-bottom: 12px; transition: border-color 0.3s ease, box-shadow 0.3s ease; }
.qlist li:hover { border-color: #FFD3DC; box-shadow: 0 12px 26px rgba(14,29,77,0.06); }
.qlist li::before { content: counter(q, decimal-leading-zero); position: absolute; left: 18px; top: 17px; width: 34px; height: 34px; border-radius: 50%; background: var(--ink); color: var(--accent); font: 600 0.8rem/34px var(--display); text-align: center; }
.qlist b { display: block; color: var(--ink); font-family: var(--display); margin-bottom: 4px; }
.ptable { width: 100%; border-collapse: collapse; margin: 6px 0 26px; font-size: 0.94rem; line-height: 1.55; }
.ptable th, .ptable td { text-align: left; padding: 13px 14px; border-bottom: 1px solid #ECEDF4; vertical-align: top; }
.ptable th { font: 600 0.74rem/1.2 var(--body); letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); background: var(--soft); }
.post__aside { position: sticky; top: 110px; display: flex; flex-direction: column; gap: 20px; }
.toc { border-radius: 22px; padding: 26px; background: #fff; border: 1px solid #ECEDF4; }
.toc__h { font: 600 0.74rem/1 var(--body); letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted); margin-bottom: 12px; }
.toc a { display: block; padding: 10px 0; border-bottom: 1px solid #F0F1F6; font-size: 0.9rem; line-height: 1.4; transition: color 0.2s ease, padding 0.3s var(--ease); }
.toc a:last-child { border-bottom: 0; }
.toc a:hover { color: var(--pink); padding-left: 4px; }
.aside-cta { position: relative; overflow: hidden; border-radius: 22px; padding: 28px 26px; background: var(--night); color: #fff; }
.aside-cta h4 { font: 600 1.25rem/1.3 var(--display); margin-bottom: 10px; }
.aside-cta p { font-size: 0.9rem; line-height: 1.6; color: rgba(255,255,255,0.75); margin-bottom: 18px; }
.aside-cta .btn { width: 100%; margin-bottom: 10px; }
.author { display: flex; gap: 20px; align-items: flex-start; padding: 28px; border-radius: 22px; background: var(--blush); margin-top: 44px; }
.author .byline__av { width: 64px; height: 64px; font-size: 1.3rem; }
.author b { display: block; font: 600 1.05rem/1.3 var(--display); margin-bottom: 4px; color: var(--ink); }
.author p { font-size: 0.92rem; line-height: 1.65; margin: 0; }
.upd { font-size: 0.84rem; color: var(--muted); margin-top: 22px; }

@supports (animation-timeline: view()) {
  .lcard, .bcard, .region, .incl__item { animation: pop linear both; animation-timeline: view(); animation-range: entry 0% cover 24%; }
  .k1.lcard, .k1.bcard, .k1.region, .k1.incl__item { animation-range: entry 4% cover 28%; }
  .k2.lcard, .k2.bcard, .k2.region, .k2.incl__item { animation-range: entry 8% cover 32%; }
  .k3.region, .k3.incl__item { animation-range: entry 12% cover 36%; }
}
@media (prefers-reduced-motion: reduce) { .lcard, .bcard, .region, .incl__item { animation: none !important; } }

@media (max-width: 1180px) {
  .qa, .local, .bfeat, .post, .bnews { grid-template-columns: minmax(0, 1fr); }
  .regions, .lgrid, .bgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .incl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .post__aside { position: static; }
  .prose { max-width: none; }
}
@media (max-width: 768px) {
  .regions, .lgrid, .bgrid, .incl { grid-template-columns: minmax(0, 1fr); }
  .qa { border-radius: 22px; }
  .qa__main { padding: 28px 22px; }
  .qa__facts { padding: 26px 22px; }
  .qa__q { font-size: 1.12rem; }
  .qa__a { font-size: 1rem; }
  .bfeat { border-radius: 22px; }
  .bfeat__img { min-height: 230px; }
  .bfeat__body { padding: 30px 24px; }
  .bnews { padding: 30px 22px; border-radius: 22px; }
  .bnews form { flex-direction: column; }
  .post-hero { padding: 120px 0 90px; }
  .post-cover { height: 240px; border-radius: 20px; margin-top: -60px; }
  .prose { font-size: 1rem; }
  .prose h2 { font-size: 1.35rem; margin-top: 40px; }
  .qlist li { padding: 16px 16px 16px 60px; }
  .ptable { font-size: 0.86rem; }
  .ptable th, .ptable td { padding: 10px 8px; }
  .author { flex-direction: column; padding: 22px; }
  .byline__sep { display: none; }
}
.values--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 1180px) { .values--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 900px) { .values--3 { grid-template-columns: minmax(0, 1fr); } }

/* WhatsApp */
.btn--wa { background: #25D366; color: #fff; text-transform: none; letter-spacing: 0; font-size: 0.95rem; }
.btn--wa::before { background: #128C7E; }
.btn--wa:hover { color: #fff; box-shadow: 0 12px 26px rgba(37,211,102,0.35); }
.hdr__wa { display: inline-flex; align-items: center; gap: 8px; height: 46px; padding: 0 16px 0 13px; border-radius: 10px; background: #25D366; color: #fff; font: 600 0.84rem/1 var(--body); white-space: nowrap; transition: transform 0.35s var(--ease), box-shadow 0.35s ease, background 0.3s ease; }
.hdr__wa:hover { color: #fff; background: #1EBE5A; transform: translateY(-2px); box-shadow: 0 10px 22px rgba(37,211,102,0.35); }
@media (max-width: 1360px) { .hdr__wa { width: 46px; padding: 0; justify-content: center; } .hdr__wa-t { display: none; } }
.fab--wa { background: #25D366; border-color: rgba(255,255,255,0.35); box-shadow: 0 12px 30px rgba(37,211,102,0.4); }
.fab--wa:hover { background: #1EBE5A; }
.fab--wa .fab__dot { background: #fff; border-color: #25D366; }
.soc--wa .soc__d--front { background: #25D366; }
.ccards--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.ccards .ccard--wa .ccard__ic { background: #25D366; }
@media (max-width: 1180px) { .ccards--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 768px) { .ccards--4 { grid-template-columns: minmax(0, 1fr); } }
.ccards--4 .ccard__v { font-size: 1.04rem; }