/* Shared components used across pages — extracted from Claude Design »Jurek strona«, Kierunek A. */

/* ---------- Subpage header ---------- */
.sub{padding:96px 0 120px}
.sub .bc{font-family:"IBM Plex Mono",monospace;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-faint);margin:0 0 18px}
.sub .bc a{color:var(--accent-deep);text-decoration:none}
.sub h1{font-size:44px;max-width:20ch}
.sub .lede{font-size:19px;color:var(--ink-soft);margin:20px 0 44px;max-width:60ch}
.sub .slot{border:1px dashed var(--line-2);border-radius:14px;background:var(--bg-soft);padding:56px 44px;font-family:"IBM Plex Mono",monospace;font-size:12.5px;color:var(--ink-faint);text-align:center}
@media(max-width:640px){.sub h1{font-size:32px}}

/* ---------- Mobile drawer ---------- */
.burger{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:10px;margin-right:-10px;background:none;border:0}
.mdrawer{position:fixed;inset:0;z-index:100;visibility:hidden;overflow-x:hidden}
@media(max-width:640px){.foot-grid{grid-template-columns:1fr 1fr}.foot-grid .fb{grid-column:1/-1}}
.mdrawer.open{visibility:visible}
.mdrawer .scrim{position:absolute;inset:0;background:rgba(19,24,32,.45);opacity:0;transition:opacity .25s}
.mdrawer.open .scrim{opacity:1}
.mpanel{position:absolute;top:0;right:0;height:100%;width:100%;max-width:100%;background:#fff;transform:translateX(100%);transition:transform .28s ease;display:flex;flex-direction:column;overflow-y:auto}
.mdrawer.open .mpanel{transform:none}
.mhead{display:flex;align-items:center;justify-content:space-between;height:84px;padding:0 22px;border-bottom:1px solid var(--line);flex-shrink:0}
.mhead svg{height:24px;display:block;fill:var(--ink)}
.mclose{background:none;border:none;font-size:30px;line-height:1;color:var(--ink);cursor:pointer;padding:6px 10px}
.mlist{padding:4px 22px 0}
.mitem{border-bottom:1px solid var(--line)}
.mitem>a,.macc{display:flex;width:100%;align-items:center;justify-content:space-between;gap:14px;padding:20px 0;font-family:inherit;font-size:20px;font-weight:600;letter-spacing:-.01em;color:var(--ink);text-decoration:none;background:none;border:none;cursor:pointer;text-align:left}
.macc .pm{color:var(--accent);font-size:26px;font-weight:400;transition:transform .2s}
.mitem.open .macc .pm{transform:rotate(45deg)}
.msub{max-height:0;overflow:hidden;transition:max-height .28s ease}
.msub .inner{padding:0 0 16px}
.msub a{display:block;padding:12px 0 12px 18px;border-left:2px solid var(--line-2);color:var(--ink-soft);text-decoration:none;font-size:16.5px}
.msub a:hover{color:var(--accent-deep);border-left-color:var(--accent)}
.mcta{margin-top:auto;padding:28px 22px 40px;display:grid;gap:12px}
.mcta .btn{height:54px;font-size:16px}
.mtel{text-align:center;font-size:14px;color:var(--ink-faint);font-family:"IBM Plex Mono",monospace}
@media(max-width:1000px){.burger{display:flex}}
@media(min-width:1001px){.mdrawer{display:none}.burger{display:none}}
body.admin-bar header.nav{top:32px}
@media(max-width:782px){body.admin-bar header.nav{top:46px}}

/* ---------- Mega menu ---------- */
.mega.cols{display:grid;grid-template-columns:repeat(3,minmax(190px,1fr));gap:2px 14px;min-width:720px;padding:16px 12px}
.mega.cols .mcol{display:flex;flex-direction:column}
.mega.cols h6{font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-faint);margin:6px 12px 8px;font-weight:500}
.msub .mgl{font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-faint);margin:14px 0 2px}
nav.links .has-drop>a.drop{cursor:default}
.mega a{white-space:normal;max-width:300px}
nav.links .current>a,nav.links .has-drop.current>a{color:var(--accent-deep)}

/* ---------- Grid helpers ---------- */
.cols3{grid-template-columns:repeat(3,1fr)}
.cols2{grid-template-columns:repeat(2,1fr)}
@media(max-width:1000px){.cols3{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.cols3,.cols2{grid-template-columns:1fr}}
@media(max-width:820px){.visit-grid{grid-template-columns:1fr!important;gap:28px!important}}

/* ---------- Placeholder / unfinished content ---------- */
.pillar.todo h4,.pillar.todo p.todo{font-family:"IBM Plex Mono",monospace;color:var(--ink-faint);font-weight:500}
.pillar.todo h4{font-size:14px;letter-spacing:.02em}
.pillar.todo p.todo{font-size:12.5px}

/* ---------- Accordion groups (Fizjoterapia) ---------- */
.accwrap{max-width:940px}
.accg{margin-bottom:46px}
.accg:last-child{margin-bottom:0}
.accg>.gh{margin:0 0 6px;font-size:23px;letter-spacing:-.02em}
.accg>.gd{margin:0 0 18px;font-size:15.5px;color:var(--ink-soft);max-width:60ch}
.accl{border-top:1px solid var(--line-2)}
.accl .faqi:last-child{border-bottom:1px solid var(--line-2)}
.accl .faqq{font-size:18px;padding:19px 0}
.accl .faqa .inner{display:grid;gap:13px;padding:0 0 26px;font-size:16px}
.accl .faqa .inner p{margin:0}
.accl .go{font-family:"IBM Plex Mono",monospace;font-size:12px;letter-spacing:.04em;color:var(--accent-deep);text-decoration:none;border-bottom:1px solid var(--accent);padding-bottom:3px;justify-self:start}

/* ---------- Analiza składu ciała ---------- */
.ab-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--line-2);border:1px solid var(--line-2);border-radius:12px;overflow:hidden}
.ab-item{background:#fff;padding:26px 26px 28px}
.ab-item h4{font-size:18px;margin:0 0 8px}
.ab-item p{margin:0;font-size:15px;color:var(--ink-soft);line-height:1.55}
.ab-link{display:inline-block;margin-top:26px;font-family:"IBM Plex Mono",monospace;font-size:12px;letter-spacing:.04em;color:var(--accent-deep);text-decoration:none;border-bottom:1px solid var(--accent);padding-bottom:3px}
.ab-note{margin:28px 0 0;max-width:70ch;font-size:15px;color:var(--ink-soft);padding-top:18px;border-top:1px solid var(--line-2)}
.pillars.ab-four{grid-template-columns:repeat(4,minmax(0,1fr));margin-top:0}
@media(max-width:1000px){.ab-grid,.pillars.ab-four{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.ab-grid,.pillars.ab-four{grid-template-columns:1fr}}
.ab-split{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:56px;align-items:start}
.ab-sheet{margin:0;border-top:2px solid var(--ink)}
.ab-sheet>div{display:grid;grid-template-columns:minmax(0,190px) minmax(0,1fr);gap:24px;padding:17px 0;border-bottom:1px solid var(--line-2)}
.ab-sheet dt{font-weight:600;font-size:16.5px;color:var(--ink)}
.ab-sheet dd{margin:0;font-size:15.5px;color:var(--ink-soft);line-height:1.55}
@media(max-width:1000px){.ab-split{grid-template-columns:1fr;gap:28px}}
@media(max-width:640px){.ab-sheet>div{grid-template-columns:1fr;gap:4px}}

/* ---------- Testy na platformach ---------- */
.tq{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:48px;max-width:960px}
.tq li{display:grid;grid-template-columns:44px 1fr;gap:12px;align-items:baseline;padding:18px 0;border-top:1px solid var(--line-2)}
.tq-n{font-family:"IBM Plex Mono",monospace;font-size:12px;letter-spacing:.08em;color:var(--accent-deep)}
.tq-t{font-size:18px;font-weight:600;letter-spacing:-.01em;line-height:1.35;color:var(--ink)}
.tv-head{margin:56px 0 20px}
.tv-head h3{font-size:23px}
.tv{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.tv-c{background:#fff;border:1px solid var(--line-2);border-radius:12px;padding:24px 26px 26px}
.tv-c.hi{border-color:var(--accent);border-top:3px solid var(--accent)}
.tv-k{font-family:"IBM Plex Mono",monospace;font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--accent-deep);margin:0 0 12px}
.tv-p{margin:0 0 16px;padding-bottom:16px;border-bottom:1px solid var(--line)}
.tv-p :is(b,strong){font-size:34px;font-weight:700;letter-spacing:-.03em}
.tv-c ul{margin:0;padding-left:18px;color:var(--ink-soft);font-size:15px;line-height:1.7}
@media(max-width:1000px){.tv{grid-template-columns:1fr}}
@media(max-width:640px){.tq{grid-template-columns:1fr}}

/* ---------- Editor content (generic pages, blog posts) ---------- */
.entry{max-width:70ch;font-size:17px;color:var(--ink-soft)}
.entry>*:first-child{margin-top:0}
.entry h2,.entry h3,.entry h4{color:var(--ink);margin:1.8em 0 .6em}
.entry h2{font-size:30px}.entry h3{font-size:23px}
.entry a{color:var(--accent-deep)}
.entry img{border-radius:12px;height:auto}
.entry ul,.entry ol{line-height:1.85;padding-left:20px}
.entry blockquote{margin:1.6em 0;padding:4px 0 4px 22px;border-left:3px solid var(--accent);color:var(--ink);font-weight:500}
.sub.entry-wrap{padding-bottom:96px}

/* ---------- Forms ---------- */
.hp-field{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.ferr{display:none;font-size:15px;color:#b42318;font-weight:600}
.cform.error .ferr{display:inline}
.cform{max-width:860px}
.cform .fnote{font-size:17px;color:var(--ink-soft);margin:0 0 30px;max-width:60ch}
.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:18px 22px}
.fgrid .wide{grid-column:1/-1}
.fld{display:flex;flex-direction:column;gap:7px}
.fld label{font-family:"IBM Plex Mono",monospace;font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-faint)}
.fld input,.fld select,.fld textarea{font-family:inherit;font-size:16px;color:var(--ink);background:#fff;border:1px solid var(--line-2);border-radius:8px;padding:13px 14px;transition:border-color .15s,box-shadow .15s}
.fld textarea{min-height:118px;resize:vertical}
.fld input:focus,.fld select:focus,.fld textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-tint)}
.fconsent{display:flex;gap:11px;align-items:flex-start;font-size:14px;color:var(--ink-soft);line-height:1.5}
.fconsent input{width:18px;height:18px;margin:2px 0 0;accent-color:var(--accent);flex-shrink:0}
.fconsent a,.fbottom .alt a{color:var(--accent-deep)}
.fbottom{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:26px}
.fbottom .alt{font-size:14.5px;color:var(--ink-soft)}
.fok{display:none;font-size:15.5px;color:var(--accent-deep);font-weight:600}
.cform.sent .fok{display:flex}
@media(max-width:640px){.fgrid{grid-template-columns:1fr}
}


/* ---------- Mobile header: slides away on scroll down, back on scroll up (main.js) ---------- */
@media(max-width:1000px){
header.nav{transition:transform .25s ease}
header.nav.nav-hidden{transform:translateY(-100%)}
}
@media(prefers-reduced-motion:reduce){header.nav{transition:none}}
/* On phones the admin bar scrolls away with the page, so the header must not keep its offset. */
@media(max-width:600px){body.admin-bar header.nav{top:0}}

/* ---------- Mobile "back to top" button (main.js) ---------- */
.totop{display:none}
@media(max-width:1000px){
.totop{display:flex;align-items:center;justify-content:center;position:fixed;right:16px;bottom:calc(16px + env(safe-area-inset-bottom));z-index:90;width:44px;height:44px;border:0;border-radius:50%;background:var(--accent);color:#fff;box-shadow:0 4px 14px rgba(19,24,32,.25);cursor:pointer;opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .2s ease,transform .2s ease,visibility .2s}
.totop[hidden]{display:flex}
.totop.show{opacity:1;visibility:visible;transform:none}
.totop:active{background:var(--accent-deep)}
}
@media(prefers-reduced-motion:reduce){.totop{transition:none}}

/* Footer: five columns (brand, Studio, Oferta, W Warszawie, Kontakt) */
@media(min-width:1001px){.foot-grid{grid-template-columns:1.3fr .7fr 1.05fr 1.55fr .85fr}.foot-grid .fm-footer_3 a{white-space:nowrap}}
@media(max-width:1000px){.foot-grid{grid-template-columns:repeat(3,1fr)}.foot-grid .fb{grid-column:1/-1}}
@media(max-width:640px){.foot-grid{grid-template-columns:1fr 1fr}.foot-grid .fm-footer_1{order:1}.foot-grid .fk{order:2}.foot-grid .fm-footer_2{order:3}.foot-grid .fm-footer_3{order:4}}

/* Design update: larger dropdown chevron, wrapping mega-menu links */
nav.links .drop::after{font-size:14px;margin-left:7px}
.mega a{white-space:normal;max-width:300px}