.button-row { display: flex; gap: .75rem; flex-wrap: wrap; margin-block-start: 1.5rem; }
.info .button-row { align-items: flex-start; justify-content: flex-start; }
.intro { margin-block-end: 2rem; }
.focus-card { display: flex; min-height: 14rem; align-items: center; flex-direction: column; justify-content: center; padding: 2rem 1.5rem; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; text-align: center; }
.focus-icon { display: grid; place-items: center; width: 3rem; height: 3rem; margin-block-end: .6rem; color: var(--primary); }
.focus-icon svg { width: 2.4rem; height: 2.4rem; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.focus-card h2 { color: var(--primary); font-size: 1.25rem; }
.focus-dots { margin-block: .25rem .4rem; color: #394b48; font-size: 1.3rem; letter-spacing: .35rem; line-height: 1; }
.focus-card p { max-width: 20rem; color: var(--muted); font-size: 1rem; line-height: 1.7; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; min-height: 2.75rem; padding: .65rem 1.7rem; border: 1px solid var(--line); border-radius: 999px; background: #fff; color: var(--ink); cursor: pointer; font-weight: 700; text-decoration: none; transition: transform .2s ease, background .2s ease, color .2s ease, border-color .2s ease; }
.btn:hover { transform: translateY(-2px); border-color: var(--accent); color: var(--primary); }
.btn-primary { border-color: var(--primary); background: var(--primary); color: #fff; }
.btn-primary:hover { background: var(--primary-dark); border-color: var(--primary-dark); color: #fff; }
.btn-wa { border-color: var(--success); background: var(--success); color: #fff; }
.btn-wa:hover { border-color: #1ebe5b; background: #1ebe5b; color: #fff; }
.section-title { margin-block-end: 1.5rem; font-size: 1.5rem; }
.section-title::after { width: 3rem; height: .2rem; }
.cta { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; flex-wrap: wrap; margin-block-start: 3rem; padding: clamp(1.5rem, 4vw, 2.5rem); border-radius: var(--radius); background: linear-gradient(135deg, var(--primary), var(--secondary)); color: #fff; }
.cta h2, .cta h3 { font-size: 1.5rem; }
.cta p { max-width: 35rem; margin-block-start: .5rem; opacity: .92; }
.cta .btn { background: #fff; color: var(--primary); }
.cta .btn-wa { background: var(--success); color: #fff; }
.timeline-item { position: relative; padding-block-end: 2rem; }
.timeline-item::before { position: absolute; inset-block-start: 2.4rem; inset-inline-end: 2.25rem; width: 1px; height: calc(100% - 2.4rem); background: var(--line); content: ''; }
.timeline-item:last-child::before { display: none; }
.timeline-year { display: inline-block; padding: .2rem .8rem; border: 1px solid var(--line); border-radius: 999px; color: var(--muted); font-size: .75rem; }
.timeline-org { margin-inline-start: .5rem; color: #8d9aa2; font-size: .75rem; }
.timeline-item h3 { margin-block-start: .8rem; font-size: 1rem; }
.education-section { margin-block-end: 3rem; }
.education-list { display: grid; gap: .85rem; padding-inline-start: 1.4rem; color: var(--ink); font-size: 1rem; line-height: 1.9; }
.certification { display: flex; align-items: center; gap: 1rem; margin-block-end: .85rem; padding: .85rem 1.25rem; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; box-shadow: var(--shadow-sm); }
.certification-icon { display: grid; flex: 0 0 3.5rem; place-items: center; height: 3.5rem; border-radius: .65rem; background: var(--soft); color: var(--primary); }
.service-card, .disease-card { overflow: hidden; margin-block-end: 1.75rem; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; box-shadow: var(--shadow-sm); }
.service-card { display: grid; grid-template-columns: minmax(15rem, 29rem) 1fr; }
.service-card.is-reversed img { order: 2; }
.service-card img { width: 100%; height: 100%; min-height: 20rem; object-fit: cover; }
.service-body { padding: clamp(1.5rem, 4vw, 2.25rem); }
.badge { display: inline-block; margin-block-end: .9rem; padding: .45rem .9rem; border-radius: .35rem; background: var(--soft); color: var(--primary); font-size: .8rem; font-weight: 800; }
.service-body h2, .disease-card h2 { margin-block-end: .65rem; font-size: 1.3rem; }
.service-body p, .disease-card p, .disease-card ul { color: var(--muted); font-size: .95rem; line-height: 2; }
.service-body ul, .disease-card ul { padding-inline-start: 1.25rem; margin-block: .5rem 1rem; }
.service-link { color: var(--primary); font-size: .85rem; font-weight: 800; text-decoration: none; }
.chips { display: flex; gap: .6rem; flex-wrap: wrap; }
.chips span { padding: .4rem 1rem; border: 1px solid var(--line); border-radius: 999px; color: var(--muted); font-size: .8rem; }
.disease-card { display: flex; gap: 1.5rem; padding: 1.5rem; }
.disease-card img { width: 14.5rem; height: 10.6rem; flex: 0 0 14.5rem; border-radius: var(--radius); object-fit: cover; }
.disease-card .meta { margin-block-end: .4rem; color: #8d9aa2; font-size: .75rem; }
.disease-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; }
.disease-grid .disease-card { display: flex; min-width: 0; flex-direction: column; gap: 0; margin-block-end: 0; padding: 0; }
.disease-grid .disease-card img { width: 100%; height: 12rem; flex: none; border-radius: 0; object-fit: cover; }
.disease-grid .disease-card > div { display: flex; min-width: 0; flex: 1; flex-direction: column; padding: 1.25rem; }
.disease-grid .disease-card .badge { align-self: flex-start; margin-block-end: .6rem; }
.disease-grid .disease-card .meta, .disease-grid .disease-card ul { display: none; }
.disease-grid .disease-card h2 { display: -webkit-box; overflow: hidden; min-height: 3.6rem; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.disease-grid .disease-card p { display: -webkit-box; overflow: hidden; margin-block-end: 1rem; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.disease-grid .disease-card .highlight { display: none; }
.disease-grid .disease-card .service-link { margin-block-start: auto; }
.disease-grid > .cta { grid-column: 1 / -1; }
.highlight { display: block; margin-block-start: .5rem; color: var(--ink); font-size: .85rem; }
.field { margin-block-end: 1rem; }
.field label { display: block; margin-block-end: .4rem; color: var(--muted); font-size: .85rem; }
.required { color: var(--primary); }
.field input, .field select, .field textarea { width: 100%; padding: .7rem .85rem; border: 1px solid var(--line); border-radius: .5rem; background: #fff; color: var(--ink); }
.field textarea { min-height: 9rem; resize: vertical; }
.field input:focus, .field select:focus, .field textarea:focus { outline: 2px solid rgba(101, 8, 45, .2); border-color: var(--primary); }
.form-status { min-height: 1.7rem; margin-block-start: .75rem; font-size: .85rem; }
.form-status.success { color: #19743d; }
.form-status.error { color: #a22626; }
.info h2 { margin-block-end: 1rem; padding-block-end: .75rem; border-block-end: 1px solid var(--line); font-size: 1.2rem; }
.info h2:not(:first-child) { margin-block-start: 2rem; }
.info .row, .info .info-line { margin-block-end: .5rem; color: var(--muted); font-size: .9rem; }
.info .has-icon { display: flex; align-items: flex-start; gap: .6rem; }
.info .has-icon svg { flex: none; width: 1.1rem; height: 1.1rem; margin-block-start: .15rem; color: var(--muted); opacity: .75; }
.info a { color: var(--primary); font-weight: 700; text-decoration: none; }
.info a.btn-wa { color: #fff; }
.whatsapp-float { position: fixed; inset-block-end: 1.5rem; inset-inline-start: 1.5rem; z-index: 10; display: grid; width: 3.6rem; height: 3.6rem; place-items: center; border-radius: 50%; background: var(--success); box-shadow: 0 10px 26px rgba(37, 211, 102, .4); color: #fff; }
.whatsapp-float svg { width: 1.8rem; height: 1.8rem; fill: currentColor; }
.info .info-content { margin-block-end: .5rem; color: var(--muted); font-size: .9rem; }
.info .info-content p { margin-block-end: .5rem; }
.field-check label { display: flex; align-items: center; gap: .5rem; margin-block-end: 0; cursor: pointer; }
.field-check input[type="checkbox"] { width: auto; flex: none; padding: 0; accent-color: var(--primary); }
.hair-extensions img { max-width: 100%; height: auto; }
.info .info-content h2 { color: var(--ink); }
