/* Pentacle v5 · FAQs page. Builds on v5.css + studio.css: same type, glass, cases and buttons; only the page's own parts live here.
   Glass on this page sits on the plain page, so it carries no backdrop blur (see the scrolling note at the end of studio.css). */
.faq-page .glass{-webkit-backdrop-filter:none;backdrop-filter:none}
.faq-sec{padding-top:clamp(90px,10vw,140px)}

/* hero */
.faq-hero{padding:clamp(120px,14vw,170px) 0 0}
.faq-hero-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:clamp(30px,5vw,80px);align-items:center}
.crumbs{display:flex;gap:10px;font-size:14px;color:var(--t3);margin-bottom:26px}
.crumbs a{color:var(--t2);text-decoration:none}.crumbs a:hover{color:var(--t)}
.faq-h1{font-size:clamp(46px,6.2vw,96px);margin-top:16px;max-width:12ch}
.faq-hero .lead{max-width:50ch}
.faq-hero-art .case{display:block;aspect-ratio:1;border-radius:32px}
.faq-hero-art .case img{object-fit:contain}
.reviewed{display:flex;align-items:center;gap:10px;margin:18px 0 0;font-size:14px;color:var(--t3)}
.reviewed .dot{width:7px;height:7px;border-radius:50%;background:var(--sky);box-shadow:0 0 0 4px color-mix(in srgb,var(--sky) 22%,transparent)}

/* search */
.faq-search{display:flex;align-items:center;gap:12px;padding:0 18px;height:54px;border-radius:999px;border:1px solid var(--line-2);background:var(--glass);transition:border-color .25s,box-shadow .25s}
.faq-search.big{margin-top:34px;max-width:560px;height:62px;padding:0 22px}
.faq-search:focus-within{border-color:var(--sky);box-shadow:0 0 0 5px color-mix(in srgb,var(--sky) 16%,transparent)}
.faq-search svg{width:20px;height:20px;flex:none;fill:none;stroke:var(--t3);stroke-width:1.8;stroke-linecap:round}
.faq-search input{flex:1;min-width:0;border:0;background:transparent;color:var(--t);font:400 17px "DM Sans",system-ui,sans-serif;outline:0}
.faq-search input::placeholder{color:var(--t3)}
.faq-search kbd{font:500 12px "DM Sans";color:var(--t3);border:1px solid var(--line-2);border-radius:6px;padding:2px 7px}
.faq-search:focus-within kbd{display:none}

/* most asked: a numbered index in two columns */
.top10{list-style:none;margin:44px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;column-gap:clamp(24px,4vw,64px);border-top:1px solid var(--line)}
.top10 li{border-bottom:1px solid var(--line)}
.top10 a{display:flex;align-items:baseline;gap:20px;padding:22px 4px;text-decoration:none;color:var(--t);font-size:clamp(18px,1.5vw,21px);letter-spacing:-.015em;line-height:1.35;transition:color .3s,padding .5s var(--E)}
.top10 a i{font-style:normal;font-size:13px;letter-spacing:.12em;color:var(--sky);font-variant-numeric:tabular-nums;flex:none;width:2.4em}
.top10 a::after{content:"→";margin-left:auto;padding-left:14px;color:var(--t3);transition:transform .5s var(--E),color .3s}
.top10 a:hover{padding-left:12px}.top10 a:hover::after{transform:translateX(4px);color:var(--sky)}

/* life events */
.events{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:44px}
.ev{display:grid;grid-template-columns:96px minmax(0,1fr);grid-template-rows:auto auto;column-gap:18px;align-items:center;text-align:left;border-radius:24px;padding:14px 22px 14px 14px;cursor:pointer;color:var(--t);transition:border-color .35s,transform .5s var(--E)}
.ev .case{grid-row:1 / span 2;width:96px;height:96px;border-radius:18px}
.ev .case img{object-fit:contain}
.ev b{align-self:end;font-size:18px;font-weight:500;letter-spacing:-.015em}
.ev>span:last-child{align-self:start;font-size:14.5px;color:var(--t2);margin-top:4px}
.ev:hover{border-color:color-mix(in srgb,var(--sky) 45%,transparent);transform:translateY(-3px)}
.ev.on{border-color:var(--sky)}

/* the browse area */
.faq-body .sec-head{margin-bottom:40px}
.faq-grid{display:grid;grid-template-columns:minmax(240px,300px) minmax(0,1fr);gap:clamp(28px,4vw,64px);align-items:start}
.faq-side{position:sticky;top:110px;display:grid;gap:22px}
.faq-cats{display:flex;flex-wrap:wrap;gap:8px}
.faq-cats button{border:1px solid var(--line-2);background:transparent;border-radius:999px;padding:8px 14px;font-size:14.5px;color:var(--t2);cursor:pointer;transition:color .25s,background .25s,border-color .25s}
.faq-cats button:hover{color:var(--t);border-color:var(--t3)}
.faq-cats button.on{background:var(--t);border-color:var(--t);color:var(--bg)}
.faq-filter{margin:0;font-size:14.5px;color:var(--t2)}
.faq-filter button{border:0;background:none;color:var(--sky);cursor:pointer;padding:0;font-size:14.5px;border-bottom:1px solid currentColor}
.faq-ask{border-radius:24px;padding:24px;display:grid;gap:12px;justify-items:start}
.faq-ask .k{margin:0}.faq-ask p{margin:0;color:var(--t2);font-size:15.5px}
.faq-ask .btn .ic,.cta-band .btn .ic{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8}

.faq-list{display:grid;gap:12px}
.faq-cat{font-size:12.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--sky);font-weight:500;margin:38px 0 4px}
.faq-cat:first-child{margin-top:0}
.qa{border-radius:22px;transition:border-color .3s,background .3s}
.qa[open]{border-color:var(--line-2);background:var(--glass-2)}
.qa summary{list-style:none;display:flex;align-items:center;gap:18px;padding:22px 24px;cursor:pointer;border-radius:22px}
.qa summary::-webkit-details-marker{display:none}
.qa summary:focus-visible{outline:2px solid var(--sky);outline-offset:3px}
.qa h3{flex:1;font-size:clamp(18px,1.5vw,21px);font-weight:400;letter-spacing:-.02em;line-height:1.3}
.qa .pm{position:relative;flex:none;width:34px;height:34px;border-radius:50%;border:1px solid var(--line-2);transition:background .3s,border-color .3s,transform .5s var(--E)}
.qa .pm::before,.qa .pm::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:1.5px;margin:-.75px 0 0 -6px;background:var(--t);border-radius:2px}
.qa .pm::after{transform:rotate(90deg);transition:transform .5s var(--E)}
.qa summary:hover .pm{border-color:var(--t3)}
.qa[open] .pm{background:var(--sky);border-color:var(--sky);transform:rotate(180deg)}
.qa[open] .pm::before,.qa[open] .pm::after{background:#04121c}
.qa[open] .pm::after{transform:rotate(0deg)}
:root[data-theme="light"] .qa[open] .pm::before,:root[data-theme="light"] .qa[open] .pm::after{background:#fff}
.qa .ans{padding:0 24px 24px;color:var(--t2);max-width:70ch}
.qa .ans p{margin:0 0 12px}.qa .ans p:last-child{margin-bottom:0}
.qa .ans .btn{margin-top:4px}
.qa.hit{border-color:color-mix(in srgb,var(--sky) 60%,transparent)}
.qa.flash{animation:qa-flash 1.6s ease}
@keyframes qa-flash{0%,30%{border-color:var(--sky);box-shadow:0 0 0 4px color-mix(in srgb,var(--sky) 20%,transparent)}100%{box-shadow:0 0 0 0 transparent}}
.mf-note{margin:6px 4px 0;font-size:13.5px;color:var(--t3)}
.faq-none{color:var(--t2);padding:24px 4px}

/* rules that changed */
.changes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:44px}
.chg{border-radius:24px;padding:26px;display:grid;gap:6px;align-content:start}
.chg .k{margin-bottom:10px}
.chg s{color:var(--t3);font-size:18px;text-decoration-thickness:1.5px}
.chg b{font-weight:300;font-size:clamp(34px,3vw,46px);letter-spacing:-.035em;line-height:1.05;color:var(--t)}
.chg em{font-style:normal;font-size:13.5px;color:var(--t2);margin-top:8px}

.faq-page footer{margin-top:120px}
.faq-page .mbar{display:none}

@media (max-width:1060px){
  .events,.changes{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:900px){
  .faq-hero-grid{grid-template-columns:minmax(0,1fr)}
  .faq-hero-art{max-width:420px;width:100%}
  .top10{grid-template-columns:minmax(0,1fr)}
  .faq-grid{grid-template-columns:minmax(0,1fr)}
  .faq-side{position:sticky;top:76px;z-index:5;gap:0;margin:0 calc(-1 * var(--gut));padding:10px var(--gut);background:color-mix(in srgb,var(--bg) 92%,transparent);border-bottom:1px solid var(--line)}
  .faq-side,.faq-cats{min-width:0}
  .faq-ask{display:none}
  .faq-filter{margin-top:8px}
  .faq-cats{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-right:calc(-1 * var(--gut));padding-right:var(--gut)}
  .faq-cats::-webkit-scrollbar{display:none}
  .faq-cats button{flex:none}
}
@media (max-width:640px){
  .faq-page .mbar{display:flex}
  .events,.changes{grid-template-columns:minmax(0,1fr)}
  .ev{grid-template-columns:72px minmax(0,1fr)}.ev .case{width:72px;height:72px}
  .qa summary{padding:18px 18px;gap:14px}
  .qa .ans{padding:0 18px 20px}
  .faq-search.big{height:56px}
  .faq-search kbd{display:none}
}
@media (prefers-reduced-motion:reduce){.qa .pm,.qa .pm::after,.top10 a,.ev{transition:none}.qa.flash{animation:none}}

/* cover pages (health-insurance.html and the rest): the FAQ page's hero, cards and answers, plus a few blocks of their own */
.svc-acts{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.pts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:44px}
.pt{border-radius:24px;padding:26px 24px 28px}
.pt b{display:block;font-size:19px;font-weight:500;letter-spacing:-.015em;line-height:1.3;margin-bottom:10px}
.pt span{display:block;color:var(--t2);font-size:15.5px;line-height:1.55}
.pt i{display:block;font-style:normal;font-size:13px;letter-spacing:.08em;color:var(--sky);margin-bottom:14px}
.svc-steps .pt .case{display:block;aspect-ratio:16/10;border-radius:18px;margin-bottom:20px}
.svc-steps .pt .case img{object-fit:contain}
.svc-faq{max-width:920px;margin-top:44px}
.svc-more{margin-top:22px;color:var(--t2)}
.svc-local{border-radius:28px;padding:clamp(28px,4vw,44px);display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:center}
.svc-local h2{font-size:clamp(26px,2.6vw,36px);font-weight:300;letter-spacing:-.03em;line-height:1.15;margin:10px 0 14px}
.svc-local p{color:var(--t2)}
.rel{display:flex;flex-wrap:wrap;gap:10px}
.svc-other{margin-top:34px}
.svc-other .k{margin-bottom:14px}
@media (max-width:1060px){ .pts{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:900px){ .pts,.svc-local{grid-template-columns:minmax(0,1fr)} }