/* ============================================
   Dr. Lo Dental Office — Design System
   ============================================ */
:root{
  --teal-900:#0b3b3c;
  --teal-800:#0d4f4f;
  --teal-700:#0f6666;
  --teal-600:#0d9488;
  --teal-500:#14b8a6;
  --teal-100:#ccfbf1;
  --teal-50:#f0fdfa;
  --sky-600:#0369a1;
  --sky-500:#0ea5e9;
  --coral-500:#fb7185;
  --coral-600:#e11d48;
  --ink-900:#0f172a;
  --ink-700:#334155;
  --ink-500:#64748b;
  --ink-300:#cbd5e1;
  --ink-100:#e2e8f0;
  --bg-soft:#f6faf9;
  --white:#ffffff;
  --radius-sm:8px;
  --radius-md:14px;
  --radius-lg:24px;
  --shadow-sm:0 2px 8px rgba(15,23,42,.06);
  --shadow-md:0 8px 24px rgba(15,23,42,.10);
  --shadow-lg:0 20px 48px rgba(13,79,79,.18);
  --container:1180px;
  --header-h:76px;
  --font: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:var(--font);
  color:var(--ink-700);
  background:var(--bg-soft);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
ul{margin:0;padding:0;list-style:none;}
h1,h2,h3,h4{color:var(--ink-900);line-height:1.2;margin:0 0 .5em;font-weight:800;}
p{margin:0 0 1em;}
.container{max-width:var(--container);margin:0 auto;padding:0 24px;}
section{padding:88px 0;}
@media(max-width:768px){section{padding:56px 0;}}

.eyebrow{
  display:inline-flex;align-items:center;gap:8px;
  color:var(--teal-700);font-weight:700;font-size:.8rem;
  letter-spacing:.08em;text-transform:uppercase;margin-bottom:12px;
}
.eyebrow i{color:var(--coral-500);}
h2.section-title{font-size:clamp(1.7rem,3vw,2.4rem);}
.section-lead{color:var(--ink-500);font-size:1.05rem;max-width:640px;}
.center{text-align:center;margin-left:auto;margin-right:auto;}

/* Buttons */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:14px 28px;border-radius:999px;font-weight:700;font-size:.98rem;
  border:2px solid transparent;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,background .2s ease,color .2s ease;
  white-space:nowrap;
}
.btn-primary{background:linear-gradient(135deg,var(--teal-600),var(--teal-700));color:#fff;box-shadow:var(--shadow-md);}
.btn-primary:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg);}
.btn-coral{background:linear-gradient(135deg,var(--coral-500),var(--coral-600));color:#fff;box-shadow:0 8px 24px rgba(225,29,72,.25);}
.btn-coral:hover{transform:translateY(-2px);}
.btn-outline{background:transparent;border-color:rgba(255,255,255,.6);color:#fff;}
.btn-outline:hover{background:rgba(255,255,255,.12);transform:translateY(-2px);}
.btn-ghost{background:var(--white);color:var(--teal-700);border-color:var(--teal-100);}
.btn-ghost:hover{border-color:var(--teal-500);transform:translateY(-2px);}
.btn-sm{padding:9px 18px;font-size:.85rem;}

/* ===== Header ===== */
.site-header{
  position:sticky;top:0;z-index:1000;
  background:rgba(255,255,255,.92);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--ink-100);
}
.topbar{
  background:var(--teal-900);color:#e6fffb;font-size:.82rem;
}
.topbar .container{display:flex;justify-content:space-between;align-items:center;min-height:38px;padding-top:6px;padding-bottom:6px;flex-wrap:nowrap;gap:12px;}
.topbar a{color:#e6fffb;opacity:.9;transition:opacity .2s;white-space:nowrap;}
.topbar a:hover{opacity:1;}
.topbar-links{display:flex;gap:18px;align-items:center;flex-wrap:nowrap;min-width:0;}
.topbar-links a{display:inline-flex;align-items:center;overflow:hidden;}
.topbar-links i{margin-right:6px;color:var(--teal-500);flex:0 0 auto;}
.topbar-links a span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.topbar-hours{opacity:.85;white-space:nowrap;flex:0 0 auto;}
@media(max-width:700px){.topbar-hours{display:none;}}
@media(max-width:600px){
  .topbar .container{padding-left:16px;padding-right:16px;gap:8px;}
  .topbar-links{gap:12px;}
  .topbar-links a.email-link{display:none;}
  .topbar-links a.phone-link span{max-width:112px;}
}
@media(max-width:360px){
  .topbar-links a.phone-link span{display:none;}
}

.navbar{height:var(--header-h);display:flex;align-items:center;justify-content:space-between;}
.brand{display:flex;align-items:center;gap:12px;font-weight:800;color:var(--ink-900);font-size:1.15rem;}
.brand .logo-mark{
  width:44px;height:44px;border-radius:12px;
  background:linear-gradient(135deg,var(--teal-500),var(--sky-600));
  display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.3rem;
  box-shadow:var(--shadow-sm);
}
.brand small{display:block;font-weight:500;color:var(--ink-500);font-size:.72rem;letter-spacing:.03em;}

.nav-main{display:flex;align-items:center;gap:4px;}
.nav-main > li{position:relative;}
.nav-main > li > a{
  display:flex;align-items:center;gap:6px;padding:12px 14px;border-radius:10px;
  font-weight:600;color:var(--ink-700);font-size:.95rem;transition:background .2s,color .2s;
}
.nav-main > li > a:hover,.nav-main > li.active > a{background:var(--teal-50);color:var(--teal-700);}
.nav-main > li > a i.chev{font-size:.65rem;transition:transform .2s;color:var(--ink-300);}
.nav-main > li:hover > a i.chev{transform:rotate(180deg);}

.dropdown{
  position:absolute;top:calc(100% + 10px);left:0;min-width:260px;
  background:#fff;border-radius:var(--radius-md);box-shadow:var(--shadow-lg);
  padding:10px;opacity:0;visibility:hidden;transform:translateY(8px);
  transition:opacity .2s ease,transform .2s ease,visibility .2s;
  border:1px solid var(--ink-100);
}
.nav-main > li:hover .dropdown,.nav-main > li.open .dropdown{opacity:1;visibility:visible;transform:translateY(0);}
.dropdown a{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:8px;color:var(--ink-700);font-size:.9rem;font-weight:600;}
.dropdown a i{color:var(--teal-600);width:18px;text-align:center;}
.dropdown a:hover{background:var(--teal-50);color:var(--teal-700);}

.nav-cta{display:flex;align-items:center;gap:10px;}
.nav-toggle{display:none;background:none;border:none;font-size:1.5rem;color:var(--ink-900);cursor:pointer;padding:6px;}

@media(max-width:980px){
  .nav-main{
    position:fixed;top:0;right:-100%;width:min(340px,86vw);height:100vh;
    background:#fff;flex-direction:column;align-items:stretch;gap:0;
    padding:90px 20px 30px;box-shadow:-10px 0 40px rgba(0,0,0,.15);
    transition:right .35s ease;overflow-y:auto;
  }
  .nav-main.open{right:0;}
  .nav-main > li > a{padding:14px 10px;font-size:1.02rem;justify-content:space-between;}
  .dropdown{position:static;box-shadow:none;border:none;opacity:1;visibility:visible;transform:none;display:none;padding:0 0 0 14px;background:var(--teal-50);border-radius:10px;margin:4px 0;}
  .nav-main > li.open .dropdown{display:block;}
  .nav-main > li:hover .dropdown{display:none;}
  .nav-main > li.open .dropdown{display:block;}
  .nav-toggle{display:block;}
  .nav-cta .btn span{display:none;}
  .nav-cta .btn{padding:12px;border-radius:50%;}
  .nav-overlay{position:fixed;inset:0;background:rgba(15,23,42,.5);opacity:0;visibility:hidden;transition:opacity .3s;z-index:998;}
  .nav-overlay.show{opacity:1;visibility:visible;}
}

/* ===== Hero ===== */
.hero{
  position:relative;overflow:hidden;
  background:radial-gradient(1200px 600px at 80% -10%,rgba(20,184,166,.18),transparent),
             linear-gradient(180deg,#eafffb 0%,var(--bg-soft) 100%);
  padding:80px 0 100px;
}
.hero .container{display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:center;}
@media(max-width:900px){.hero .container{grid-template-columns:1fr;}}
.hero h1{font-size:clamp(2.2rem,4.2vw,3.4rem);}
.hero h1 .accent{background:linear-gradient(135deg,var(--teal-600),var(--sky-600));-webkit-background-clip:text;background-clip:text;color:transparent;}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:28px;}
.hero-badges{display:flex;gap:26px;margin-top:40px;flex-wrap:wrap;}
.hero-badge{display:flex;align-items:center;gap:10px;font-weight:700;color:var(--ink-900);font-size:.92rem;}
.hero-badge i{color:var(--teal-600);font-size:1.2rem;}
.hero-art{position:relative;}
.hero-card{
  background:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);
  padding:22px;transform:rotate(-2deg);
}
.hero-card img{border-radius:var(--radius-md);}
.hero-float{
  position:absolute;background:#fff;border-radius:var(--radius-md);box-shadow:var(--shadow-md);
  padding:14px 18px;display:flex;align-items:center;gap:12px;font-weight:700;color:var(--ink-900);font-size:.85rem;
}
.hero-float.f1{top:-18px;right:-18px;transform:rotate(3deg);}
.hero-float.f2{bottom:-20px;left:-24px;transform:rotate(-3deg);}
.hero-float i{color:var(--teal-600);font-size:1.3rem;}
@media(max-width:520px){.hero-float{display:none;}}

/* ===== Page header (inner pages) ===== */
.page-hero{
  background:linear-gradient(135deg,var(--teal-800),var(--teal-600) 60%,var(--sky-600));
  color:#fff;padding:64px 0 56px;position:relative;overflow:hidden;
}
.page-hero::after{content:"";position:absolute;inset:0;background:radial-gradient(600px 300px at 90% 0%,rgba(255,255,255,.15),transparent);}
.page-hero .container{position:relative;}
.breadcrumb{display:flex;gap:8px;align-items:center;font-size:.85rem;color:#d6fff7;margin-bottom:14px;}
.breadcrumb a{color:#fff;font-weight:600;}
.page-hero h1{color:#fff;font-size:clamp(1.9rem,3.4vw,2.7rem);margin-bottom:10px;}
.page-hero p{color:#dffaf5;max-width:640px;font-size:1.05rem;margin:0;}

/* ===== Cards / grids ===== */
.grid{display:grid;gap:26px;}
.grid-2{grid-template-columns:repeat(2,1fr);}
.grid-3{grid-template-columns:repeat(3,1fr);}
.grid-4{grid-template-columns:repeat(4,1fr);}
@media(max-width:900px){.grid-3,.grid-4{grid-template-columns:repeat(2,1fr);}}
@media(max-width:600px){.grid-2,.grid-3,.grid-4{grid-template-columns:1fr;}}

.card{
  background:#fff;border-radius:var(--radius-md);padding:30px;box-shadow:var(--shadow-sm);
  border:1px solid var(--ink-100);transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;
}
.card:hover{transform:translateY(-6px);box-shadow:var(--shadow-md);border-color:var(--teal-100);}
.card .icon-badge{
  width:56px;height:56px;border-radius:16px;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,var(--teal-50),var(--teal-100));color:var(--teal-700);font-size:1.5rem;
  margin-bottom:18px;transition:transform .25s ease,background .25s ease,color .25s ease;
}
.card:hover .icon-badge{background:linear-gradient(135deg,var(--teal-600),var(--sky-600));color:#fff;transform:scale(1.08) rotate(-4deg);}
.card h3{font-size:1.12rem;margin-bottom:8px;}
.card p{color:var(--ink-500);font-size:.95rem;margin-bottom:0;}
.card-link{display:inline-flex;align-items:center;gap:6px;margin-top:14px;font-weight:700;color:var(--teal-700);font-size:.88rem;}
.card-link i{transition:transform .2s;}
.card:hover .card-link i{transform:translateX(4px);}

.service-card{display:flex;flex-direction:column;height:100%;}

/* Feature row */
.feature{display:flex;gap:16px;align-items:flex-start;}
.feature .icon-badge{flex:0 0 auto;width:48px;height:48px;border-radius:14px;font-size:1.2rem;margin-bottom:0;}
.feature h4{margin-bottom:4px;font-size:1.02rem;}
.feature p{color:var(--ink-500);font-size:.93rem;margin-bottom:0;}

/* Stats */
.stats{background:var(--teal-900);color:#fff;padding:56px 0;}
.stats .grid{grid-template-columns:repeat(4,1fr);text-align:center;}
@media(max-width:700px){.stats .grid{grid-template-columns:repeat(2,1fr);}}
.stat h3{color:#fff;font-size:clamp(1.8rem,3vw,2.4rem);margin-bottom:4px;}
.stat p{color:#9fe6da;margin:0;font-size:.88rem;text-transform:uppercase;letter-spacing:.05em;font-weight:700;}

/* CTA banner */
.cta-banner{
  background:linear-gradient(135deg,var(--teal-700),var(--sky-600));
  border-radius:var(--radius-lg);color:#fff;padding:56px;
  display:flex;justify-content:space-between;align-items:center;gap:30px;flex-wrap:wrap;
  box-shadow:var(--shadow-lg);
}
.cta-banner h2{color:#fff;margin-bottom:8px;}
.cta-banner p{color:#e0fbf6;margin:0;}
.cta-actions{display:flex;gap:12px;flex-wrap:wrap;}

/* Two-col content */
.split{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;}
@media(max-width:860px){.split{grid-template-columns:1fr;}}
.split img{border-radius:var(--radius-lg);box-shadow:var(--shadow-md);}
.checklist li{display:flex;gap:12px;align-items:flex-start;margin-bottom:14px;font-weight:600;color:var(--ink-900);}
.checklist i{color:var(--teal-600);margin-top:3px;}

/* Table (fees) */
.table-wrap{overflow-x:auto;border-radius:var(--radius-md);box-shadow:var(--shadow-sm);border:1px solid var(--ink-100);}
table.pretty{width:100%;border-collapse:collapse;background:#fff;min-width:520px;}
table.pretty th{background:var(--teal-50);color:var(--teal-800);text-align:left;padding:16px 20px;font-size:.85rem;text-transform:uppercase;letter-spacing:.04em;}
table.pretty td{padding:16px 20px;border-top:1px solid var(--ink-100);font-size:.95rem;}
table.pretty tr:hover td{background:var(--bg-soft);}

/* Timeline (credentials) */
.timeline{border-left:3px solid var(--teal-100);padding-left:28px;margin-left:10px;}
.timeline-item{position:relative;padding-bottom:28px;}
.timeline-item::before{content:"";position:absolute;left:-35px;top:4px;width:14px;height:14px;border-radius:50%;background:var(--teal-600);box-shadow:0 0 0 4px var(--teal-100);}
.timeline-item .year{color:var(--teal-700);font-weight:800;font-size:.85rem;}
.timeline-item h4{margin:2px 0 4px;}
.timeline-item p{color:var(--ink-500);margin:0;font-size:.92rem;}

/* Hours table */
.hours-list{background:#fff;border-radius:var(--radius-md);box-shadow:var(--shadow-sm);border:1px solid var(--ink-100);overflow:hidden;}
.hours-row{display:flex;justify-content:space-between;padding:14px 24px;border-top:1px solid var(--ink-100);font-weight:600;}
.hours-row:first-child{border-top:none;}
.hours-row.closed{color:var(--ink-500);}
.hours-row.today{background:var(--teal-50);}
.hours-row .badge-today{background:var(--coral-500);color:#fff;font-size:.68rem;padding:2px 8px;border-radius:999px;margin-left:8px;text-transform:uppercase;}

/* Alert / notice */
.notice{
  display:flex;gap:14px;background:#fff7ed;border:1px solid #fed7aa;color:#9a3412;
  border-radius:var(--radius-md);padding:18px 22px;font-size:.92rem;
}
.notice i{color:#f97316;font-size:1.2rem;flex:0 0 auto;}
.notice-teal{background:var(--teal-50);border-color:var(--teal-100);color:var(--teal-800);}
.notice-teal i{color:var(--teal-600);}

/* Map */
.map-wrap{border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-md);border:1px solid var(--ink-100);}
.map-wrap iframe{width:100%;height:420px;border:0;display:block;}

/* Reveal animation */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease;}
.reveal.in{opacity:1;transform:none;}

/* Footer */
.site-footer{background:var(--ink-900);color:#cbd5e1;padding:64px 0 0;margin-top:60px;}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:40px;padding-bottom:44px;}
@media(max-width:860px){.footer-grid{grid-template-columns:1fr 1fr;}}
@media(max-width:560px){.footer-grid{grid-template-columns:1fr;}}
.site-footer h4{color:#fff;font-size:.95rem;margin-bottom:18px;letter-spacing:.03em;}
.site-footer .brand{color:#fff;margin-bottom:14px;}
.site-footer p{color:#94a3b8;font-size:.92rem;}
.footer-links li{margin-bottom:10px;}
.footer-links a{color:#94a3b8;font-size:.92rem;transition:color .2s;}
.footer-links a:hover{color:#5eead4;}
.footer-contact li{display:flex;gap:10px;margin-bottom:14px;color:#94a3b8;font-size:.92rem;align-items:flex-start;}
.footer-contact i{color:#5eead4;margin-top:3px;}
.footer-social{display:flex;gap:10px;margin-top:16px;}
.footer-social a{width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;transition:background .2s,transform .2s;}
.footer-social a:hover{background:var(--teal-600);transform:translateY(-3px);}
.footer-bottom{border-top:1px solid rgba(255,255,255,.1);padding:22px 0;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-size:.82rem;color:#64748b;}

/* Back to top */
.back-to-top{
  position:fixed;right:22px;bottom:22px;width:48px;height:48px;border-radius:50%;
  background:var(--teal-600);color:#fff;display:flex;align-items:center;justify-content:center;
  box-shadow:var(--shadow-md);opacity:0;visibility:hidden;transform:translateY(10px);
  transition:opacity .3s,transform .3s,visibility .3s;z-index:900;border:none;cursor:pointer;font-size:1.1rem;
}
.back-to-top.show{opacity:1;visibility:visible;transform:none;}

/* Floating call button (mobile) */
.mobile-call{
  position:fixed;left:0;right:0;bottom:0;z-index:950;display:none;
  background:#fff;border-top:1px solid var(--ink-100);box-shadow:0 -6px 20px rgba(0,0,0,.08);
  padding:10px 16px;gap:10px;
}
@media(max-width:700px){.mobile-call{display:flex;}body{padding-bottom:64px;}}
.mobile-call a{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;padding:12px;border-radius:12px;font-weight:700;font-size:.9rem;}
.mobile-call .call{background:var(--teal-600);color:#fff;}
.mobile-call .book{background:var(--coral-500);color:#fff;}

/* Sidebar (Dental101 / Service subpages) */
.with-sidebar{display:grid;grid-template-columns:2.2fr 1fr;gap:48px;align-items:start;}
@media(max-width:900px){.with-sidebar{grid-template-columns:1fr;}}
.sidebar-card{background:#fff;border-radius:var(--radius-md);box-shadow:var(--shadow-sm);border:1px solid var(--ink-100);padding:22px;position:sticky;top:calc(var(--header-h) + 60px);}
.sidebar-card h4{font-size:.85rem;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-500);margin-bottom:14px;}
.sidebar-card li a{display:flex;gap:10px;align-items:center;padding:10px 8px;border-radius:8px;font-weight:600;font-size:.9rem;color:var(--ink-700);}
.sidebar-card li a:hover{background:var(--teal-50);color:var(--teal-700);}
.sidebar-card li a.active{background:var(--teal-600);color:#fff;}
.sidebar-cta{margin-top:18px;padding-top:18px;border-top:1px solid var(--ink-100);}

.prose h3{margin-top:1.6em;}
.prose ul{margin:0 0 1.2em;padding-left:0;}
.prose ul li{display:flex;gap:10px;margin-bottom:10px;color:var(--ink-700);}
.prose ul li i{color:var(--teal-600);margin-top:5px;flex:0 0 auto;}
.prose ol{padding-left:22px;margin:0 0 1.2em;}
.prose ol li{margin-bottom:10px;}

/* Doctor profile */
.doctor-card{background:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow-md);overflow:hidden;border:1px solid var(--ink-100);}
.doctor-photo{aspect-ratio:4/3;overflow:hidden;background:var(--teal-100);}
.doctor-photo img{width:100%;height:100%;object-fit:cover;}
.doctor-info{padding:26px;}
.doctor-info h3{margin-bottom:2px;}
.doctor-info .role{color:var(--teal-600);font-weight:700;font-size:.88rem;margin-bottom:14px;}

/* Photo frame for real office photo */
.photo-frame{border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-lg);border:6px solid #fff;}

/* Utility */
.mt-0{margin-top:0;}
.text-center{text-align:center;}
.tag{display:inline-block;background:var(--teal-100);color:var(--teal-800);font-weight:700;font-size:.72rem;text-transform:uppercase;letter-spacing:.04em;padding:5px 12px;border-radius:999px;margin-bottom:14px;}

/* Language dropdown */
.lang-dropdown{position:relative;display:inline-flex;flex:0 0 auto;}
.lang-toggle{
  display:inline-flex;align-items:center;gap:7px;white-space:nowrap;
  padding:5px 13px;border-radius:999px;background:rgba(255,255,255,.18);
  border:1px solid rgba(255,255,255,.32);
  font-weight:700;font-size:.78rem;color:#ffffff;cursor:pointer;
  transition:background .2s,border-color .2s;font-family:inherit;
}
.lang-toggle:hover{background:rgba(255,255,255,.3);border-color:rgba(255,255,255,.5);}
.lang-toggle i.fa-globe{color:#ffffff;}
.lang-toggle i.fa-chevron-down{color:rgba(255,255,255,.85);}
.lang-menu{
  position:absolute;top:calc(100% + 8px);right:0;min-width:160px;
  background:#fff;border-radius:12px;box-shadow:var(--shadow-lg);
  padding:8px;opacity:0;visibility:hidden;transform:translateY(6px);
  transition:opacity .2s ease,transform .2s ease,visibility .2s;z-index:1200;
}
/* Only trigger on hover for devices with real hover+pointer, so touch never gets "stuck open" */
@media (hover:hover) and (pointer:fine){
  .lang-dropdown:hover .lang-menu{opacity:1;visibility:visible;transform:none;}
}
.lang-dropdown.open .lang-menu{opacity:1;visibility:visible;transform:none;}
.lang-menu a{display:block;padding:9px 12px;border-radius:8px;font-size:.85rem;font-weight:600;color:var(--ink-700);white-space:nowrap;}
.lang-menu a:hover{background:var(--teal-50);color:var(--teal-700);}
.lang-menu a.active{background:var(--teal-600);color:#fff;}

@media(max-width:600px){
  .lang-toggle{padding:5px 11px;}
  .lang-menu{right:-8px;}
}

/* Chinese typography tweaks */
html[lang="zh-Hant"] body{
  font-family:"PingFang TC","Microsoft JhengHei","Heiti TC",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  letter-spacing:.01em;
}
html[lang="zh-Hans"] body{
  font-family:"PingFang SC","Microsoft YaHei","Heiti SC",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  letter-spacing:.01em;
}
html[lang="zh-Hant"] h1, html[lang="zh-Hant"] h2, html[lang="zh-Hant"] h3, html[lang="zh-Hant"] h4,
html[lang="zh-Hans"] h1, html[lang="zh-Hans"] h2, html[lang="zh-Hans"] h3, html[lang="zh-Hans"] h4{
  letter-spacing:.02em;
}