.department-hero { padding: 78px 0 82px; background: linear-gradient(145deg, #f7f3e9 0%, #fafaf8 52%, #eef3f6 100%); border-bottom: 1px solid var(--border); }
.department-hero-grid { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(300px, .75fr); gap: 58px; align-items: center; }
.department-breadcrumb { margin-bottom: 28px; color: var(--text-light); font-size: 13px; }
.department-breadcrumb a { color: var(--navy); text-decoration: none; }
.department-eyebrow { margin-bottom: 10px; color: var(--gold-text); font-size: 12px; font-weight: 700; letter-spacing: 1.7px; text-transform: uppercase; }
.department-hero h1 { max-width: 720px; margin-bottom: 20px; font-size: clamp(44px, 6vw, 68px); line-height: 1.02; }
.department-lead { max-width: 760px; margin-bottom: 15px; color: var(--navy); font-size: clamp(20px, 2.2vw, 25px); line-height: 1.5; }
.department-hero p:not(.department-breadcrumb):not(.department-eyebrow):not(.department-lead) { max-width: 720px; color: var(--text-light); line-height: 1.75; }
.department-actions { margin-top: 30px; display: flex; align-items: center; flex-wrap: wrap; gap: 22px; }
.department-secondary-link { color: var(--navy); font-weight: 700; text-decoration-color: var(--gold); text-underline-offset: 5px; }
.department-summary { padding: 28px; border: 1px solid rgba(200,169,106,.52); border-radius: 16px; background: rgba(255,255,255,.88); box-shadow: var(--shadow-card); }
.department-summary-label { margin-bottom: 8px; color: var(--gold-text); font-size: 12px; font-weight: 700; letter-spacing: 1.4px; text-transform: uppercase; }
.department-summary div { padding: 17px 0; display: grid; gap: 6px; border-bottom: 1px solid var(--border); }
.department-summary div:last-child { border-bottom: 0; }
.department-summary span { color: var(--text-light); font-size: 12px; text-transform: uppercase; letter-spacing: .7px; }
.department-summary strong { color: var(--navy); line-height: 1.45; }
.department-section { padding: 84px 0; }
.department-section-soft { background: #f6f7f6; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.department-heading { max-width: 790px; margin: 0 auto 40px; text-align: center; }
.department-heading h2, .support-grid h2, .department-appointment h2 { margin-bottom: 14px; font-size: clamp(34px, 4vw, 48px); line-height: 1.12; }
.department-heading > p:last-child, .support-grid p, .department-appointment p { color: var(--text-light); line-height: 1.75; }
.department-card-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.department-card { min-height: 225px; padding: 25px; border: 1px solid var(--border); border-radius: 14px; background: var(--surface); color: inherit; text-decoration: none; box-shadow: var(--shadow-card); transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease; }
.department-card:hover { transform: translateY(-4px); border-color: rgba(200,169,106,.75); box-shadow: 0 18px 38px rgba(15,45,70,.1); }
.department-card > span { color: var(--gold-text); font-size: 12px; font-weight: 700; letter-spacing: 1px; }
.department-card h3 { margin: 24px 0 10px; font-size: 25px; line-height: 1.12; }
.department-card p { color: var(--text-light); font-size: 14px; line-height: 1.65; }
.department-card-static { cursor: default; }
.department-card-static:hover { transform: none; border-color: var(--border); box-shadow: var(--shadow-card); }
.procedure-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
.procedure-grid a { padding: 22px 24px; display: grid; grid-template-columns: minmax(130px, .42fr) 1fr; gap: 18px; align-items: center; border: 1px solid var(--border); border-radius: 12px; background: #fff; color: inherit; text-decoration: none; }
.procedure-grid a:hover { border-color: var(--gold); }
.procedure-grid strong { color: var(--navy); font-family: "Cormorant Garamond", serif; font-size: 23px; }
.procedure-grid span { color: var(--text-light); font-size: 14px; line-height: 1.55; }
.department-pathway-item { padding: 22px 24px; display: grid; grid-template-columns: minmax(130px, .42fr) 1fr; gap: 18px; align-items: center; border: 1px solid var(--border); border-radius: 12px; background: #fff; }
.department-pathway-item strong { color: var(--navy); font-family: "Cormorant Garamond", serif; font-size: 23px; }
.department-pathway-item span { color: var(--text-light); font-size: 14px; line-height: 1.55; }
.department-doctor-grid { max-width: 950px; margin: auto; display: grid; grid-template-columns: repeat(2, 1fr); gap: 22px; }
.department-doctor-card { padding: 30px; display: grid; grid-template-columns: 82px 1fr; gap: 22px; align-items: center; border: 1px solid var(--border); border-radius: 14px; background: #fff; box-shadow: var(--shadow-card); }
.department-doctor-card-link { color: inherit; text-decoration: none; transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease; }
.department-doctor-card-link:hover { transform: translateY(-4px); border-color: rgba(200,169,106,.75); box-shadow: 0 18px 38px rgba(15,45,70,.1); }
.department-doctor-card-link:focus-visible { outline: 3px solid var(--gold); outline-offset: 4px; }
.department-doctor-mark { width: 82px; height: 82px; display: grid; place-items: center; border: 1px solid var(--gold); border-radius: 50%; color: var(--navy); font-family: "Cormorant Garamond", serif; font-size: 28px; font-weight: 700; }
.department-doctor-card h3 { margin: 3px 0 7px; font-size: 29px; }
.department-doctor-card p:not(.doctor-department) { margin-bottom: 8px; color: var(--text-light); line-height: 1.5; }
.department-doctor-card strong { color: var(--navy); font-size: 14px; }
.department-doctor-grid-single { grid-template-columns: minmax(0, 620px); justify-content: center; }
.guide-group-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.guide-group-grid-five { grid-template-columns: repeat(5, 1fr); }
.guide-group { padding: 25px; border: 1px solid var(--border); border-radius: 14px; background: #fff; }
.guide-group h3 { margin-bottom: 16px; padding-bottom: 12px; border-bottom: 1px solid var(--border); font-size: 25px; }
.guide-group a { padding: 7px 0; display: block; color: var(--navy); font-size: 14px; line-height: 1.4; text-decoration: none; }
.guide-group a::after { content: " →"; color: var(--gold-text); }
.guide-group a:hover { color: var(--gold-text); }
.guide-group-note { margin-top: 12px; color: var(--text-light); font-size: 13px; line-height: 1.6; }
.department-centered-action { margin-top: 34px; text-align: center; }
.support-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 60px; align-items: center; }
.support-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.support-list span { padding: 17px; border: 1px solid var(--border); border-radius: 10px; background: #fff; color: var(--navy); font-weight: 600; text-align: center; }
.department-appointment { padding: 76px 0; background: var(--navy); color: #fff; }
.department-appointment-grid { display: grid; grid-template-columns: 1.25fr .75fr; gap: 64px; align-items: center; }
.department-appointment h2 { color: #fff; }
.department-appointment p { color: rgba(255,255,255,.76); }
.appointment-details { padding: 27px; border: 1px solid rgba(200,169,106,.58); border-radius: 14px; }
.appointment-details .btn { margin-bottom: 20px; background: var(--gold); color: var(--navy); }
.appointment-details p { margin-bottom: 12px; }
.appointment-details a:not(.btn) { color: #fff; text-underline-offset: 4px; }
@media (max-width: 1100px) { .guide-group-grid-five { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 980px) { .department-hero-grid, .support-grid, .department-appointment-grid { grid-template-columns: 1fr; gap: 34px; } .department-card-grid { grid-template-columns: repeat(2, 1fr); } .guide-group-grid, .guide-group-grid-five { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 700px) { .department-hero { padding: 52px 0 58px; } .department-section { padding: 60px 0; } .department-card-grid, .procedure-grid, .department-doctor-grid, .guide-group-grid { grid-template-columns: 1fr; } .procedure-grid a, .department-pathway-item { grid-template-columns: 1fr; gap: 7px; } .department-doctor-card { grid-template-columns: 64px 1fr; padding: 22px; } .department-doctor-mark { width: 64px; height: 64px; font-size: 23px; } .support-list { grid-template-columns: 1fr 1fr; } }