/* Inner pages: same Rainbow Voice system as the home page (site.css). */
.lang a,.lang span{text-decoration:none;font:600 13px var(--f-body);padding:7px 11px;border-radius:999px;color:var(--muted)}
.lang a.on,.lang span.on{background:var(--ink);color:#fff}
nav.main a[aria-current="page"]::after{transform:scaleX(1)}
header{background:rgba(255,248,239,.86);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px)}

/* hero */
.phero{position:relative;overflow:hidden;background:linear-gradient(180deg,var(--cream) 0,var(--cream2) 100%)}
.phero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:4px;background:var(--rainbow);opacity:.9}
.crumbs{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:13.5px;color:var(--muted);padding-top:22px}
.crumbs a{text-decoration:none;color:var(--muted)}
.crumbs a:hover{color:var(--ink)}
.crumbs [aria-current]{color:var(--ink);font-weight:500}
.pgrid{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:32px 56px;align-items:center;padding-block:clamp(18px,3vw,40px) clamp(30px,4vw,52px)}
.ptxt h1{font-size:clamp(32px,4.4vw,56px);line-height:1.04;font-weight:700;margin-top:16px;max-width:16em}
.ptxt .lead{font-size:clamp(17px,1.4vw,19px);color:#3A4359;margin-top:18px;max-width:38em}
.ptxt .cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.byline{margin-top:16px;font-size:14px;color:var(--muted)}
.pvis{width:clamp(150px,20vw,240px);aspect-ratio:1;position:relative;display:grid;place-items:center}

.pvis .pic{position:relative;width:70%;aspect-ratio:1;display:grid;place-items:center;background:#fff;border-radius:34px 34px 34px 10px;box-shadow:0 24px 40px -24px rgba(23,32,54,.35)}
.pvis .pic svg{width:72%;height:72%}
.pvis .pbub{position:relative;width:92%;height:92%;overflow:visible}
.pvis{position:relative}

/* body: prose + credentials */
.pbody{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:clamp(28px,5vw,72px);align-items:start;padding-block:clamp(28px,4vw,52px) 0}
.prose{min-width:0;font-size:17.5px;line-height:1.7;color:#283149}
.prose>*+*{margin-top:1.05em}
.prose h2{font-size:clamp(23px,2.3vw,30px);margin-top:1.6em;line-height:1.15;color:var(--ink)}
.prose h3{font-size:clamp(18px,1.6vw,21px);margin-top:1.6em;color:var(--ink)}
.prose h2+*,.prose h3+*{margin-top:.6em}
.prose a{color:var(--ink);text-decoration-color:var(--sky);text-decoration-thickness:2px;text-underline-offset:3px}
.prose ul,.prose ol{padding-left:0;list-style:none;display:grid;gap:.55em}
.prose ul li{position:relative;padding-left:26px}
.prose ul li::before{content:"";position:absolute;left:4px;top:.62em;width:9px;height:9px;border-radius:3px 3px 3px 1px;background:var(--c,var(--sky))}
.prose ol{counter-reset:o}
.prose ol li{position:relative;padding-left:38px;counter-increment:o}
.prose ol li::before{content:counter(o);position:absolute;left:0;top:.1em;width:26px;height:26px;border-radius:9px 9px 9px 3px;background:var(--ink);color:#fff;font:700 12.5px/26px var(--f-head);text-align:center}
.note{background:var(--sun-soft);border-radius:18px 18px 18px 6px;padding:16px 18px;font-size:16px;color:#3A4359}
.answer{background:#fff;border-radius:24px 24px 24px 8px;padding:20px 22px 22px;box-shadow:0 0 0 1px var(--line);position:relative;overflow:hidden}
.answer::before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:linear-gradient(var(--coral),var(--orange),var(--sun),var(--leaf),var(--sky),var(--violet))}
.answer .k,.cred .k{font:600 12px/1 var(--f-body);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.answer p{margin-top:8px;font-size:17.5px;color:var(--ink)}
.cred{position:sticky;top:96px;background:#fff;border-radius:28px 28px 28px 8px;padding:22px;box-shadow:0 0 0 1px var(--line),0 30px 50px -36px rgba(23,32,54,.35);display:grid;gap:16px}
.cred .ch{display:flex;gap:14px;align-items:center}
.cred .clogo{width:56px;height:56px;flex-shrink:0}
.cred .nm{display:block;font:900 21px/1.1 var(--f-word);text-decoration:none;margin-top:6px}
.cred .rl{display:block;font-size:13.5px;color:var(--muted);margin-top:3px}
.cred ul{list-style:none;margin:0;padding:14px 0 0;border-top:1px solid var(--line);display:grid;gap:9px;font-size:14.5px;line-height:1.4}
.cred li{position:relative;padding-left:22px}
.cred li::before{content:"";position:absolute;left:2px;top:4px;width:12px;height:12px;border-radius:50%;background:var(--leaf);box-shadow:inset 0 0 0 3px #fff,0 0 0 1.5px var(--leaf)}
.cred .btn{width:100%;padding:14px 18px;font-size:15.5px}
.cred .regl{font-size:13.5px;font-weight:600;text-decoration:none;color:var(--ink);border-bottom:2px solid var(--sky);justify-self:start;padding-bottom:1px}

/* FAQ */
.faq{margin-top:2em}
.faq h2{margin-bottom:.7em}
.faq details{background:#fff;border-radius:20px 20px 20px 6px;box-shadow:0 0 0 1px var(--line);margin-top:10px;transition:box-shadow .25s}
.faq details[open]{box-shadow:0 0 0 1.5px var(--ink)}
.faq summary{list-style:none;cursor:pointer;padding:17px 56px 17px 20px;font:600 17px/1.35 var(--f-body);color:var(--ink);position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary i{position:absolute;right:18px;top:50%;width:26px;height:26px;margin-top:-13px;border-radius:50%;background:var(--cream)}
.faq summary i::before,.faq summary i::after{content:"";position:absolute;left:7px;right:7px;top:12px;height:2px;border-radius:2px;background:var(--ink);transition:transform .3s var(--ease)}
.faq summary i::after{transform:rotate(90deg)}
.faq details[open] summary i::after{transform:rotate(0)}
.faq .fa{padding:0 20px 18px;font-size:16.5px;color:#3A4359}
.faq .fa>*+*{margin-top:.7em}

/* related + hub grids */
.rel{padding-top:clamp(40px,5vw,72px)}
.rel h2{font-size:clamp(24px,2.6vw,34px);margin-bottom:28px}
.rel .svc{grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr))}
.hubgrid{grid-template-columns:repeat(2,minmax(0,1fr))!important;margin-top:2em}

/* CTA band */
.band{padding-top:clamp(40px,6vw,80px)}
.bandin{background:var(--ink);color:#fff;border-radius:40px 40px 40px 12px;padding:clamp(26px,4vw,48px);display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px 36px;align-items:center;position:relative;overflow:hidden}
.bandin::after{content:"";position:absolute;left:0;right:0;top:0;height:5px;background:var(--rainbow)}
.bandin h2{color:#fff;font-size:clamp(24px,2.6vw,34px)}
.bandin p{color:#C9D0E0;margin-top:10px;max-width:34em}
.bandin::before{content:"";position:absolute;left:0;right:0;bottom:0;height:5px;background:var(--rainbow);z-index:1}
.bcta{display:grid;gap:10px}
.bcta .btn.ghost{background:transparent;color:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.35)}
body.inner footer{margin-top:clamp(80px,9vw,120px)}

@media (max-width:1080px){
  .pbody{grid-template-columns:1fr}
  .cred{position:static;max-width:560px}
  .bandin{grid-template-columns:minmax(0,1fr) auto}
}
@media (max-width:760px){
  .pgrid{grid-template-columns:minmax(0,1fr);gap:8px}
  .pvis{display:none}
  .bandin{grid-template-columns:1fr}
  .bcta .btn{width:100%}
  .hubgrid{grid-template-columns:1fr!important}
}
@media (max-width:640px){
  .prose{font-size:16.5px}
  .ptxt .cta .btn{width:100%}
  .faq summary{font-size:16px;padding:15px 52px 15px 16px}
  .faq .fa{padding:0 16px 16px}
  .crumbs{font-size:12.5px;padding-top:16px}
}
/* cards inside prose (hub pages): don't inherit article spacing */
.prose .svc{gap:18px}
.prose .card h3{margin-top:6px;font-size:clamp(16px,1.3vw,18px);line-height:1.3}
.prose .card p{margin-top:0;font-size:15px;line-height:1.5}
.prose .card{text-decoration:none}

/* ---------- pastel card pages (Irina's designs, 2026-10-10): About, How I Can Help, Contact, Fees, service pages ---------- */
.cards-page .cwrap{padding-block:clamp(28px,4vw,56px) 0;display:grid;gap:clamp(22px,3vw,34px)}
.cintro{max-width:760px;font-size:clamp(17px,1.4vw,19px);line-height:1.65;color:#3A4359}
.cintro>*+*{margin-top:.8em}
.cintro a,.ccard a:not(.btn),.cnote a{color:var(--ink);text-decoration-color:var(--sky);text-decoration-thickness:2px;text-underline-offset:3px}
.cgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:start}
.ccard{background:var(--cs);border-radius:28px;padding:clamp(20px,2.4vw,28px);display:grid;gap:14px;align-content:start;position:relative;overflow:hidden;transition:opacity .8s var(--ease),transform .45s var(--ease),box-shadow .45s var(--ease)}
.ccard.wide{grid-column:1/-1}
.ccard:hover{transform:translateY(-3px);box-shadow:0 22px 40px -30px rgba(23,32,54,.4)}
.chead{display:flex;align-items:center;gap:14px}
.cic{width:60px;height:60px;border-radius:50%;background:#fff;display:grid;place-items:center;flex-shrink:0;box-shadow:0 8px 18px -12px rgba(23,32,54,.35);transition:transform .5s var(--ease)}

.chead h2{font-size:clamp(20px,1.9vw,25px);line-height:1.15;color:var(--ink);margin:0}
.cbody{font-size:16px;line-height:1.6;color:#2E3650;display:grid;gap:.75em;min-width:0}
.cbody>*{margin:0}
.cbody ul{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.cbody ul li{position:relative;padding-left:30px}
.cbody ul li::before{content:"";position:absolute;left:0;top:.18em;width:20px;height:20px;border-radius:50%;background:var(--c)}
.cbody ul li::after{content:"";position:absolute;left:7px;top:calc(.18em + 5px);width:5px;height:9px;border:solid #fff;border-width:0 2.2px 2.2px 0;transform:rotate(45deg)}
.cbody ol{padding-left:0;list-style:none;counter-reset:o;display:grid;gap:8px}
.cbody ol li{position:relative;padding-left:36px;counter-increment:o}
.cbody ol li::before{content:counter(o);position:absolute;left:0;top:0;width:26px;height:26px;border-radius:9px 9px 9px 3px;background:var(--c);color:#fff;font:700 12.5px/26px var(--f-head);text-align:center}
.cbody h3{font-size:17px;margin-top:.4em}
.cbody .note{background:#fff;border-radius:16px;padding:12px 14px;font-size:15px}
.cbig{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.cbig b{font:700 clamp(44px,5vw,64px)/1 var(--f-head);color:var(--c);letter-spacing:-.02em}
.cbig span{font-weight:600;color:var(--ink)}
.cst{background:#fff;border-radius:20px;padding:14px 16px}
.cst b{font:700 42px/1 var(--f-head);color:color-mix(in srgb,var(--c) 72%,var(--ink))}
.cst .u{font-weight:700;margin-left:6px;color:var(--ink)}
.cst p{margin-top:6px;font-size:14.5px;line-height:1.45;color:#3A4359}
.ccard .ccall{justify-self:start;background:var(--coral);color:var(--ink);box-shadow:0 12px 26px -12px rgba(255,90,95,.8)}
.ccard .ccall svg{width:18px;height:18px}
.pform .fgrid{gap:12px}
.pform input,.pform select,.pform textarea{background:#fff}
.pform .cerr{background:var(--coral-soft);border-radius:14px;padding:12px 14px;font-size:14.5px}
.pform .cok{background:var(--leaf-soft);border-radius:14px;padding:14px;font-weight:600}
.cgroup{display:grid;gap:16px}
.cgroup>h2{font-size:clamp(26px,2.8vw,36px);text-align:center}
.cnote{max-width:720px;margin-inline:auto;text-align:center;color:#3A4359}
.areas{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
@media (max-width:1100px){.areas{grid-template-columns:repeat(2,minmax(0,1fr))}}
.area{background:var(--cs);border-radius:28px;padding:24px 20px 20px;display:grid;justify-items:center;text-align:center;gap:10px;text-decoration:none;color:var(--ink);transition:opacity .8s var(--ease),transform .45s var(--ease),box-shadow .45s var(--ease)}
.area:hover{transform:translateY(-6px);box-shadow:0 26px 44px -30px rgba(23,32,54,.45)}
.aic{width:112px;height:112px;border-radius:50%;background:#fff;display:grid;place-items:center;box-shadow:0 10px 20px -14px rgba(23,32,54,.4);transition:transform .55s var(--ease)}

.area h3{font-size:clamp(17px,1.4vw,19px);line-height:1.2}
.area p{font-size:14.5px;line-height:1.5;color:#3A4359}
.area .pill{margin-top:4px;display:inline-flex;background:var(--cs);color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--c);font-weight:600;font-size:13.5px;padding:7px 14px;border-radius:999px;transition:transform .3s var(--ease)}
.area:hover .pill{transform:translateX(3px)}
.cfaq .faq{margin-top:0}
.cards-page .rel{padding-top:clamp(28px,4vw,48px)}
.bcta .btn svg{width:18px;height:18px}
@media (max-width:900px){.areas{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:760px){.cgrid{grid-template-columns:1fr}.areas{grid-template-columns:1fr}.area{grid-template-columns:64px minmax(0,1fr);justify-items:start;text-align:left;column-gap:14px;padding:16px}.area .aic{width:80px;height:80px;grid-row:span 3}.area .aic svg{width:64px;height:64px}.area h3,.area p,.area .pill{grid-column:2}.chead h2{font-size:20px}.cic{width:52px;height:52px}.cic svg{width:36px;height:36px}}
@media (prefers-reduced-motion:reduce){.ccard,.area,.cic,.aic{transition:none}}
.pform .hp{position:absolute!important;left:-9999px;width:1px;height:1px;opacity:0}

/* ---------- 2026-10-13 meeting: cozier cards ---------- */
.chead h2,.area h3,.cgroup>h2{font-family:var(--f-word);font-weight:900;letter-spacing:0}
.chead h2{font-size:clamp(21px,2vw,26px)}
.cgroup>h2{font-size:clamp(28px,3vw,40px)}
.ptxt h1 .hl{font-style:normal;color:var(--coral)}
.ccard.lead .chead h2{font-size:clamp(25px,2.6vw,32px)}
.cgrid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;align-items:stretch}
.ccard.small{padding:18px 18px 20px}
.ccard.small .chead h2{font-size:19px}
.ccard.small .cic{width:48px;height:48px}.ccard.small .cic svg{width:32px;height:32px}
.ccard.small .cbody{font-size:15px}
.cflex{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:start}
.cart{width:104px;opacity:.95;transition:transform .6s var(--ease)}

.ili{display:grid;grid-template-columns:42px minmax(0,1fr);gap:10px;align-items:center;padding-left:0!important}
.cbody ul li.ili::before,.cbody ul li.ili::after{display:none}
.lic{width:42px;height:42px;border-radius:14px;background:#fff;display:grid;place-items:center;box-shadow:0 6px 14px -10px rgba(23,32,54,.35)}
.lic svg{width:28px;height:28px}
.cmore{background:#fff;border-radius:16px;margin-top:4px}
.cmore summary{list-style:none;cursor:pointer;padding:11px 14px;font-weight:700;font-size:15px;display:flex;align-items:center;gap:8px;color:var(--ink)}
.cmore summary::-webkit-details-marker{display:none}
.cmore summary::after{content:"";width:9px;height:9px;border:solid var(--c);border-width:0 2.5px 2.5px 0;transform:rotate(45deg) translateY(-2px);margin-left:auto;transition:transform .3s var(--ease)}
.cmore[open] summary::after{transform:rotate(225deg) translateY(-2px)}
.cmorein{padding:0 14px 14px;display:grid;gap:.6em;font-size:15px}
.ctime{display:grid;grid-template-columns:1fr 1fr;gap:12px;position:relative}
.ctime::before{content:"";position:absolute;left:25%;right:25%;top:40px;height:3px;border-radius:3px;background:linear-gradient(90deg,var(--coral),var(--orange),var(--sun),var(--leaf),var(--sky),var(--violet));transform-origin:left;transform:scaleX(0);transition:transform 1.2s var(--ease) .2s}
.ccard.in .ctime::before{transform:scaleX(1)}
.ctime .cst{background:#fff;border-radius:20px;padding:14px;display:grid;justify-items:center;text-align:center;gap:6px;position:relative;z-index:1}
.ctime .city svg{width:64px;height:64px}
.ctime .cst b{font:900 42px/1 var(--f-word);color:color-mix(in srgb,var(--c) 72%,var(--ink))}
@media (max-width:900px){.cgrid3{grid-template-columns:1fr 1fr}}
@media (max-width:760px){.cgrid3{grid-template-columns:1fr}.cart{width:72px}.ctime::before{display:none}}
@media (prefers-reduced-motion:reduce){.ctime::before{transform:none;transition:none}}
/* Icon life: pop in on reveal, gentle float, playful hover. CSS only. */
@keyframes icPop{0%{transform:scale(.6) rotate(-12deg);opacity:0}60%{transform:scale(1.12) rotate(4deg);opacity:1}100%{transform:none;opacity:1}}
@keyframes icFloat{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-5px) rotate(-2deg)}}
@keyframes icWiggle{0%,100%{transform:rotate(0)}25%{transform:rotate(-8deg) scale(1.08)}75%{transform:rotate(8deg) scale(1.08)}}
.ccard .cic svg,.area .aic svg,.lic svg,.cart svg,.cst svg{transform-origin:50% 60%}
.ccard.in .cic svg{animation:icPop .7s cubic-bezier(.2,1.4,.4,1) both}
.area.in .aic svg{animation:icPop .7s cubic-bezier(.2,1.4,.4,1) both}
.ccard.in .ili .lic svg{animation:icPop .6s cubic-bezier(.2,1.4,.4,1) both}
.ccard.in .ili:nth-child(2) .lic svg{animation-delay:.08s}.ccard.in .ili:nth-child(3) .lic svg{animation-delay:.16s}.ccard.in .ili:nth-child(4) .lic svg{animation-delay:.24s}.ccard.in .ili:nth-child(5) .lic svg{animation-delay:.32s}.ccard.in .ili:nth-child(6) .lic svg{animation-delay:.4s}
.ccard.in .cart svg{animation:icPop .8s cubic-bezier(.2,1.4,.4,1) .15s both,icFloat 5s ease-in-out 1s 4}
.ccard.in .cst svg{animation:icPop .7s cubic-bezier(.2,1.4,.4,1) .2s both}
.area.in:hover .aic svg,.ccard.in:hover .cic svg,.ccard.in .ili:hover .lic svg{animation:icPop .7s cubic-bezier(.2,1.4,.4,1) both,icWiggle .7s ease-in-out}
@media (prefers-reduced-motion:reduce){.ccard .cic svg,.area .aic svg,.lic svg,.cart svg,.cst svg{animation:none!important}}

.area .aic svg{width:92px;height:92px}
@media (max-width:760px){.area .aic svg{width:64px;height:64px}}

/* ---- Fluent 3D icons (img.fi) ---- */
.fi{display:block;width:100%;height:100%;object-fit:contain;user-select:none;-webkit-user-drag:none}
picture{display:contents}
.aic{background:transparent;box-shadow:none}
.area .aic{width:112px;height:112px}
.area .aic .fi{width:100px;height:100px;filter:drop-shadow(0 10px 12px rgba(23,32,54,.18))}
.cic .fi{width:40px;height:40px}
.ccard.small .cic .fi{width:32px;height:32px}
.lic .fi{width:30px;height:30px}
.cart .fi{width:104px;height:104px;filter:drop-shadow(0 12px 14px rgba(23,32,54,.16))}
.cst .city .fi{width:64px;height:64px}
.card .ic .fi{width:40px;height:40px}
/* small cards: same rhythm in all three boxes */
.ccard.small{display:flex;flex-direction:column}
.ccard.small .cbody{display:flex;flex-direction:column;gap:10px;flex:1}
.ccard.small .cbody ul{margin:0}
.ccard.small .cbody p:last-child{margin-top:auto;margin-bottom:0;font-size:14px;color:var(--muted)}
/* motion: pop on reveal, gentle float, playful hover */
@keyframes fiFloat{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-6px) rotate(-3deg)}}
@keyframes fiHover{0%,100%{transform:rotate(0) scale(1)}30%{transform:rotate(-10deg) scale(1.12)}60%{transform:rotate(8deg) scale(1.1)}}
.ccard .cic .fi,.area .aic .fi,.lic .fi,.cart .fi,.cst .fi,.card .ic .fi{transform-origin:50% 70%}
.ccard.in .cic .fi,.area.in .aic .fi,.ccard.in .cst .fi{animation:icPop .7s cubic-bezier(.2,1.4,.4,1) both,fiFloat 4.5s ease-in-out .9s 6}
.ccard.in .ili .lic .fi{animation:icPop .6s cubic-bezier(.2,1.4,.4,1) both}
.ccard.in .ili:nth-child(2) .lic .fi{animation-delay:.08s}.ccard.in .ili:nth-child(3) .lic .fi{animation-delay:.16s}.ccard.in .ili:nth-child(4) .lic .fi{animation-delay:.24s}.ccard.in .ili:nth-child(5) .lic .fi{animation-delay:.32s}
.ccard.in .cart .fi{animation:icPop .8s cubic-bezier(.2,1.4,.4,1) .15s both,fiFloat 5s ease-in-out 1s 6}
.area.in:hover .aic .fi,.ccard.in:hover .cic .fi,.ccard.in .ili:hover .lic .fi,.card:hover .ic .fi{animation:icPop .01s both,fiHover .8s ease-in-out}
@media (prefers-reduced-motion:reduce){.fi{animation:none!important}}
@media (max-width:760px){.area .aic{width:80px;height:80px}.area .aic .fi{width:72px;height:72px}.cart .fi{width:72px;height:72px}}

@media (min-width:761px){.area{align-content:start;grid-template-rows:auto auto 1fr auto}.area .pill{align-self:end}}

@media (max-width:760px){.area{grid-template-columns:80px minmax(0,1fr)}}
lord-icon.li{display:block;flex-shrink:0}
.area .aic lord-icon.li{width:100px!important;height:100px!important}
.cic lord-icon.li{width:42px!important;height:42px!important}
.ccard.small .cic lord-icon.li{width:34px!important;height:34px!important}
.lic lord-icon.li{width:32px!important;height:32px!important}
.cart lord-icon.li{width:110px!important;height:110px!important}
.cst .city lord-icon.li{width:68px!important;height:68px!important}
@media (max-width:760px){.area .aic lord-icon.li{width:72px!important;height:72px!important}.cart lord-icon.li{width:76px!important;height:76px!important}}
/* 2026-10-16: cards in a grid always match in size (Oleg) */
.cstack{display:grid;gap:18px}
.cgrid{align-items:stretch}
@media (min-width:761px){.cgrid,.cgrid3,.areas{grid-auto-rows:1fr}.cgrid.odd{grid-auto-rows:auto}.cgrid.odd>.ccard:last-child{grid-column:1/-1}}
/* questions hub: a simple list of titles */
.qindex{list-style:none;margin:clamp(24px,3vw,40px) 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 18px}
.qindex a{display:flex;align-items:center;justify-content:space-between;gap:14px;height:100%;padding:15px 18px;background:#fff;border-radius:18px 18px 18px 6px;box-shadow:0 0 0 1px var(--line);color:var(--ink);text-decoration:none;font:600 16.5px/1.35 var(--f-body);transition:box-shadow .25s,transform .25s var(--ease)}
.qindex a:hover{box-shadow:0 0 0 1.5px var(--ink);transform:translateY(-2px)}
.qindex i{font-style:normal;color:var(--btn,#1570CF);font-weight:700;flex-shrink:0}
@media (max-width:760px){.qindex{grid-template-columns:1fr}}
/* 2026-10-16 balanced cards: same height in a grid; the one much longer card folds with a fade + "show all" (Oleg) */
@media (min-width:761px){
  .cgrid .ccard{display:flex;flex-direction:column}
  .cgrid .ccard>.cbody{flex:1;display:flex;flex-direction:column;gap:.75em}
  .cgrid .ccard>.cbody>.cmore:last-child,.cgrid .ccard>.cbody>.cflex:last-child .cmore:last-child{margin-top:auto}
  .cgrid.measuring{grid-auto-rows:auto!important;align-items:start!important}
  .cgrid.measuring>.ccard{height:auto!important}
  .ccard.fold>.cbody{position:relative;overflow:hidden;flex:0 0 auto;transition:max-height .6s var(--ease)}
  .ccard.fold>.cbody::after{content:"";position:absolute;left:0;right:0;bottom:0;height:90px;background:linear-gradient(to bottom,transparent,var(--cs));pointer-events:none;transition:opacity .4s}
  .ccard.fold.open>.cbody::after{opacity:0}
  .cfold{align-self:flex-start;margin-top:auto;display:inline-flex;align-items:center;gap:8px;border:0;cursor:pointer;background:#fff;color:var(--ink);font:700 15px/1 var(--f-body);padding:11px 16px;border-radius:999px;box-shadow:0 6px 16px -10px rgba(23,32,54,.45)}
  .cfold::after{content:"";width:8px;height:8px;border:solid var(--c);border-width:0 2.5px 2.5px 0;transform:rotate(45deg) translateY(-2px);transition:transform .3s var(--ease)}
  .ccard.open .cfold::after{transform:rotate(225deg) translateY(-2px)}
  .cfold:focus-visible{outline:3px solid #0F6FCC;outline-offset:3px}
}
@media (max-width:760px){.cfold{display:none}}
/* related cards: one row on desktop (no lonely card), 2x2 for four on tablets */
@media (min-width:761px){.rel .svc{grid-template-columns:repeat(2,minmax(0,1fr))}.rel .svc[data-n="3"]{grid-template-columns:repeat(3,minmax(0,1fr))}.rel .svc[data-n="1"]{grid-template-columns:minmax(0,1fr)}}
@media (min-width:1000px){.rel .svc[data-n="4"]{grid-template-columns:repeat(4,minmax(0,1fr))}}
.rel .svc{grid-auto-rows:1fr}
@media (max-width:760px){.rel .svc{grid-auto-rows:auto}}
.prose .qindex li{padding-left:0;margin:0}
.prose .qindex li::before,.prose .qindex li::after{display:none}
/* flags on the experience counters: gentle wave */
.cst .city .fi[data-ic^="flag"]{width:72px;height:48px;object-fit:cover;border-radius:6px;box-shadow:0 8px 16px -10px rgba(23,32,54,.5),0 0 0 1px rgba(23,32,54,.08);transform-origin:0 50%}
@keyframes flagWave{0%,100%{transform:perspective(200px) rotateY(0) skewY(0)}35%{transform:perspective(200px) rotateY(-14deg) skewY(-2deg)}70%{transform:perspective(200px) rotateY(8deg) skewY(1.5deg)}}
.ccard.in .cst .city .fi[data-ic^="flag"]{animation:icPop .7s cubic-bezier(.2,1.4,.4,1) .2s both,flagWave 3.2s ease-in-out 1s 6}
@media (prefers-reduced-motion:reduce){.cst .city .fi[data-ic^="flag"]{animation:none!important}}
.ctime .cst{align-content:start}
@media (max-width:380px){.ctime{grid-template-columns:1fr}}
h2[id],h3[id],h4[id]{scroll-margin-top:96px}
/* experience timeline (7 years / 19 years): equal columns that content can't widen, and when the card itself is
   narrow (2-column grid on a tablet) the two boxes stack instead of overflowing the card (2026-10-21) */
.ctime{grid-template-columns:repeat(2,minmax(0,1fr))}
.ctime .cst p{overflow-wrap:break-word;hyphens:auto}
.ccard{container-type:inline-size}
@container (max-width:380px){.ctime{grid-template-columns:minmax(0,1fr)}}
/* narrow card (2-column grid on a tablet): the side illustration steps aside so the text gets the full width */
@container (max-width:280px){.cflex{grid-template-columns:minmax(0,1fr)}.cflex>.cart{display:none}}
/* page titles and card titles hyphenate instead of sliding under the logo / breaking mid-word (full-site visual review, 2026-10-22) */
.ptxt h1{overflow-wrap:break-word;hyphens:auto}

/* ---- full-site visual review fixes (2026-10-22) ---- */
@media (max-width:1100px){.bandin{grid-template-columns:minmax(0,1fr)}.bandin .cta{justify-content:flex-start}}
h1,h2,h3{hyphenate-limit-chars:15 6 6}
.ptxt h1{hyphenate-limit-chars:15 6 6}
@media (max-width:640px){.crumbs>:nth-last-child(-n+2){display:none}.qbuddy{width:56px;top:-30px}}
@media (min-width:761px) and (max-width:999px){.rel .svc[data-n="3"]{grid-template-columns:minmax(0,1fr)}}
code{font:600 .92em ui-monospace,SFMono-Regular,Menlo,monospace;background:rgba(23,32,54,.07);border-radius:6px;padding:1px 5px;white-space:nowrap}
/* contact/forms inside a narrow card (tablet): fields stack so both inputs have a readable width and line up */
@container (max-width:400px){.pform .fgrid{grid-template-columns:minmax(0,1fr)}}
/* a lone last card in a 2-column grid (e.g. «Как добраться» on Contacts) takes the full row instead of leaving an empty half */
@media (min-width:761px){.cgrid>.ccard:last-child:nth-child(odd){grid-column:1/-1}}

/* footer: less air above it on inner pages too (this rule used to win over the compact footer, 2026-10-22) */
body.inner footer{margin-top:clamp(36px,4.5vw,56px)}
/* meeting 2026-10-28: short text in the hero under the name, highlighted; card titles stronger */
.ptxt .hans{margin-top:18px;background:#fff;border-radius:22px 22px 22px 8px;padding:16px 20px 16px 24px;box-shadow:0 0 0 1px var(--line),0 10px 28px -18px rgba(20,30,60,.35);position:relative;overflow:hidden;max-width:40em}
.ptxt .hans::before{content:"";position:absolute;left:0;top:0;bottom:0;width:6px;background:linear-gradient(var(--coral),var(--orange),var(--sun),var(--leaf),var(--sky),var(--violet))}
.ptxt .hans p{font-size:clamp(17px,1.35vw,19px);line-height:1.5;color:var(--ink);font-weight:500}
.ptxt .hans p+p{margin-top:8px}
.ptxt .hans p:first-child{font-weight:600}
.ptxt .hans+.cta{margin-top:22px}
.chead h2{color:color-mix(in srgb,var(--c) 55%,var(--ink))}
/* meeting 2026-10-28: no stretched cards with empty space (Irina saw big gaps on desktop) */
@media (min-width:761px){
  .cgrid,.cgrid3{align-items:start;grid-auto-rows:auto}
  .cgrid .ccard>.cbody{flex:0 0 auto}
  .cgrid .ccard>.cbody>.cmore:last-child,.cgrid .ccard>.cbody>.cflex:last-child .cmore:last-child{margin-top:0}
  .cfold{margin-top:14px}
}