/* ── Appointment Page — appt- prefix ──────────────────────── */

.appt-hero{position:relative;overflow:hidden;padding:clamp(100px,12vw,148px) 0 clamp(48px,6vw,72px);background:linear-gradient(145deg,var(--bg) 0%,var(--bg-alt) 100%)}
.appt-hero::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 60% 70% at 80% 20%,rgba(22,146,76,.10),transparent 65%);pointer-events:none}
.appt-hero__inner{position:relative;z-index:2;max-width:var(--maxw);margin:0 auto;padding:0 clamp(20px,4vw,48px)}
.appt-hero__eyebrow{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-head);font-weight:600;font-size:.82rem;letter-spacing:.06em;text-transform:uppercase;color:var(--primary);margin-bottom:1rem}
.appt-hero__eyebrow-dot{width:7px;height:7px;border-radius:50%;background:var(--accent);display:inline-block}
.appt-hero__title{font-size:clamp(2rem,4.5vw,3.2rem);font-weight:800;letter-spacing:-.03em;line-height:1.1;color:var(--ink);margin-bottom:.8rem}
.appt-hero__lead{font-size:clamp(.98rem,1.5vw,1.12rem);color:var(--muted);line-height:1.75;max-width:56ch}

/* ── Main layout ─── */
.appt-main{padding:clamp(48px,7vw,88px) 0 clamp(64px,9vw,112px)}
.appt-wrap{max-width:var(--maxw);margin:0 auto;padding:0 clamp(20px,4vw,48px)}
.appt-grid{display:grid;grid-template-columns:1fr 520px;gap:clamp(40px,6vw,80px);align-items:start}

/* ── Left info column ─── */
.appt-info__lead{font-size:1rem;color:var(--muted);line-height:1.8;margin-bottom:2rem}
.appt-info__items{display:flex;flex-direction:column;gap:16px;margin-bottom:2rem}
.appt-info__item{display:grid;grid-template-columns:42px 1fr;gap:12px;align-items:start}
.appt-info__icon{width:42px;height:42px;border-radius:var(--r-md);background:rgba(31,158,87,.12);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.appt-info__icon i{width:20px;height:20px;color:var(--primary)}
.appt-info__item h4{font-size:.92rem;font-weight:700;color:var(--ink);margin-bottom:.25rem}
.appt-info__item p{font-size:.88rem;color:var(--muted);line-height:1.6}
.appt-info__item a{color:var(--secondary);text-decoration:none;font-weight:600}
.appt-info__item a:hover{color:var(--primary)}
.appt-info__alts{border-top:1px solid var(--line-strong);padding-top:1.6rem;margin-top:.4rem}
.appt-info__alts h4{font-size:.88rem;font-weight:700;color:var(--ink);margin-bottom:1rem}
.appt-alt-btns{display:flex;flex-direction:column;gap:10px}
.appt-alt-btn{display:flex;align-items:center;gap:10px;padding:13px 16px;border-radius:var(--r-md);text-decoration:none;font-family:var(--font-head);font-weight:600;font-size:.92rem;transition:background .2s,box-shadow .2s;border:1.5px solid transparent}
.appt-alt-btn--call{background:rgba(11,106,60,.08);border-color:rgba(11,106,60,.18);color:var(--primary)}
.appt-alt-btn--call:hover{background:rgba(11,106,60,.14)}
.appt-alt-btn--wa{background:rgba(37,211,102,.08);border-color:rgba(37,211,102,.18);color:#1da851}
.appt-alt-btn--wa:hover{background:rgba(37,211,102,.15)}
.appt-alt-btn i,.appt-alt-btn svg{width:18px;height:18px;flex-shrink:0}
.appt-alt-btn span{flex:1}
.appt-trust{margin-top:2rem;padding:16px 18px;border-radius:var(--r-md);background:rgba(31,158,87,.07);border:1px solid rgba(31,158,87,.18);display:flex;align-items:center;gap:12px}
.appt-trust i{width:20px;height:20px;color:var(--secondary);flex-shrink:0}
.appt-trust p{font-size:.84rem;color:var(--muted);line-height:1.5;margin:0}

/* ── Form card ─── */
.appt-form-card{background:var(--card);border:1px solid var(--line-strong);border-radius:var(--r-xl);padding:clamp(28px,3.5vw,40px);box-shadow:var(--shadow-md)}
.appt-form-card h2{font-size:1.3rem;font-weight:700;color:var(--ink);margin-bottom:.4rem}
.appt-form-card > p{font-size:.9rem;color:var(--muted);margin-bottom:1.6rem;line-height:1.6}
.appt-form{display:flex;flex-direction:column;gap:14px}
.appt-field{display:flex;flex-direction:column;gap:6px}
.appt-field label{font-family:var(--font-head);font-weight:600;font-size:.82rem;color:var(--ink)}
.appt-field input,.appt-field select,.appt-field textarea{width:100%;padding:.82em 1em;border-radius:var(--r-sm);background:var(--bg);border:1.5px solid var(--line-strong);transition:border-color .25s,box-shadow .25s,background .25s;outline:none;color:var(--ink);font-family:var(--font-body);font-size:.95rem}
.appt-field input::placeholder,.appt-field textarea::placeholder{color:#9fb1bb}
.appt-field input:focus,.appt-field select:focus,.appt-field textarea:focus{border-color:var(--secondary);box-shadow:0 0 0 4px rgba(22,146,76,.12);background:#fff}
.appt-field textarea{resize:vertical;min-height:84px}
.appt-field-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.appt-select-wrap{position:relative;display:block}
.appt-select-wrap select{appearance:none;-webkit-appearance:none;cursor:pointer;padding-right:2.6em;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%239fb1bb' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 13px center;background-size:16px 16px}
.appt-select-wrap i,.appt-select-wrap svg{display:none}
.appt-field-error{font-size:.76rem;color:#c0383c;min-height:1.1em;display:block;margin-top:2px;opacity:0;transform:translateY(-4px);transition:opacity .2s,transform .2s}
.appt-field-error.is-visible{opacity:1;transform:translateY(0)}
.appt-form__submit{margin-top:4px}
.appt-form__privacy{display:flex;align-items:center;gap:7px;font-size:.79rem;color:var(--muted);margin-top:.5rem}
.appt-form__privacy i{width:14px;height:14px;color:var(--secondary);flex-shrink:0}
.appt-form__success{display:none;align-items:center;gap:10px;color:var(--primary);font-weight:600;font-size:.95rem;background:rgba(31,158,87,.1);padding:.9em 1.1em;border-radius:var(--r-sm);margin-top:.5rem}
.appt-form__success.is-visible{display:flex}
.appt-form__success i{width:20px;height:20px}
.appt-form__error{color:#c62828;background:rgba(198,40,40,.08)}

/* ── Hours strip ─── */
.appt-hours{background:var(--bg-alt);padding:clamp(40px,5vw,64px) 0;border-top:1px solid var(--line)}
.appt-hours__inner{max-width:var(--maxw);margin:0 auto;padding:0 clamp(20px,4vw,48px);display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line-strong);border:1px solid var(--line-strong);border-radius:var(--r-lg);overflow:hidden}
.appt-hours__slot{background:var(--card);padding:clamp(20px,2.5vw,28px);text-align:center}
.appt-hours__slot-days{font-family:var(--font-head);font-weight:700;font-size:.92rem;color:var(--ink);margin-bottom:.35rem}
.appt-hours__slot-time{font-size:.88rem;color:var(--muted);line-height:1.55}
.appt-hours__slot-badge{display:inline-flex;align-items:center;gap:5px;margin-top:.5rem;padding:.28em .7em;border-radius:100px;font-size:.76rem;font-weight:600}
.appt-hours__slot-badge--open{background:rgba(39,192,113,.1);color:#1a9e58}
.appt-hours__slot-badge--closed{background:rgba(102,122,136,.1);color:var(--muted)}

/* ── Surgical info section ─── */
.appt-surgery-info{padding:clamp(64px,9vw,112px) 0}
.appt-surgery-card{display:grid;grid-template-columns:52px 1fr;gap:24px;align-items:start;padding:clamp(28px,4vw,40px);border-radius:var(--r-lg);background:rgba(31,158,87,.08);border:1px solid rgba(31,158,87,.15)}
.appt-surgery-card__icon{width:52px;height:52px;border-radius:var(--r-md);background:rgba(11,106,60,.1);display:flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--primary);font-size:1.5rem}
.appt-surgery-card h3{font-size:1.28rem;font-weight:700;margin-bottom:1rem;color:var(--ink)}
.appt-surgery-card p{font-size:.95rem;color:var(--text);line-height:1.75;margin-bottom:1rem}
.appt-surgery-card p:last-of-type{margin-bottom:0}
.appt-surgery-steps{list-style:decimal;margin-left:1.5rem;margin-bottom:1rem;padding:0;color:var(--text);font-size:.95rem}
.appt-surgery-steps li{line-height:1.8;margin-bottom:.5rem}
.appt-surgery-note{font-size:.88rem;color:var(--muted);font-style:italic;margin-top:1rem}

/* ── Responsive ─── */
@media (max-width:1080px){
  .appt-grid{grid-template-columns:1fr}
  .appt-grid .appt-form-card{max-width:600px}
}
@media (max-width:600px){
  .appt-field-row{grid-template-columns:1fr}
  .appt-hours__inner{grid-template-columns:1fr}
}