/* Oko na Dziecko 4.12 - corrections based on 03.11 brief.
 * Design tokens remain #A1DFE1, #005550, #BCEBE9, #222222.
 */
:root{--oko-412-green:#005550;--oko-412-sky:#A1DFE1;--oko-412-aqua:#BCEBE9;--oko-412-black:#222222;--oko-412-yellow:#ffe28b}

/* Single telephone CTA, no dropdown when only one number is available. */
.phone-picker.phone-picker-single{display:inline-flex;position:relative;overflow:visible;max-width:100%}
.phone-picker-single .btn{display:inline-flex;align-items:center;justify-content:space-between;gap:18px;white-space:normal;line-height:1.3}
.phone-picker-single .btn span{flex:0 0 auto;font-family:Arial,sans-serif}
.steps-actions .phone-picker-single .btn{min-height:50px}
.hero .phone-picker-single .btn{min-height:50px}
.help-line-action .phone-picker-single{width:auto;max-width:100%}
.help-line-action .phone-picker-single .btn{width:100%}

/* One consistent photo window across the homepage, team archive and profile page.
   Per-specialist focal position and scale can be edited in WP-Admin. */
.team-section .person-card .person-photo,
.archive-grid .person-card .person-photo{width:100%;aspect-ratio:4/4.45;border-radius:23px;position:relative;overflow:hidden;background:var(--oko-412-aqua)}
.team-section .person-card .person-photo img,
.archive-grid .person-card .person-photo img,
.profile-grid .profile-photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:var(--oko-photo-x,50%) var(--oko-photo-y,20%);transform:scale(var(--oko-photo-scale,1));transform-origin:center center;transition:transform .25s ease}
.team-section .person-card:hover .person-photo img,
.archive-grid .person-card:hover .person-photo img{transform:scale(calc(var(--oko-photo-scale,1) + .018))}
.team-section .person-card .person-photo,.archive-grid .person-card .person-photo{isolation:isolate}
.team-section .person-card .person-photo:focus-visible,.archive-grid .person-card .person-photo:focus-visible{outline:3px solid var(--oko-412-green);outline-offset:3px}
.profile-grid .profile-photo{overflow:hidden}
/* Keep graphic overlays restrained and consistent; no second artificial portrait frame. */
.team-section .person-card .person-photo:after,.archive-grid .person-card .person-photo:after{pointer-events:none}
.person-actions a span{font-family:Arial,sans-serif;white-space:nowrap}

/* Service selection help: one neutral icon instead of cropped, overlapping portraits. */
.oko45-help .help-line-person:has(.oko-help-icon){justify-content:center;align-self:center}
.oko-help-icon{display:grid;place-items:center;width:74px;height:74px;flex:0 0 auto;border-radius:22px 25px 17px 27px;background:var(--oko-412-yellow);color:var(--oko-412-green);transform:rotate(-5deg)}
.oko-help-icon svg{display:block;width:35px;height:35px;transform:rotate(5deg)}
.oko45-help .help-line-person:has(.oko-help-icon){padding:6px}

/* Diagnosis overview on the homepage: compact, factual and not another giant card wall. */
.diagnosis-overview{background:#f8fbfa;padding:clamp(44px,5vw,78px) 0}
.diagnosis-overview-heading{max-width:800px;margin-bottom:27px}
.diagnosis-overview-heading h2{font-size:clamp(2rem,3.5vw,3.05rem);line-height:1.1;letter-spacing:-.04em;margin:10px 0 9px;color:var(--oko-412-black)}
.diagnosis-overview-heading p{color:#60766e;line-height:1.65;max-width:680px;margin:0}
.diagnosis-overview-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.diagnosis-overview-card{min-width:0;border:1px solid #d6e4e1;background:#fff;border-radius:23px;padding:clamp(23px,3vw,35px)}
.diagnosis-overview-card h3{font-size:clamp(1.28rem,1.9vw,1.6rem);color:var(--oko-412-green);margin:0 0 21px}
.diagnosis-overview-card ol{list-style:none;margin:0 0 24px;padding:0;counter-reset:diagsteps;display:grid;gap:13px}
.diagnosis-overview-card li{counter-increment:diagsteps;display:flex;gap:15px;align-items:baseline;color:#425e55;line-height:1.5;font-size:.91rem}
.diagnosis-overview-card li:before{content:counter(diagsteps,decimal-leading-zero);font-weight:700;font-size:.76rem;color:var(--oko-412-green);background:#dff2ef;border-radius:12px;padding:6px 9px;flex:0 0 auto}
.diagnosis-overview-card .text-link{font-size:.88rem;color:var(--oko-412-green)}
/* Separate complete steps appear on each relevant diagnosis page. */
.oko-service-process{border:1px solid #dbe8e4;border-radius:26px;background:#f8fbfa;padding:clamp(22px,3vw,34px);margin:25px 0 34px}
.oko-service-process h2{margin:8px 0 20px;font-size:clamp(1.55rem,2.5vw,2.2rem)}
.oko-process-list{list-style:none;padding:0!important;margin:0!important;display:grid;gap:0}
.oko-process-list li{list-style:none;display:grid;grid-template-columns:42px minmax(0,1fr);gap:14px;align-items:center;border-top:1px solid #dbe8e4;padding:13px 0;font-size:.95rem;color:#355b50;line-height:1.5}
.oko-process-num{width:38px;height:38px;border-radius:13px;background:#dff2ef;display:grid;place-items:center;color:var(--oko-412-green);font-size:.78rem;font-weight:750}
.oko-service-process .oko-process-note{font-size:.85rem;color:#61736c;line-height:1.6;margin:12px 0 0}

/* Contact form - calm, lean; two fields side by side only when readable. */
.oko-contact-form-wrap{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:clamp(22px,5vw,90px);align-items:start;margin-top:74px;margin-bottom:60px;padding-top:60px;border-top:1px solid #dce9e4}
.oko-contact-form-intro h2{font-size:clamp(2.1rem,3vw,2.9rem);margin:8px 0 15px;letter-spacing:-.04em}
.oko-contact-form-intro p{max-width:40ch;line-height:1.7;color:#60746c}
.oko-contact-form{display:grid;gap:15px}
.oko-form-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}
.oko-contact-form label{display:grid;gap:8px;font-size:.86rem;font-weight:600;color:var(--oko-412-green);min-width:0}
.oko-contact-form input:not([type=checkbox]),.oko-contact-form textarea{width:100%;min-width:0;min-height:48px;border:1px solid #cadcd6;background:#f9fbfa;border-radius:12px;padding:12px 14px;font:inherit;color:var(--oko-412-black)}
.oko-contact-form textarea{min-height:133px;resize:vertical}
.oko-contact-form input:focus-visible,.oko-contact-form textarea:focus-visible{outline:2px solid var(--oko-412-green);outline-offset:2px}
.oko-contact-form .oko-form-privacy{display:flex;align-items:flex-start;gap:9px;font-weight:400;color:#48675c;line-height:1.6}
.oko-form-privacy input{flex:0 0 auto;margin-top:6px;accent-color:var(--oko-412-green)}
.oko-form-privacy a{text-decoration:underline;text-underline-offset:3px;color:var(--oko-412-green)}
.oko-contact-form .btn{justify-self:start;min-height:48px;padding:12px 24px}
.oko-honey{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.oko-form-status{padding:13px 16px;border-radius:11px;line-height:1.5;margin:0 0 18px}
.oko-form-status.success{background:#e5f3ec;color:#205339}
.oko-form-status.error{background:#fff2dd;color:#814b10}
.contact-facts{grid-template-columns:repeat(2,minmax(0,1fr))}
.contact-facts>.contact-fact:first-child{grid-column:1/-1;min-height:95px}

/* Yellow from approved logo selectively strengthens emphasis, not the entire palette. */
.diagnosis-overview-card:hover{border-color:var(--oko-412-sky);box-shadow:0 8px 25px rgba(0,85,80,.045)}
.oko-help-icon{box-shadow:inset 0 0 0 1px rgba(0,85,80,.07)}

@media(max-width:850px){
 .diagnosis-overview-grid{grid-template-columns:1fr;gap:15px}
 .oko-contact-form-wrap{grid-template-columns:1fr;gap:18px;margin-top:50px;padding-top:40px}
 .oko-contact-form-intro p{max-width:65ch}
}
@media(max-width:580px){
 .diagnosis-overview{padding:45px 0}
 .diagnosis-overview-card{padding:22px;border-radius:19px}
 .diagnosis-overview-card ol{gap:10px}
 .diagnosis-overview-heading{margin-bottom:20px}
 .team-section .person-card .person-photo,.archive-grid .person-card .person-photo{aspect-ratio:4/4.45}
 .oko45-help .help-line-person:has(.oko-help-icon){margin:0;justify-self:start}
 .oko-help-icon{width:62px;height:62px}
 .oko-help-icon svg{width:27px;height:27px}
 .oko-form-row{grid-template-columns:1fr;gap:13px}
 .oko-contact-form-wrap{margin-top:34px;margin-bottom:46px;padding-top:30px}
 .oko-contact-form .btn{width:100%;justify-content:space-between}
 .contact-facts{grid-template-columns:1fr}
 .contact-facts>.contact-fact:first-child{grid-column:auto}
}
@media(prefers-reduced-motion:reduce){.team-section .person-card .person-photo img,.archive-grid .person-card .person-photo img{transition:none!important}}
/* Labels with required markers must stay on one line; inputs start below. */
.oko-contact-form label:not(.oko-form-privacy){display:block}
.oko-contact-form label:not(.oko-form-privacy) input,
.oko-contact-form label:not(.oko-form-privacy) textarea{display:block;margin-top:9px}
