/*
Theme Name: Kamisato Clinic
Theme URI: https://kamisato-c.com/
Author: Kamisato Clinic Web Team
Description: 上里こどもクリニック専用のオリジナルWordPressテーマです。
Version: 1.0.27
Requires at least: 6.5
Requires PHP: 8.1
Text Domain: kamisato-clinic
*/
/* ============ tokens ============ */
:root{
  --ivory:#FFF6EF;
  --ivory-2:#F8F0EA;
  --paper:#FFFFFF;
  --ink:#33403B;
  --ink-2:#3F4C46;
  --muted:#5F5B54;
  --line:#E7DDE7;

  --leaf:#73AD9F;        /* primary — 予約 */
  --leaf-deep:#538E80;
  --leaf-soft:#E6F1EE;
  --sky:#A98EBA;         /* information */
  --sky-soft:#E7DDEE;
  --blossom:#E18F86;     /* attention */
  --blossom-soft:#F8E3E0;
  --sun:#CDB8D8;
  --sun-soft:#F3EDF5;
  --sage:#E8EFEA;

  --shadow:0 1px 2px rgba(80,66,46,.05), 0 10px 30px -14px rgba(80,66,46,.22);
  --shadow-lift:0 2px 4px rgba(80,66,46,.06), 0 22px 44px -20px rgba(80,66,46,.32);
  --r-s:14px; --r-m:22px; --r-l:34px; --r-xl:48px;
  --container:1120px;
  --display:"Noto Sans JP","Hiragino Sans","Yu Gothic",system-ui,sans-serif;
  --body:"Noto Sans JP","Hiragino Sans","Yu Gothic",system-ui,sans-serif;
  --latin:"Jost","Noto Sans JP",system-ui,sans-serif;
}

/* ============ base ============ */
*{box-sizing:border-box}
body{
  margin:0; background:var(--ivory); color:var(--ink);
  font-family:var(--body); font-size:19px; font-weight:500; line-height:1.9;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{font-family:var(--display); font-weight:700; line-height:1.45; margin:0; text-wrap:balance; letter-spacing:.02em}
p{margin:0}
a{color:inherit; text-decoration:none}
ul{margin:0; padding:0; list-style:none}
:focus-visible{outline:3px solid var(--leaf); outline-offset:3px; border-radius:6px}
.wrap{max-width:var(--container); margin:0 auto; padding:0 28px}
.eyebrow{
  font-family:var(--latin); font-size:12px; font-weight:600;
  letter-spacing:.24em; text-transform:uppercase; color:var(--sky);
}
.note{font-size:15.5px; color:var(--blossom); font-weight:600}
.sec{padding:104px 0; position:relative; overflow:hidden}
.sec-head{display:flex; flex-direction:column; gap:14px}
.sec-head h2{font-size:clamp(30px,4vw,42px); letter-spacing:.06em}
.lede{color:var(--ink-2); font-size:18px; line-height:2}
@media (prefers-reduced-motion:reduce){*{animation:none!important; transition:none!important}}

/* ============ header ============ */
.topbar{
  background:var(--sage); color:var(--ink);
  font-size:13px; letter-spacing:.04em;
}
.topbar .wrap{display:flex; justify-content:space-between; gap:16px; padding-top:7px; padding-bottom:7px}
.topbar a{color:var(--ink-2)}
.topbar a:hover{color:var(--ink)}

header.site{
  position:sticky; top:0; z-index:40;
  background:color-mix(in srgb, var(--ivory) 92%, transparent);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
header.site .wrap{display:flex; align-items:center; gap:24px; padding-top:14px; padding-bottom:14px}
.brand{display:flex; align-items:center; gap:12px}
.brand-stack{display:flex; flex-direction:column; align-items:center; gap:3px}
.brand-stack>small{font-size:10.5px; font-weight:600; letter-spacing:.1em; color:var(--ink-2); line-height:1.2; padding-left:0}
.brand-logo{display:block; width:auto; height:auto; object-fit:contain}
.brand-logo-header{width:88px; max-height:94px}
.brand-logo-footer{width:min(100%,180px)}
.brand-name{font-family:var(--display); font-weight:700; font-size:20px; letter-spacing:.08em; line-height:1.35; white-space:nowrap; color:var(--ink)}
.brand-en{font-family:var(--latin); font-size:9.5px; letter-spacing:.2em; color:var(--blossom); font-weight:500}
nav.main{margin-left:auto; display:flex; gap:30px; font-size:15px; font-weight:500}
nav.main a{position:relative; padding:4px 0}
nav.main a::after{
  content:""; position:absolute; left:0; right:0; bottom:-2px; height:2px;
  background:var(--leaf); border-radius:2px; transform:scaleX(0); transform-origin:left;
  transition:transform .25s ease;
}
nav.main a:hover::after{transform:scaleX(1)}
.line-cta{
  display:flex; flex-direction:column; align-items:flex-start; gap:1px;
  background:var(--leaf); color:#fff; padding:9px 44px 9px 20px; border-radius:999px;
  position:relative; box-shadow:var(--shadow); transition:transform .2s ease, box-shadow .2s ease;
}
.line-cta:hover{transform:translateY(-2px); box-shadow:var(--shadow-lift)}
.line-cta.web-cta{background:#8F72A1}
.line-cta.web-cta:hover{background:#806290}
.line-cta small{font-size:11.5px; opacity:.9; letter-spacing:.06em; line-height:1.4}
.line-cta strong{font-family:var(--display); font-size:16px; letter-spacing:.1em}
.line-cta::after{content:"→"; position:absolute; right:18px; top:50%; transform:translateY(-50%); font-size:14px}
@media (max-width:900px){nav.main{display:none} header.site .wrap{gap:12px} .line-cta{margin-left:auto}}
@media (max-width:520px){header.site .wrap{gap:8px}.brand{gap:7px}.brand-logo-header{width:62px;max-height:66px}.brand-stack>small{font-size:7px;padding-left:0;letter-spacing:.05em}.brand-name{font-size:14px;letter-spacing:.03em}.line-cta{padding:9px 32px 9px 13px}.line-cta small{display:none}.line-cta strong{font-size:12px}}

/* ============ notice ============ */
.notice{background:linear-gradient(100deg,var(--leaf-soft) 0%, var(--leaf-soft) 62%, var(--ivory) 100%)}
.notice .wrap{display:flex; align-items:center; gap:34px; padding-top:26px; padding-bottom:26px; flex-wrap:wrap}
.notice-date{font-family:var(--latin); color:var(--leaf-deep); line-height:1; text-align:center; flex:none}
.notice-date span{display:block; font-size:12px; letter-spacing:.18em}
.notice-date b{font-size:36px; font-weight:600; letter-spacing:.02em}
.notice-date b em{font-style:normal; font-size:13px; letter-spacing:.14em; margin-left:4px}
.notice-body{flex:1; min-width:260px; border-left:1px solid color-mix(in srgb,var(--leaf) 35%, transparent); padding-left:34px}
.notice-body h3{font-size:clamp(19px,2.2vw,25px); color:var(--ink); letter-spacing:.05em}
.notice-body .eyebrow{color:var(--leaf-deep); margin-bottom:6px; display:block}
.notice-body p{font-size:15.5px; color:var(--ink-2); margin-top:4px}
.notice-btn{
  display:flex; align-items:center; gap:14px; background:var(--leaf); color:#fff;
  border-radius:var(--r-m); padding:16px 26px; box-shadow:var(--shadow);
  transition:transform .2s ease, box-shadow .2s ease;
}
.notice-btn:hover{transform:translateY(-2px); box-shadow:var(--shadow-lift)}
.notice-btn .ring{
  width:46px; height:46px; border-radius:50%; border:1.5px solid rgba(255,255,255,.7);
  display:grid; place-items:center; font-family:var(--latin); font-size:12px; letter-spacing:.06em; flex:none;
}
.notice-btn b{font-family:var(--display); font-size:17px; letter-spacing:.1em; display:block}
.notice-btn small{font-size:10.5px; opacity:.85}

.renewal{background:var(--sun-soft); border-top:1px solid color-mix(in srgb,var(--sun) 50%, transparent)}
.renewal .wrap{display:flex; align-items:center; gap:18px; padding-top:14px; padding-bottom:14px; flex-wrap:wrap}
.tag{
  font-size:11.5px; font-weight:700; letter-spacing:.1em; padding:5px 16px; border-radius:999px;
  background:var(--sky); color:#fff; flex:none;
}
.renewal p{font-size:16px; font-weight:500; flex:1; min-width:220px}
.renewal a{font-size:14.5px; color:var(--ink-2); white-space:nowrap}
.renewal a:hover{color:var(--leaf-deep)}

/* ============ hero ============ */
.hero{position:relative; padding:0; background:linear-gradient(135deg,var(--ivory) 0%,var(--sky-soft) 155%)}
.hero-inner{display:grid; grid-template-columns:1fr 1.05fr; align-items:stretch; min-height:540px}
.hero-copy{padding:88px 28px 96px; max-width:calc(var(--container)/2 + 28px); margin-left:auto; width:100%}
.hero-copy .eyebrow{color:var(--blossom); display:block; margin-bottom:26px}
.hero h1{
  font-size:clamp(30px,4.3vw,46px); line-height:1.55; letter-spacing:.07em;
  color:var(--sky); font-weight:700;
}
.hero h1 span{color:var(--leaf-deep)}
.hero-copy p{margin-top:30px; color:var(--ink-2); font-size:17.5px; line-height:2.1}
.hero-photo{
  position:relative; overflow:hidden; margin:24px 24px 24px 0; border-radius:28px;
  background:linear-gradient(160deg,var(--sky-soft),var(--ivory-2) 60%,var(--blossom-soft));
  box-shadow:var(--shadow);
}
.hero-main-photo{
  position:absolute; inset:0; display:block; width:100%; height:100%;
  object-fit:cover; object-position:58% 52%;
}
.opening{
  position:absolute; right:26px; bottom:26px; display:flex; align-items:center; gap:14px;
  background:var(--sun-soft); border:1px solid color-mix(in srgb,var(--sun) 60%, transparent);
  border-radius:var(--r-s); padding:9px 18px;
}
.opening span{font-family:var(--latin); font-size:10.5px; letter-spacing:.2em; color:var(--muted)}
.opening b{font-family:var(--latin); font-size:19px; font-weight:600; letter-spacing:.04em; color:var(--ink)}
.opening i{font-style:normal; font-size:13px; color:var(--ink-2); border-left:1px solid var(--line); padding-left:14px}
@media (max-width:900px){
  .hero-inner{grid-template-columns:1fr}
  .hero-copy{padding:64px 28px 48px; max-width:none; margin:0 auto; max-width:var(--container)}
  .hero-photo{min-height:340px; margin:0 18px 24px; border-radius:22px}
  .hero-main-photo{object-position:72% 52%}
}

/* ============ booking schedule ============ */
.booking-schedule{padding:76px 0 68px; background:var(--ivory); position:relative; overflow:hidden}
.booking-schedule::before{
  content:""; position:absolute; width:280px; height:280px; border-radius:50%;
  right:-120px; top:-150px; background:var(--sun-soft); opacity:.72;
}
.booking-heading{position:relative; display:grid; grid-template-columns:1fr auto; align-items:end; gap:8px 30px; margin-bottom:30px}
.booking-heading .eyebrow{grid-column:1/-1}
.booking-heading h2{font-size:clamp(28px,3.5vw,38px); letter-spacing:.06em}
.booking-heading p{color:var(--ink-2); font-size:16.5px}
.booking-steps{position:relative; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px}
.booking-step{
  min-width:0; display:flex; flex-direction:column; padding:28px 26px 26px; border-radius:28px;
  border:1px solid var(--line); background:var(--paper); box-shadow:var(--shadow);
}
.booking-step.influenza{border-top:6px solid var(--leaf)}
.booking-step.general{border-top:6px solid var(--sky)}
.booking-step.opening-step{border-top:6px solid var(--blossom)}
.booking-meta{display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:22px}
.booking-meta>span{
  min-width:40px; padding:4px 11px; border-radius:999px; background:var(--ivory-2);
  color:var(--ink-2); font-family:var(--latin); font-size:12px; font-weight:600; letter-spacing:.12em; text-align:center;
}
.booking-meta time{display:flex; align-items:baseline; gap:6px; color:var(--ink); font-family:var(--latin); line-height:1}
.booking-meta time b{font-size:32px; font-weight:600; letter-spacing:.01em}
.booking-meta time small{font-size:11px; font-weight:600; letter-spacing:.14em}
.influenza .booking-meta time{color:var(--leaf-deep)}
.general .booking-meta time{color:var(--sky)}
.opening-step .booking-meta time{color:var(--blossom)}
.booking-step h3{min-height:3em; font-size:clamp(20px,2.1vw,25px); letter-spacing:.04em; line-height:1.55}
.booking-step p{margin:14px 0 22px; color:var(--ink-2); font-size:15.5px; line-height:1.8}
.booking-actions{display:grid; gap:9px; margin-top:auto}
.booking-action{
  display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:52px;
  padding:12px 16px; border-radius:14px; color:#fff; font-family:var(--display); font-size:15px;
  font-weight:700; letter-spacing:.03em; box-shadow:var(--shadow); transition:transform .2s ease,box-shadow .2s ease;
}
.booking-action:hover{transform:translateY(-2px); box-shadow:var(--shadow-lift)}
.booking-action.line{background:var(--leaf)}
.booking-action.flu-web{background:var(--blossom)}
.booking-action.web{background:#8F72A1}
.booking-action.phone{background:var(--blossom)}
.booking-phone-link{display:inline-flex; margin-top:15px; color:var(--ink-2); font-size:14px; font-weight:700; text-decoration:underline; text-underline-offset:4px}
@media (max-width:940px){
  .booking-steps{grid-template-columns:1fr}
  .booking-step h3{min-height:0}
  .booking-actions{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:640px){
  .booking-schedule{padding:58px 0 50px}
  .booking-heading{grid-template-columns:1fr; margin-bottom:22px}
  .booking-heading p{font-size:15px}
  .booking-step{padding:24px 20px 22px; border-radius:22px}
  .booking-meta time b{font-size:29px}
  .booking-actions{grid-template-columns:1fr}
  .booking-action{font-size:14.5px}
}

/* ============ reservation choices (post-opening) ============ */
.booking-hub{padding:82px 0 78px}
.booking-hub .booking-heading{margin-bottom:36px}
.booking-policy{
  display:grid;grid-template-columns:.9fr 1.5fr;align-items:center;gap:38px;margin:0 0 24px;
  padding:27px 34px;background:var(--paper);border:1px solid color-mix(in srgb,var(--sky) 32%, transparent);
  border-radius:24px;box-shadow:var(--shadow);
}
.booking-policy-title{padding-right:34px;border-right:1px solid var(--line)}
.booking-policy-title .eyebrow{display:block;margin-bottom:5px;color:var(--sky)}
.booking-policy-title h3{font-size:clamp(22px,2.3vw,29px);line-height:1.45;letter-spacing:.04em}
.booking-policy>p{font-size:16.5px;font-weight:600;line-height:1.9;color:var(--ink-2)}
.booking-choice-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.booking-choice-grid .booking-step{
  position:relative;min-height:390px;padding:34px 34px 32px;border-top:0;overflow:hidden;
}
.booking-choice-grid .booking-step::before{content:"";position:absolute;inset:0 0 auto;height:154px;z-index:0}
.booking-choice-grid .general::before{background:var(--sun-soft)}
.booking-choice-grid .influenza::before{background:var(--leaf-soft)}
.booking-choice-grid .booking-step>*{position:relative;z-index:1}
.booking-choice-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px}
.booking-choice-number{
  display:inline-grid;place-items:center;width:46px;height:34px;border-radius:999px;background:rgba(255,255,255,.82);
  font-family:var(--latin);font-size:12px;font-weight:600;letter-spacing:.12em;color:var(--ink-2);
}
.booking-choice-type{font-family:var(--latin);font-size:12px;font-weight:600;letter-spacing:.18em;color:var(--muted)}
.booking-choice-grid .booking-step h3{min-height:0;margin-bottom:48px;font-size:clamp(25px,2.7vw,34px);line-height:1.45}
.booking-choice-grid .booking-step p{margin:0 0 26px;font-size:16px;line-height:1.85}
.booking-choice-grid .booking-actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.booking-choice-grid .booking-action{min-height:74px;padding:13px 18px;border-radius:18px;justify-content:flex-start;font-size:16px;line-height:1.45}
.booking-choice-grid .booking-action span{display:flex;flex-direction:column;gap:2px}
.booking-choice-grid .booking-action small{display:block;font-size:11.5px;font-weight:500;letter-spacing:.06em;opacity:.86}
.booking-choice-grid .booking-phone-link{margin-top:18px;font-size:14px}
@media (max-width:940px){.booking-choice-grid{grid-template-columns:1fr}}
@media (max-width:640px){
  .booking-hub{padding:58px 0 54px}
  .booking-policy{grid-template-columns:1fr;gap:17px;padding:24px 22px;margin-bottom:18px}
  .booking-policy-title{padding:0 0 17px;border-right:0;border-bottom:1px solid var(--line)}
  .booking-policy-title h3{font-size:23px}
  .booking-policy>p{font-size:15px;line-height:1.85}
  .booking-choice-grid{gap:18px}
  .booking-choice-grid .booking-step{min-height:0;padding:26px 22px 24px}
  .booking-choice-grid .booking-step::before{height:132px}
  .booking-choice-grid .booking-step h3{margin-bottom:42px;font-size:25px}
  .booking-choice-grid .booking-actions{grid-template-columns:1fr}
  .booking-choice-grid .booking-action{min-height:65px}
}

/* ============ appointment guide ============ */
.reservation-guide{padding:64px 0 34px; background:var(--ivory)}
.reservation-card{
  display:grid; grid-template-columns:.9fr 1.1fr 1.35fr; align-items:center; gap:30px;
  background:var(--paper); border:2px solid color-mix(in srgb,var(--sky) 38%, transparent);
  border-radius:var(--r-l); padding:34px 38px; box-shadow:var(--shadow);
}
.reservation-label .eyebrow{display:block; margin-bottom:7px; color:var(--sky)}
.reservation-label h2{font-size:clamp(24px,2.8vw,32px); letter-spacing:.05em}
.reservation-card p{font-size:18px; line-height:1.9; color:var(--ink-2); font-weight:600}
.reservation-actions{display:grid; grid-template-columns:1fr 1.25fr; gap:10px}
.reservation-card a{
  display:grid; grid-template-columns:1fr auto; align-items:center; column-gap:18px;
  background:var(--blossom); color:#fff; border-radius:18px; padding:15px 22px;
  box-shadow:var(--shadow); transition:transform .2s ease,box-shadow .2s ease;
}
.reservation-card a.web{background:#8F72A1}
.reservation-card a:hover{transform:translateY(-2px);box-shadow:var(--shadow-lift)}
.reservation-card a small{font-size:12px; line-height:1.4; letter-spacing:.04em}
.reservation-card a strong{font-family:var(--latin); font-size:20px; font-weight:600; line-height:1.4; white-space:nowrap}
.reservation-card a span{grid-column:2; grid-row:1/3; font-size:18px}
@media (max-width:1040px){.reservation-card{grid-template-columns:1fr 1fr}.reservation-actions{grid-column:1/-1}}
@media (max-width:640px){.reservation-guide{padding:50px 0 24px}.reservation-card{grid-template-columns:1fr; gap:18px; padding:28px 24px}.reservation-actions{grid-column:auto;grid-template-columns:1fr}.reservation-card a{grid-column:auto}}

/* ============ hours ============ */
.hours{padding-top:112px}
.hours::before{
  content:""; position:absolute; left:-140px; top:40px; width:320px; height:320px;
  border-radius:50%; background:var(--sun-soft); opacity:.7; z-index:0;
}
.split{display:grid; grid-template-columns:300px 1fr; gap:56px; align-items:start; position:relative; z-index:1}
.hours-card{
  background:var(--paper); border-radius:var(--r-l); padding:38px 40px 32px;
  box-shadow:var(--shadow); position:relative;
}
.hours-badge{
  position:absolute; top:-15px; right:28px; background:var(--sun); color:#5B4A22;
  font-size:13px; font-weight:700; padding:7px 20px; border-radius:999px; letter-spacing:.04em;
}
table{width:100%; border-collapse:collapse; font-variant-numeric:tabular-nums}
th,td{padding:16px 8px; text-align:center; border-bottom:1px solid var(--line)}
thead th{font-size:16.5px; font-weight:700; color:var(--ink); font-family:var(--display); letter-spacing:.1em; padding-bottom:12px}
thead th:first-child{text-align:left; font-size:14.5px; letter-spacing:.06em}
tbody th{text-align:left; font-weight:500}
tbody th b{display:block; font-family:var(--latin); font-size:21px; font-weight:600; color:#3F769F; letter-spacing:.04em}
tbody th small{font-size:14.5px; color:var(--ink-2)}
.dot{display:inline-block; width:11px; height:11px; border-radius:50%; background:var(--sky)}
.triangle{display:inline-flex; width:15px; height:15px; align-items:center; justify-content:center; color:var(--sky); font-family:sans-serif; font-size:15px; font-weight:700; line-height:1}
.dash{color:var(--muted)}
.hours-foot{display:flex; gap:20px; flex-wrap:wrap; align-items:center; padding-top:18px; font-size:14.5px}
.hours-foot b{font-weight:700}
.saturday-note{color:var(--ink-2)}
.saturday-note .triangle{margin-right:.3em; vertical-align:-.08em}
.doctor-schedule-note{margin-top:24px;padding:20px 22px;border-radius:16px;background:var(--sky-soft);color:var(--ink-2);font-size:16.5px;line-height:1.9}
.doctor-schedule-note b{color:var(--ink);margin-right:.75em}
@media (max-width:860px){
  .split{grid-template-columns:1fr; gap:32px}
  .hours-card{padding:32px 20px 24px}
  th,td{padding:12px 3px; font-size:13.5px}
  thead th{font-size:14px}
  thead th:first-child{font-size:13.5px}
  tbody th b{font-size:17px}
  tbody th small{font-size:12px}
}

/* ============ two info cards ============ */
.info{padding-top:0}
.info ul{display:grid; grid-template-columns:1fr 1fr; gap:26px}
.info li{
  border-radius:var(--r-l); padding:44px 44px 40px; position:relative; overflow:hidden;
}
.info li:nth-child(1){background:var(--sky-soft)}
.info li:nth-child(2){background:var(--blossom-soft)}
.info .arc{
  position:absolute; right:-70px; bottom:-90px; width:230px; height:230px; border-radius:50%;
  border:26px solid color-mix(in srgb,var(--paper) 45%, transparent);
}
.info .num{font-family:var(--latin); font-size:13px; color:var(--muted); letter-spacing:.1em; margin-right:22px}
.info .head{display:flex; align-items:baseline; margin-bottom:14px}
.info h3{font-size:clamp(24px,2.8vw,30px); letter-spacing:.05em; margin-bottom:18px; position:relative}
.info p{font-size:19px; line-height:2; color:var(--ink-2); position:relative}
.info .note{margin-top:22px; position:relative; display:block}
@media (max-width:860px){.info ul{grid-template-columns:1fr} .info li{padding:34px 28px} .info p{font-size:18px}}

/* ============ news ============ */
.news{background:var(--leaf-soft)}
.news ul{display:flex; flex-direction:column; gap:14px}
.news a{
  display:flex; align-items:center; gap:26px; background:var(--paper);
  border-radius:var(--r-m); padding:22px 30px; box-shadow:var(--shadow);
  transition:transform .2s ease, box-shadow .2s ease;
}
.news a:hover{transform:translateX(4px); box-shadow:var(--shadow-lift)}
.news time{font-family:var(--latin); font-size:14.5px; color:var(--muted); flex:none; width:96px}
.badge{
  font-size:11px; font-weight:700; padding:3px 12px; border-radius:5px; flex:none; letter-spacing:.04em;
  border:1px solid currentColor;
}
.badge.imp{color:var(--blossom)}
.badge.vac{color:var(--leaf-deep)}
.news h3{font-size:15px; font-weight:700; font-family:var(--body); letter-spacing:.02em}
.news .arw{margin-left:auto; color:var(--sky)}
@media (max-width:860px){
  .news a{flex-wrap:wrap; gap:12px 16px; padding:20px 22px}
  .news time{width:auto} .news h3{width:100%} .news .arw{display:none}
}

/* ============ promise ============ */
.promise{text-align:center; background:var(--ivory-2)}
.promise::before{
  content:""; position:absolute; left:-180px; top:60px; width:400px; height:400px;
  border-radius:50%; background:var(--sun-soft); opacity:.75;
}
.promise::after{
  content:""; position:absolute; right:-120px; bottom:-60px; width:300px; height:300px;
  border-radius:50%; border:34px solid var(--blossom-soft);
}
.promise .inner{position:relative; z-index:1}
.promise h2{font-size:clamp(28px,4.4vw,44px); letter-spacing:.09em; line-height:1.6; margin:18px 0 22px}
.promise > .wrap > .inner > .lede{max-width:48em; margin:0 auto}
.promise ul{display:grid; grid-template-columns:repeat(3,1fr); gap:26px; margin-top:64px; text-align:center}
.promise li{background:var(--paper); border-radius:var(--r-l); padding:44px 34px 40px; box-shadow:var(--shadow)}
.promise .chip{
  width:54px; height:54px; border-radius:50%; display:grid; place-items:center; margin:0 auto 22px;
  font-family:var(--latin); font-size:13px; color:#fff; letter-spacing:.06em;
}
.promise li:nth-child(1) .chip{background:var(--sky)}
.promise li:nth-child(2) .chip{background:var(--blossom)}
.promise li:nth-child(3) .chip{background:var(--leaf)}
.promise h3{font-size:19px; letter-spacing:.06em; margin-bottom:14px}
.promise li p{font-size:16px; color:var(--ink-2); text-align:left}
@media (max-width:860px){.promise ul{grid-template-columns:1fr}}

/* ============ services ============ */
.services{background:var(--sky); color:#fff}
.services .eyebrow{color:rgba(255,255,255,.75)}
.services h2{color:#fff}
.services-head{display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:end; margin-bottom:56px}
.services-head p{color:#fff; font-size:18px}
.services ul{display:grid; grid-template-columns:repeat(4,1fr); gap:22px}
.services li{
  border-radius:36px; padding:26px 28px 34px; color:var(--ink);
  display:flex; flex-direction:column; gap:0; min-height:330px;
  transition:transform .3s ease;
}
.services li:hover{transform:translateY(-6px)}
.services li:nth-child(1){background:var(--sun-soft)}
.services li:nth-child(2){background:var(--blossom-soft)}
.services li:nth-child(3){background:var(--leaf-soft)}
.services li:nth-child(4){background:var(--sky-soft)}
.svc-top{display:flex; justify-content:space-between; align-items:center; font-family:var(--latin); font-size:11.5px; color:var(--ink-2)}
.svc-top span{background:color-mix(in srgb,var(--paper) 70%, transparent); padding:3px 12px; border-radius:999px; letter-spacing:.1em}
.svc-top i{width:6px; height:6px; border-radius:50%; background:currentColor; opacity:.45; display:block}
.svc-ic{height:132px; display:grid; place-items:center; margin:10px 0 18px}
.svc-ic svg{width:112px; height:112px; transition:transform .35s cubic-bezier(.34,1.56,.64,1)}
.services li:hover .svc-ic svg{transform:translateY(-4px) rotate(-3deg) scale(1.05)}
.services h3{font-size:21px; letter-spacing:.05em; margin-bottom:12px}
.services li p{font-size:17px; color:var(--ink-2); margin-top:auto}
@media (max-width:1000px){.services ul{grid-template-columns:1fr 1fr}}
@media (max-width:860px){.services-head{grid-template-columns:1fr; gap:18px} .services ul{grid-template-columns:1fr} .services li{min-height:0}}

/* ============ vaccination banner ============ */
.vacc .panel{display:grid; grid-template-columns:.85fr 1.15fr; border-radius:var(--r-l); overflow:hidden}
.vacc .art{background:var(--sky-soft); display:grid; place-items:center; padding:56px 30px}
.vacc .art img{display:block; width:min(330px,72%); height:auto}
.vacc .txt{background:var(--sun-soft); padding:58px 56px}
.vacc h2{font-size:clamp(24px,3.2vw,34px); letter-spacing:.07em; margin:12px 0 20px}
.vacc p{font-size:18px; color:var(--ink-2)}
.vacc-times{margin-top:22px}
.vacc-times b{display:block;font-family:var(--display);font-size:17px;letter-spacing:.04em;margin-bottom:10px}
.vacc-times ul{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.vacc-times li{background:var(--paper);color:var(--ink);border:1px solid color-mix(in srgb,var(--sun) 55%, transparent);border-radius:10px;padding:8px 6px;text-align:center;font-family:var(--latin);font-size:15px;font-weight:600}
.vacc-times small{display:block;margin-top:8px;color:var(--ink-2);font-size:13.5px}
.line-btn{
  display:inline-flex; align-items:center; gap:16px; background:var(--leaf); color:#fff;
  border-radius:12px; padding:15px 26px; margin-top:32px; font-family:var(--display); font-weight:700;
  letter-spacing:.06em; box-shadow:var(--shadow); transition:transform .2s ease, box-shadow .2s ease;
}
.line-btn:hover{transform:translateY(-2px); box-shadow:var(--shadow-lift)}
.line-btn span{border-left:1px solid rgba(255,255,255,.45); padding-left:16px; font-size:11px; font-weight:400; font-family:var(--body)}
.vacc-actions{display:grid; grid-template-columns:1fr; align-items:stretch; gap:12px; margin-top:32px}
.vacc-actions .line-btn{width:100%; margin-top:0; justify-content:space-between}
.flu-web-btn{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  background:var(--blossom); color:#fff; border-radius:12px; padding:16px 22px;
  font-family:var(--display); font-weight:700; letter-spacing:.035em;
  box-shadow:var(--shadow); transition:transform .2s ease, box-shadow .2s ease;
}
.flu-web-btn:hover{transform:translateY(-2px); box-shadow:var(--shadow-lift)}
.flu-web-btn span{flex:none; border-left:1px solid rgba(255,255,255,.45); padding-left:14px; font-size:11px; font-weight:400; font-family:var(--body)}
.phone-btn{background:var(--blossom)}
.line-qr{
  display:flex; align-items:center; gap:12px; background:var(--paper); border-radius:16px;
  width:fit-content; max-width:100%; padding:10px 14px 10px 10px; box-shadow:var(--shadow);
}
.line-qr img{
  display:block; width:100px; height:100px; flex:none; image-rendering:crisp-edges;
  image-rendering:pixelated;
}
.line-qr b{display:block; font-family:var(--display); font-size:14px; letter-spacing:.04em}
.line-qr small{display:block; max-width:12em; margin-top:3px; color:var(--ink-2); font-size:11.5px; line-height:1.6}
.vacc .note{display:block; margin-top:20px}
@media (max-width:860px){
  .vacc .panel{grid-template-columns:1fr}
  .vacc .txt{padding:40px 28px}
  .vacc-times ul{grid-template-columns:repeat(2,minmax(0,1fr))}
  .vacc-actions{grid-template-columns:1fr}
  .vacc-actions{align-items:stretch}
  .line-btn{justify-content:center; width:100%}
  .flu-web-btn{width:100%}
  .line-qr{width:100%; justify-content:center}
}

/* ============ doctor greeting (home) ============ */
.doctor-home{background:var(--sky-soft)}
.doctor-home::before{
  content:"";position:absolute;width:430px;height:430px;right:-150px;top:-220px;
  border:1px solid rgba(255,255,255,.82);border-radius:50%;
}
.doctor-home::after{
  content:"";position:absolute;width:260px;height:260px;left:-110px;bottom:-160px;
  background:rgba(255,255,255,.35);border-radius:50%;
}
.doctor-home-grid{position:relative;z-index:1;display:grid;grid-template-columns:272px 1fr;gap:94px;align-items:center}
.doctor-portrait-card{
  position:relative;min-height:400px;border-radius:136px 136px 32px 32px;
  background:linear-gradient(180deg,#fff 0%,#faf7fb 100%);box-shadow:var(--shadow);overflow:hidden;
}
.doctor-portrait-card::before{content:"";position:absolute;inset:22px;border:1px solid var(--line);border-radius:116px 116px 21px 21px}
.doctor-portrait-card>img{position:absolute;left:50%;bottom:62px;width:208px;height:auto;transform:translateX(-50%)}
.doctor-portrait-name{
  position:absolute;left:19px;right:19px;bottom:18px;display:grid;place-items:center;gap:3px;
  min-height:68px;padding:10px 14px;background:rgba(255,255,255,.96);border-radius:14px;box-shadow:var(--shadow);
}
.doctor-portrait-name small{font-size:10px;color:var(--ink-2)}
.doctor-portrait-name b{font-family:var(--display);font-size:16px;letter-spacing:.16em}
.doctor-home-copy .eyebrow{color:var(--leaf-deep)}
.doctor-home-copy h2{font-size:clamp(34px,4.4vw,52px);letter-spacing:.08em;margin:15px 0 28px}
.doctor-home-copy h2 span{color:var(--sky)}
.doctor-home-copy>p{max-width:700px;color:var(--ink-2);font-size:17.5px;line-height:2.05}
.doctor-home .doctor-profile-link{
  display:inline-flex;align-items:center;justify-content:center;min-height:62px;margin-top:34px;padding:14px 30px;
  background:var(--paper);border:1px solid color-mix(in srgb,var(--sky) 72%,transparent);border-radius:999px;
  color:#7f678f;font-size:16px;font-weight:700;letter-spacing:.04em;box-shadow:var(--shadow);
  transition:transform .2s ease,box-shadow .2s ease;
}
.doctor-home .doctor-profile-link:hover{transform:translateY(-2px);box-shadow:var(--shadow-lift);background:var(--paper);color:#7f678f}
@media (max-width:860px){
  .doctor-home-grid{grid-template-columns:1fr;gap:38px}
  .doctor-portrait-card{width:min(65.6%,256px);min-height:336px;margin:auto;border-radius:116px 116px 26px 26px}
  .doctor-portrait-card::before{inset:19px;border-radius:100px 100px 19px 19px}
  .doctor-portrait-card>img{bottom:75px;width:66%}
  .doctor-portrait-name{left:16px;right:16px;bottom:16px;min-height:64px}
  .doctor-home-copy h2{font-size:34px}
  .doctor-home-copy>p{font-size:16px}
  .doctor-home .doctor-profile-link{width:100%;font-size:14px;text-align:center}
}

/* ============ legacy doctor styles ============ */
.doctor{background:var(--sky-soft)}
.doctor .grid{display:grid; grid-template-columns:1fr 1fr; gap:70px; align-items:center}
.doc-art{position:relative; aspect-ratio:1/.92; display:grid; place-items:center}
.doc-art .blob{
  position:absolute; inset:6% 8%; border-radius:56% 44% 50% 50%/50% 52% 48% 50%;
  background:linear-gradient(160deg,var(--ivory-2),var(--blossom-soft));
}
.doc-art .doctor-bear{position:relative; z-index:1; width:78%; height:auto; object-fit:contain; filter:drop-shadow(0 18px 28px rgba(80,66,46,.12))}
.doc-art .vert{
  position:absolute; left:0; bottom:0; font-family:var(--latin); font-size:44px; letter-spacing:.3em;
  writing-mode:vertical-rl; color:var(--paper); opacity:.75; font-weight:500;
}
.doctor h2{font-size:clamp(26px,3.8vw,40px); letter-spacing:.08em; line-height:1.6; margin:16px 0 26px}
.doctor p{color:var(--ink-2); font-size:16.5px; line-height:2}
.doctor .doctor-lead{font-weight:700; color:var(--ink); margin-bottom:20px}
.doctor-message p{margin:0 0 14px}
.doctor-nameplate{position:absolute; z-index:2; left:14%; right:14%; bottom:5%; padding:14px 18px; border-radius:18px; background:rgba(255,255,255,.93); text-align:center; box-shadow:var(--shadow)}
.doctor-nameplate small{display:block; color:var(--muted); font-size:11px; letter-spacing:.06em}
.doctor-nameplate b{display:block; margin-top:3px; font-family:var(--display); font-size:20px; letter-spacing:.12em}
.doctor-profile-link{display:inline-flex; align-items:center; gap:22px; margin-top:22px; padding:15px 24px; border:1px solid var(--sky); border-radius:999px; background:var(--paper); color:#806796; font-weight:700; box-shadow:var(--shadow); transition:.2s}
.doctor-profile-link:hover{transform:translateY(-2px); background:var(--sky); color:var(--paper)}
@media (max-width:860px){.doctor .grid{grid-template-columns:1fr; gap:36px} .doc-art{max-width:540px; margin:0 auto}.doc-art .vert{display:none}}
@media (max-width:560px){.doc-art .doctor-bear{width:84%}.doctor-nameplate{left:9%;right:9%}.doctor-profile-link{width:100%;justify-content:center;text-align:center;font-size:14px}}

/* ============ faq ============ */
details{
  background:var(--sun-soft); border-radius:var(--r-m); margin-bottom:16px; overflow:hidden;
  border:1px solid color-mix(in srgb,var(--sun) 42%, transparent);
}
summary{
  display:flex; align-items:center; gap:20px; padding:22px 28px; cursor:pointer; list-style:none;
  font-weight:700; font-size:16.5px;
}
summary::-webkit-details-marker{display:none}
summary .q{font-family:var(--latin); color:var(--sky); font-size:17px; font-weight:600}
summary .pm{margin-left:auto; color:var(--sky); font-size:20px; transition:transform .25s ease; line-height:1}
details[open] summary .pm{transform:rotate(45deg)}
details .ans{padding:0 28px 26px 68px; font-size:16px; color:var(--ink-2)}
@media (max-width:860px){summary{padding:18px 20px; gap:14px} details .ans{padding:0 20px 22px 20px}}

/* ============ access ============ */
.access{padding:0; display:grid; grid-template-columns:1fr 1fr}
.map{position:relative; background:var(--sky-soft); min-height:460px; overflow:hidden}
.map iframe{position:absolute; inset:0; width:100%; height:100%; border:0}
.map .gmap{
  position:absolute; right:34px; bottom:34px; background:var(--paper); color:var(--ink);
  border-radius:12px; padding:15px 26px; font-weight:700; font-size:14px; box-shadow:var(--shadow);
  transition:transform .2s ease, box-shadow .2s ease;
}
.map .gmap:hover{transform:translateY(-2px); box-shadow:var(--shadow-lift)}
.access-info{background:var(--sky); color:#fff; padding:76px 6vw}
.access-info .eyebrow{color:rgba(255,255,255,.8)}
.access-info h2{color:#fff; font-size:clamp(28px,3.6vw,40px); letter-spacing:.1em; margin:14px 0 30px}
.access-info .org{font-size:16.5px; opacity:1}
.access-info .name{font-family:var(--display); font-size:clamp(20px,2.4vw,26px); letter-spacing:.1em; font-weight:700; margin-bottom:22px}
.access-info address{font-style:normal; font-size:18px; line-height:2}
.access-info hr{border:0; border-top:1px solid rgba(255,255,255,.35); margin:28px 0}
.tel-row{display:flex; align-items:baseline; gap:24px; margin-bottom:8px}
.tel-row span{font-size:12px; opacity:.85; width:34px; flex:none}
.tel-row b{font-family:var(--latin); font-size:clamp(20px,2.4vw,25px); font-weight:600; letter-spacing:.04em}
.park{display:flex; align-items:center; gap:18px; flex-wrap:wrap}
.park b{background:var(--paper); color:var(--ink); font-size:14.5px; font-weight:700; padding:8px 18px; border-radius:8px}
.park small{font-size:14px; opacity:1}
@media (max-width:860px){.access{grid-template-columns:1fr} .access-info{padding:52px 28px}}

/* ============ footer ============ */
footer{background:var(--sky); color:#fff; padding:70px 0 30px}
.f-grid{display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:50px}
.f-brand .brand-name{color:#fff}
.f-brand .brand-en{color:var(--blossom)}
.f-brand p{margin-top:26px; font-size:14.5px; line-height:2; color:#fff}
footer nav a{display:block; padding:14px 0; font-size:15px; border-bottom:1px solid rgba(255,255,255,.28); color:#fff}
footer nav a:hover{color:#fff; padding-left:6px; transition:padding .2s ease}
footer nav a.soon{color:rgba(255,255,255,.6)}
.f-bot{
  display:flex; justify-content:space-between; align-items:center; margin-top:56px; padding-top:22px;
  border-top:1px solid rgba(255,255,255,.28); font-family:var(--latin); font-size:11.5px; letter-spacing:.14em;
  color:rgba(255,255,255,.8);
}
@media (max-width:860px){.f-grid{grid-template-columns:1fr; gap:26px}}

html{scroll-behavior:smooth;scroll-padding-top:88px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}


/* ============ WordPress content ============ */
body.admin-bar header.site{top:32px}
.director-page-title{padding:46px 0 42px;background:var(--paper);border-bottom:1px solid var(--line)}
.director-page-title p{margin:0;color:var(--muted);font-size:12px}
.director-page-title h1{margin-top:18px;font-size:clamp(34px,4vw,52px);letter-spacing:.08em}
.director-page-hero{position:relative;overflow:hidden;padding:72px 0 82px;background:linear-gradient(135deg,var(--leaf-soft),#f2ecef)}
.director-page-hero:after{content:"DOCTOR";position:absolute;right:2%;bottom:-45px;color:rgba(255,255,255,.55);font-family:var(--latin);font-size:120px;font-weight:600;line-height:1;letter-spacing:.08em}
.director-page-hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:360px 1fr;gap:76px;align-items:center}
.director-page-portrait{height:460px;padding:24px;overflow:hidden;border-radius:180px 180px 34px 34px;background:var(--paper);box-shadow:var(--shadow-lift)}
.director-page-portrait img{width:100%;height:100%;object-fit:contain}
.director-page-hero h2{margin:10px 0 6px;font-size:clamp(42px,5vw,64px);letter-spacing:.14em}
.director-page-hero .reading{margin:0;color:var(--muted);font-size:14px;letter-spacing:.12em}
.director-page-hero .role{margin:20px 0 26px;color:var(--leaf-deep);font-size:17px;font-weight:700}
.director-page-catch{max-width:650px;margin:0;padding-top:22px;border-top:1px solid rgba(83,142,128,.35);font-size:22px;font-weight:700;line-height:1.9;letter-spacing:.04em}
.director-page-nav{background:var(--ivory);border-bottom:1px solid var(--line)}
.director-page-nav .wrap{display:flex;align-items:center;gap:30px;height:64px;overflow:auto;white-space:nowrap;color:var(--muted);font-size:14px;font-weight:700}
.director-page-nav a:hover{color:var(--leaf-deep)}
.director-page-sections{background:var(--paper)}
.director-page-sections article{padding:88px 0;border-bottom:1px solid var(--line);scroll-margin-top:24px}
.director-page-sections article:last-child{border-bottom:0}
.director-page-section-grid{display:grid;grid-template-columns:240px 1fr;gap:74px;align-items:start}
.director-page-section-grid header h2{margin-top:12px;font-size:32px;line-height:1.55;letter-spacing:.07em}
.director-page-copy{max-width:820px;color:var(--ink-2);font-size:17px;line-height:2.2}
.director-page-copy p{margin:0 0 25px}
.director-page-copy p:last-child{margin-bottom:0}
.director-page-copy strong{color:var(--ink);font-weight:700}
.director-page-signature{padding-top:22px;text-align:right;letter-spacing:.08em}
.director-page-signature b{font-size:22px}
.wp-content{background:var(--ivory);min-height:62vh}
.wp-content .narrow{max-width:860px}
.entry-heading{margin-bottom:42px}
.entry-heading h1,.single-entry h1{font-size:clamp(30px,4vw,44px);margin-top:10px}
.post-list{display:grid;gap:20px}
.post-card{background:var(--paper);border-radius:var(--r-m);padding:28px 32px;box-shadow:var(--shadow)}
.post-card time,.single-entry time{font-family:var(--latin);font-size:14px;color:var(--muted)}
.post-card h2{font-size:22px;margin:8px 0 12px}
.post-card h2 a:hover{color:var(--leaf-deep)}
.entry-summary,.entry-content{color:var(--ink-2)}
.single-entry{background:var(--paper);border-radius:var(--r-l);padding:clamp(28px,5vw,58px);box-shadow:var(--shadow)}
.single-entry h1{margin:10px 0 34px}
.entry-content>*+*{margin-top:1.5em}
.entry-content img{max-width:100%;height:auto;border-radius:var(--r-m)}
.entry-content .article-ctas{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:2.2em}
.entry-content .article-ctas .wp-block-button{width:100%}
.entry-content .article-ctas .wp-block-button__link{display:flex;align-items:center;justify-content:center;min-height:68px;width:100%;padding:16px 20px;border-radius:18px;color:#fff;font-family:var(--display);font-size:16px;font-weight:700;line-height:1.5;text-align:center;box-shadow:var(--shadow);transition:transform .2s ease,box-shadow .2s ease}
.entry-content .article-ctas .wp-block-button__link:hover{transform:translateY(-2px);box-shadow:var(--shadow-lift)}
.entry-content .article-ctas .line-cta-article .wp-block-button__link{background:var(--leaf)}
.entry-content .article-ctas .flu-web-cta .wp-block-button__link{background:var(--blossom)}
.entry-content .article-ctas .flu-web-cta .wp-block-button__link:hover{background:#D57F76}
.entry-content .wp-block-buttons:not(.article-ctas) .wp-block-button__link{background:#8F72A1;color:#fff;border-radius:18px;padding:16px 24px;font-family:var(--display);font-weight:700;box-shadow:var(--shadow);transition:transform .2s ease,background .2s ease,box-shadow .2s ease}
.entry-content .wp-block-buttons:not(.article-ctas) .wp-block-button__link:hover{background:#806290;transform:translateY(-2px);box-shadow:var(--shadow-lift)}
@media (max-width:640px){.entry-content .article-ctas{grid-template-columns:1fr}}
@media (max-width:860px){.director-page-hero-grid,.director-page-section-grid{grid-template-columns:1fr;gap:34px}.director-page-portrait{width:min(360px,100%);margin:auto}.director-page-hero{text-align:center}.director-page-catch{margin:auto}.director-page-copy{max-width:none}}
@media (max-width:640px){.director-page-title{padding:30px 0}.director-page-hero{padding:50px 0 62px}.director-page-portrait{height:390px}.director-page-hero h2{font-size:42px}.director-page-catch{font-size:18px}.director-page-nav .wrap{height:56px;gap:22px}.director-page-sections article{padding:62px 0}.director-page-section-grid{gap:24px}.director-page-section-grid header h2{font-size:28px}.director-page-copy{font-size:16px}.director-page-signature b{font-size:20px}}
.news-more{font-size:14px;font-weight:700;color:var(--leaf-deep);margin-top:4px}
.screen-reader-text{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media (max-width:782px){body.admin-bar header.site{top:46px}}
