/* ===== ErisdMiro 美學設計體系 ===== */
:root{
  --dark:#2a221d;
  --dark-2:#352a23;
  --dark-3:#211b17;
  --cream:#f4eee6;
  --cream-2:#ece3d8;
  --card:#efe7dc;
  --gold:#b58a5e;
  --gold-2:#c6a079;
  --gold-deep:#a3784f;
  --ink:#3a322b;
  --ink-soft:#6f655b;
  --line:#ddd0c0;
  --serif:"Cormorant Garamond","Noto Serif TC",serif;
  --serif-tc:"Noto Serif TC",serif;
  --sans:"Noto Sans TC","Segoe UI",sans-serif;
}

*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:var(--sans);
  color:var(--ink);
  background:var(--cream);
  line-height:1.7;
  font-weight:300;
  -webkit-font-smoothing:antialiased;
}
.container{max-width:1180px;margin:0 auto;padding:0 28px;}
a{color:inherit;text-decoration:none;}
.gold{color:var(--gold);}
.center{text-align:center;}
.muted{color:var(--ink-soft);font-size:.92rem;line-height:1.9;}

/* ===== Line icons ===== */
.ic{display:inline-block;fill:none;stroke:currentColor;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round;width:1em;height:1em;}
.svc-ico .ic{width:46px;height:46px;}
.step-ico .ic{width:34px;height:34px;}
.inst-badge .ic{width:22px;height:22px;}
.hero-tags .ico .ic{width:18px;height:18px;vertical-align:-4px;}

/* ===== Buttons ===== */
.btn{
  display:inline-block;padding:13px 26px;border-radius:2px;
  font-size:.9rem;letter-spacing:.08em;cursor:pointer;border:1px solid transparent;
  transition:.25s ease;font-family:var(--sans);
}
.btn-gold{background:var(--gold);color:#fff;}
.btn-gold:hover{background:var(--gold-deep);}
.btn-ghost{border-color:rgba(255,255,255,.5);color:#f4eee6;}
.btn-ghost:hover{background:rgba(255,255,255,.1);}
.btn-gold-sm{background:var(--gold);color:#fff;padding:10px 22px;font-size:.85rem;}
.btn-gold-sm:hover{background:var(--gold-deep);}
.btn-outline-sm{border-color:var(--gold);color:var(--gold-deep);padding:7px 18px;font-size:.8rem;}
.btn-outline-sm:hover{background:var(--gold);color:#fff;}

/* ===== Header ===== */
.site-header{
  position:sticky;top:0;z-index:50;background:rgba(33,27,23,.96);
  backdrop-filter:blur(6px);border-bottom:1px solid rgba(255,255,255,.06);
}
.header-inner{display:flex;align-items:center;gap:28px;height:74px;}
.brand{display:flex;flex-direction:column;line-height:1.15;color:#f4eee6;}
.brand-name{font-family:var(--serif);font-size:1.5rem;letter-spacing:.04em;font-weight:600;}
.brand-sub{font-size:.72rem;letter-spacing:.32em;color:#cbb69e;}
.brand-en{font-size:.55rem;letter-spacing:.22em;color:#8c7c6a;text-transform:uppercase;}
.nav{display:flex;gap:24px;margin-left:auto;}
.nav a{color:#d8cbb d;color:#d6c9ba;font-size:.9rem;letter-spacing:.05em;position:relative;padding:4px 0;transition:.2s;}
.nav a:hover,.nav a.active{color:#fff;}
.nav a.active::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:1px;background:var(--gold);}
.header-cta{margin-left:8px;}
.nav-toggle{display:none;background:none;border:0;flex-direction:column;gap:5px;cursor:pointer;}
.nav-toggle span{width:24px;height:2px;background:#e7dccb;display:block;}

/* ===== Hero ===== */
.hero{
  background:linear-gradient(160deg,#2c241e 0%,#241d18 55%,#1f1813 100%);
  color:#f3ece2;position:relative;overflow:hidden;
}
.hero-grid{display:grid;grid-template-columns:1.02fr 0.9fr 0.62fr;gap:34px;align-items:stretch;min-height:540px;padding:0 28px;}
.hero-copy{align-self:center;padding:52px 0 50px;}
.hero-title{font-family:var(--serif-tc);font-weight:500;font-size:3rem;line-height:1.35;letter-spacing:.02em;}
.hero-lead{margin-top:22px;color:#c9bcab;font-size:1rem;line-height:2;}
.hero-actions{display:flex;gap:16px;margin-top:30px;flex-wrap:wrap;}
.hero-tags{display:flex;gap:22px;flex-wrap:wrap;margin-top:38px;list-style:none;padding-top:26px;border-top:1px solid rgba(255,255,255,.12);}
.hero-tags li{font-size:.85rem;color:#cdbfae;letter-spacing:.04em;display:flex;align-items:center;gap:7px;}
.hero-tags .ico{color:var(--gold-2);}

.hero-photo{
  width:100%;height:100%;min-height:480px;align-self:stretch;
  background:#2c221b url("img/hero.png") center top/cover no-repeat;
  position:relative;overflow:hidden;
}
.hero-quote{align-self:center;text-align:left;padding:52px 0;}
.hero-quote-top{font-family:var(--serif-tc);font-size:1.05rem;color:#e9dccb;line-height:1.8;}
.hero-sign{font-family:"Cormorant Garamond",cursive;font-style:italic;font-size:1.8rem;color:var(--gold-2);margin-top:18px;}
.hero-founder{font-size:.82rem;color:#b6a690;margin-top:4px;}
.hero-founder strong{color:#ece0cf;font-weight:500;}

/* ===== Disclaimer ===== */
.disclaimer{background:var(--cream-2);border-bottom:1px solid var(--line);}
.disclaimer .container{padding-top:14px;padding-bottom:14px;font-size:.78rem;color:#7d7164;letter-spacing:.02em;}
.info-ico{color:var(--gold);margin-right:6px;}

/* ===== Sections ===== */
.section{padding:78px 0;}
.serif-title{font-family:var(--serif-tc);font-weight:600;font-size:2rem;line-height:1.3;color:var(--ink);}
.section-head{margin-bottom:46px;}
.section-head.center .serif-title{margin-bottom:10px;}
.gold-line{position:relative;display:inline-block;}
.gold-line::after{content:"";display:block;width:46px;height:2px;background:var(--gold);margin:14px auto 0;}

/* ===== What ===== */
.what{background:var(--cream);}
.what-grid{display:grid;grid-template-columns:280px 1fr;gap:48px;align-items:start;}
.what-intro .serif-title{font-family:var(--serif);font-size:2.4rem;line-height:1.15;}
.lead-line{font-family:var(--serif-tc);font-size:1.15rem;margin:18px 0 14px;color:var(--ink);}
.what-intro .btn-gold-sm{margin-top:20px;}
.cards-4{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;}
.svc-card{background:var(--card);border:1px solid var(--line);border-radius:3px;padding:30px 22px;text-align:center;transition:.25s;}
.svc-card:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(60,45,30,.12);}
.svc-ico{font-size:1.9rem;color:var(--gold);margin-bottom:14px;}
.svc-card h3{font-family:var(--serif-tc);font-weight:600;font-size:1.15rem;letter-spacing:.08em;margin-bottom:14px;}
.svc-card p{font-size:.85rem;color:var(--ink-soft);line-height:2;}

/* ===== Institutes ===== */
.institutes{background:var(--cream-2);}
.inst-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-bottom:40px;}
.inst-card{background:var(--card);border:1px solid var(--line);border-radius:3px;overflow:hidden;transition:.25s;}
.inst-card:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(60,45,30,.14);}
.inst-photo{height:150px;position:relative;background-size:cover;background-position:center;background-repeat:no-repeat;background-color:#4a3a2c;}
.inst-photo.p1{background-image:url("img/inst1.png");}
.inst-photo.p2{background-image:url("img/inst2.png");}
.inst-photo.p3{background-image:url("img/inst3.png");}
.inst-photo.p4{background-image:url("img/inst4.png");}
.inst-badge{
  position:absolute;left:50%;bottom:-20px;transform:translateX(-50%);
  width:42px;height:42px;border-radius:50%;background:var(--card);
  border:1px solid var(--line);display:flex;align-items:center;justify-content:center;
  color:var(--gold);font-size:1.1rem;
}
.inst-body{padding:34px 20px 26px;text-align:center;}
.inst-body h3{font-family:var(--serif-tc);font-weight:600;font-size:1.1rem;letter-spacing:.06em;}
.inst-body .en{font-size:.7rem;letter-spacing:.12em;color:var(--gold-deep);text-transform:uppercase;margin:6px 0 12px;}

/* ===== Journey ===== */
.journey{background:var(--cream);}
.journey-grid{display:grid;grid-template-columns:300px 1fr;gap:48px;align-items:center;}
.journey-intro .serif-title{margin-bottom:18px;}
.journey-intro .btn-gold-sm{margin-top:22px;}
.steps{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:14px;position:relative;}
.steps::before{content:"";position:absolute;top:32px;left:8%;right:8%;height:1px;background:var(--line);z-index:0;}
.step{text-align:center;position:relative;z-index:1;}
.step-ico{
  width:66px;height:66px;border-radius:50%;background:var(--card);border:1px solid var(--line);
  display:flex;align-items:center;justify-content:center;margin:0 auto 16px;
  font-size:1.5rem;color:var(--gold);
}
.step-num{
  display:inline-block;background:var(--gold);color:#fff;font-size:.7rem;
  padding:2px 9px;border-radius:20px;margin-bottom:-8px;position:relative;top:-6px;letter-spacing:.05em;
}
.step h3{font-family:var(--serif-tc);font-weight:600;font-size:1.05rem;letter-spacing:.05em;margin-bottom:8px;}

/* ===== Medical ===== */
.medical{background:linear-gradient(160deg,#2a221c,#1e1813);color:#e9ddcd;}
.medical-grid{display:grid;grid-template-columns:1fr 1fr 0.85fr 0.82fr;gap:36px;align-items:center;}
.serif-title.light,.light{color:#f1e6d6;}
.light-strong{font-family:var(--serif-tc);font-size:1.1rem;color:#e7d9c5;margin:16px 0 14px;}
.muted-light{color:#ab9b86;font-size:.88rem;line-height:2;}
.medical-map{position:relative;text-align:center;}
.map-dots{
  height:130px;border-radius:4px;
  background:#1c1611 url("img/map.png") center/contain no-repeat;
}
.map-label{font-size:.78rem;color:#998a76;margin-top:12px;}
.map-pins{display:flex;justify-content:center;gap:26px;margin-top:8px;}
.pin{color:var(--gold-2);font-size:.85rem;letter-spacing:.04em;}
.medical-future h3{font-family:var(--serif-tc);font-weight:600;font-size:1.3rem;margin-bottom:14px;}
.future-cities{font-family:var(--serif-tc);font-size:1.05rem;color:#e2d4c0;line-height:2;letter-spacing:.08em;margin-bottom:16px;}
.medical-photo{
  position:relative;align-self:stretch;min-height:170px;border-radius:4px;overflow:hidden;
  background:#2c2017 url("img/interior.png") center/cover no-repeat;
  display:flex;align-items:flex-end;justify-content:center;padding:18px;
}
.medical-photo::before{content:"";position:absolute;inset:0;background:linear-gradient(transparent,rgba(20,15,11,.55));}
.medical-photo .btn-gold{position:relative;z-index:1;font-size:.82rem;padding:11px 18px;text-align:center;}

/* ===== Leaders ===== */
.leaders{background:var(--cream-2);}
.leader-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
.leader-card{background:var(--card);border:1px solid var(--line);border-radius:3px;display:flex;flex-direction:column;transition:.25s;}
.leader-card:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(60,45,30,.14);}
.leader-photo{height:150px;background-size:cover;background-position:center top;background-repeat:no-repeat;background-color:#5a4737;}
.leader-photo.l1{background-image:url("img/leader1.png");}
.leader-photo.l2{background-image:url("img/leader2.png");}
.leader-photo.l3{background-image:url("img/leader3.png");}
.leader-photo.l4{background-image:url("img/leader4.png");}
.leader-body{padding:22px 20px 24px;text-align:center;display:flex;flex-direction:column;gap:12px;flex:1;}
.leader-body h3{font-family:var(--serif-tc);font-weight:600;font-size:1rem;letter-spacing:.04em;}
.leader-body .muted{font-size:.82rem;flex:1;}
.leader-body .btn-outline-sm{align-self:center;}

/* ===== Contact ===== */
.contact{background:var(--cream);}
.contact-inner{max-width:680px;margin:0 auto;text-align:center;}
.contact-inner .serif-title{margin-bottom:14px;}
.contact-form{margin-top:34px;display:flex;flex-direction:column;gap:14px;text-align:left;}
.contact-form .row{display:flex;gap:14px;}
.contact-form input,.contact-form textarea{
  flex:1;padding:13px 16px;border:1px solid var(--line);background:#fff;border-radius:2px;
  font-family:var(--sans);font-size:.9rem;color:var(--ink);resize:vertical;
}
.contact-form input:focus,.contact-form textarea:focus{outline:none;border-color:var(--gold);}
.contact-form .btn-gold{margin-top:8px;align-self:center;min-width:220px;}

/* ===== Footer ===== */
.site-footer{background:#1f1813;color:#cabaa6;}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:34px;padding:52px 28px 38px;}
.footer-brand .brand-name{font-family:var(--serif);font-size:1.5rem;color:#f1e6d6;display:block;}
.footer-brand .brand-sub{font-size:.72rem;letter-spacing:.3em;color:#bba98f;display:block;}
.footer-brand .brand-en{font-size:.55rem;letter-spacing:.2em;color:#7d6e5c;display:block;text-transform:uppercase;}
.footer-disc{font-size:.72rem;color:#8a7b69;margin-top:16px;line-height:1.9;max-width:420px;}
.footer-nav{display:flex;flex-direction:column;gap:11px;font-size:.85rem;}
.footer-nav a:hover{color:#f1e6d6;}
.footer-contact p{font-size:.85rem;margin-bottom:10px;}
.footer-contact span{color:#8a7b69;display:inline-block;width:72px;}
.footer-copy{border-top:1px solid rgba(255,255,255,.07);}
.footer-copy .container{padding:18px 28px;font-size:.75rem;color:#7d6e5c;text-align:center;}

/* ===== Responsive ===== */
@media(max-width:980px){
  .nav{display:none;position:absolute;top:74px;left:0;right:0;flex-direction:column;background:#221b16;padding:18px 28px;gap:16px;}
  .nav.open{display:flex;}
  .header-cta{display:none;}
  .nav-toggle{display:flex;margin-left:auto;}
  .hero-grid{grid-template-columns:1fr;gap:36px;}
  .hero-title{font-size:2.3rem;}
  .hero-quote{position:static;margin-top:22px;}
  .what-grid,.journey-grid,.medical-grid{grid-template-columns:1fr;gap:32px;}
  .cards-4,.inst-grid,.steps,.leader-grid{grid-template-columns:repeat(2,1fr);}
  .steps::before{display:none;}
}
@media(max-width:560px){
  .cards-4,.inst-grid,.steps,.leader-grid{grid-template-columns:1fr;}
  .contact-form .row{flex-direction:column;}
  .footer-grid{grid-template-columns:1fr;}
  .hero-title{font-size:2rem;}
  .section{padding:54px 0;}
}
