/* =====================================================================
   Forward Oral & Maxillofacial Surgery · shared system ("Diplomate")
   Tokens, type, controls, header/footer, and every component on
   prototype/components.html. Page-only layout lives in the page.
   ===================================================================== */

/* ---------- tokens: stepped warm paper; bottle green = actions (and the teeth you pick) only ---------- */
:root{
  --page:#F3EEE4; --card:#EBE4D6; --inset:#E1D8C7; --raised:#FBF8F2;
  --ink:#1E1B16; --ink2:#5A5147; --ink3:#6B6053;
  --rule:#D5C9B5; --rule2:#C4B69E;
  --g50:#E6EEE8; --g100:#C9DBCF; --g300:#86AA94; --g500:#2E6A4F; --g700:#1E4D3A; --g900:#112A20;
  --act:var(--g700); --act-text:var(--g700); --act-hover:#173F2F; --act-ink:#F6F3EC; --act-soft:var(--g50); --ring:rgba(46,106,79,.32);
  --seal:var(--g500);
  --err:#9A2E1E; --err-soft:#F3E2DA;
  --shadow:0 1px 0 rgba(255,255,255,.75) inset, 0 1px 2px rgba(60,44,20,.10), 0 4px 10px -4px rgba(60,44,20,.14), 0 18px 36px -18px rgba(60,44,20,.34);
  --shadow-lg:0 1px 2px rgba(60,44,20,.10), 0 24px 60px -20px rgba(60,44,20,.38);
  --caption:#2A2620; --caption-ink:#EFE8DB;
  --scrim:rgba(20,16,10,.45);
  --r1:2px; --r2:6px; --r3:10px;
  --gut:48px; --max:1280px; --hdr:68px; --bar:0px;
  --serif:"Source Serif 4",Georgia,"Times New Roman",serif;
  --sans:"Schibsted Grotesk",system-ui,-apple-system,"Segoe UI",sans-serif;
  --ease:cubic-bezier(.2,.7,.2,1);
  color-scheme:light;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --page:#15130F; --card:#1F1C17; --inset:#0F0D0B; --raised:#2B2720;
  --ink:#EEE7DA; --ink2:#B4A998; --ink3:#968B7A; --rule:#37312A; --rule2:#4A4237;
  --act:#2F6B52; --act-text:#8CC7A5; --act-hover:#377A5E; --act-ink:#F3EEE4; --act-soft:#1B2A22; --ring:rgba(140,199,165,.35); --seal:#8CC7A5;
  --err:#E58B78; --err-soft:#2E1C17;
  --shadow:0 1px 0 rgba(255,255,255,.05) inset, 0 12px 30px -12px rgba(0,0,0,.7);
  --shadow-lg:0 24px 60px -20px rgba(0,0,0,.8);
  --caption:#0C0B09; --caption-ink:#E6DECF; --scrim:rgba(0,0,0,.6); color-scheme:dark}}
:root[data-theme="dark"]{
  --page:#15130F; --card:#1F1C17; --inset:#0F0D0B; --raised:#2B2720;
  --ink:#EEE7DA; --ink2:#B4A998; --ink3:#968B7A; --rule:#37312A; --rule2:#4A4237;
  --act:#2F6B52; --act-text:#8CC7A5; --act-hover:#377A5E; --act-ink:#F3EEE4; --act-soft:#1B2A22; --ring:rgba(140,199,165,.35); --seal:#8CC7A5;
  --err:#E58B78; --err-soft:#2E1C17;
  --shadow:0 1px 0 rgba(255,255,255,.05) inset, 0 12px 30px -12px rgba(0,0,0,.7);
  --shadow-lg:0 24px 60px -20px rgba(0,0,0,.8);
  --caption:#0C0B09; --caption-ink:#E6DECF; --scrim:rgba(0,0,0,.6); color-scheme:dark}

/* ---------- base ---------- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--hdr) + 20px);background:var(--page)}
body{background:var(--page);color:var(--ink);font:400 16px/1.58 var(--sans);font-feature-settings:"kern";-webkit-font-smoothing:antialiased;overflow-x:hidden;padding-bottom:var(--bar)}
img,svg{display:block;max-width:100%}
img{height:auto}
a{color:inherit}
button,input,select,textarea{font:inherit;color:inherit}
ul[role="list"],ol[role="list"]{list-style:none}
.serif{font-family:var(--serif)}
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--gut)}
.wrap-narrow{max-width:880px;margin:0 auto;padding:0 var(--gut)}
.tnum{font-variant-numeric:tabular-nums;white-space:nowrap}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
.skip{position:absolute;left:-9999px;top:8px;z-index:100;background:var(--raised);padding:8px 12px;border-radius:var(--r2);box-shadow:var(--shadow)}
.skip:focus{left:16px}
:focus-visible{outline:2px solid var(--act-text);outline-offset:2px}
::selection{background:var(--g100);color:var(--g900)}
[hidden]{display:none!important}

/* ---------- type ---------- */
.display{font-family:var(--serif);font-variation-settings:"opsz" 60;font-weight:340;font-size:64px;line-height:1.02;letter-spacing:-.026em;text-wrap:balance}
.h1{font-family:var(--serif);font-variation-settings:"opsz" 54;font-weight:350;font-size:52px;line-height:1.04;letter-spacing:-.022em;text-wrap:balance}
.h2{font-family:var(--serif);font-variation-settings:"opsz" 40;font-weight:360;font-size:40px;line-height:1.08;letter-spacing:-.018em;text-wrap:balance}
.h2-sm{font-family:var(--serif);font-variation-settings:"opsz" 30;font-weight:380;font-size:30px;line-height:1.12;letter-spacing:-.014em;text-wrap:balance}
.h3{font-family:var(--serif);font-variation-settings:"opsz" 22;font-weight:450;font-size:22px;line-height:1.22;letter-spacing:-.006em}
.cred{font-family:var(--serif);font-variation-settings:"opsz" 20;font-weight:420;font-size:19px;line-height:1.16;letter-spacing:-.006em}
.lede{font-size:18px;line-height:1.55;color:var(--ink2);max-width:46ch;text-wrap:pretty}
.body{font-size:16.5px;line-height:1.58;color:var(--ink2)}
.ui{font-size:14px;font-weight:500;letter-spacing:.005em}
.lbl{font-size:12px;font-weight:600;letter-spacing:.02em;color:var(--ink3)}
.lbl-seal{color:var(--seal)}
.small{font-size:13.5px;line-height:1.5;color:var(--ink2)}
.link{font-size:14px;font-weight:600;color:var(--act-text);text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:1px}
.link-plain{color:var(--ink);text-decoration:underline;text-decoration-color:var(--rule2);text-underline-offset:3px;text-decoration-thickness:1px}
@media (hover:hover){.link:hover{color:var(--act-hover)}.link-plain:hover{text-decoration-color:var(--ink3)}}
:root[data-theme="dark"] .link:hover{color:var(--g100)}
.stack-8>*+*{margin-top:8px}.stack-16>*+*{margin-top:16px}

/* ---------- buttons ---------- */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:8px;height:44px;padding:0 20px;border-radius:var(--r2);font:600 14.5px/1 var(--sans);letter-spacing:.005em;border:0;cursor:pointer;white-space:nowrap;transition:background-color .14s ease,box-shadow .14s ease,transform .1s ease,color .14s ease;text-decoration:none;-webkit-tap-highlight-color:transparent;user-select:none}
.btn-p{background:var(--act);color:var(--act-ink);box-shadow:0 1px 0 rgba(255,255,255,.14) inset,0 1px 2px rgba(17,42,32,.25)}
.btn-s{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1px var(--rule2)}
.btn-t{background:transparent;color:var(--act-text);height:auto;padding:4px 2px;border-radius:var(--r1);text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
@media (hover:hover){
  .btn-p:hover,.btn-p.is-hover{background:var(--act-hover)}
  .btn-s:hover,.btn-s.is-hover{background:var(--card);box-shadow:inset 0 0 0 1px var(--ink3)}
  .btn-t:hover,.btn-t.is-hover{color:var(--ink)}
}
.btn-p.is-hover{background:var(--act-hover)}
.btn-s.is-hover{background:var(--card);box-shadow:inset 0 0 0 1px var(--ink3)}
.btn-t.is-hover{color:var(--ink)}
.btn:active{transform:scale(.97)}
.btn:focus-visible,.btn.is-focus{outline:0;box-shadow:0 0 0 2px var(--page),0 0 0 4px var(--act-text)}
.btn-t:focus-visible,.btn-t.is-focus{box-shadow:0 0 0 2px var(--act-text)}
.btn:disabled,.btn[aria-disabled="true"]{cursor:not-allowed;transform:none}
.btn-p:disabled,.btn-p[aria-disabled="true"]{background:var(--inset);color:var(--ink3);box-shadow:none}
.btn-s:disabled,.btn-s[aria-disabled="true"]{color:var(--ink3);box-shadow:inset 0 0 0 1px var(--rule)}
.btn-t:disabled{color:var(--ink3);text-decoration-color:var(--rule2)}
.btn.is-loading{cursor:progress}
.btn .spin{width:14px;height:14px;border-radius:50%;border:2px solid currentColor;border-right-color:transparent;animation:sp .8s linear infinite;opacity:.85;flex:none}
.btn-sm{height:38px;padding:0 15px;font-size:13.5px}
.btn-lg{height:50px;padding:0 24px;font-size:15px}
.btn-block{width:100%}
.btn svg{flex:none}
@keyframes sp{to{transform:rotate(360deg)}}
.btn-row{display:flex;flex-wrap:wrap;gap:10px;align-items:center}

/* ---------- form controls ---------- */
.field{display:flex;flex-direction:column;gap:6px;min-width:0}
.field>label,.field>.field-l{font-size:12.5px;font-weight:600;color:var(--ink2);letter-spacing:.01em}
.field .hint{font-size:12.5px;color:var(--ink3);line-height:1.4}
.field .msg{font-size:12.5px;color:var(--err);display:flex;gap:6px;align-items:center;line-height:1.4}
.input,.select{height:44px;width:100%;border-radius:var(--r2);border:0;background:var(--raised);box-shadow:inset 0 0 0 1px var(--rule2);padding:0 14px;font:500 16px var(--sans);color:var(--ink);transition:box-shadow .14s ease}
textarea.input{height:auto;min-height:104px;padding:11px 14px;line-height:1.5;resize:vertical}
.input::placeholder{color:var(--ink3);font-weight:400}
@media (hover:hover){.input:hover,.select:hover{box-shadow:inset 0 0 0 1px var(--ink3)}}
.input:focus,.select:focus,.input.is-focus{outline:0;box-shadow:inset 0 0 0 1.5px var(--act-text),0 0 0 3px var(--ring)}
.input[aria-invalid="true"],.input.err{box-shadow:inset 0 0 0 1.5px var(--err)}
.input[aria-invalid="true"]:focus{box-shadow:inset 0 0 0 1.5px var(--err),0 0 0 3px rgba(154,46,30,.18)}
.input:disabled,.select:disabled{background:var(--card);color:var(--ink3);box-shadow:inset 0 0 0 1px var(--rule);cursor:not-allowed}
.select{appearance:none;-webkit-appearance:none;padding-right:40px;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none'%3E%3Cpath d='M2.5 4.5L6 8l3.5-3.5' stroke='%2372675A' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center}
.check{display:grid;grid-template-columns:20px 1fr;gap:10px;align-items:start;font-size:15px;line-height:1.45;cursor:pointer;padding:6px 0}
.check input{appearance:none;-webkit-appearance:none;width:20px;height:20px;margin-top:1px;border-radius:4px;background:var(--raised);box-shadow:inset 0 0 0 1.25px var(--ink3);display:grid;place-items:center;cursor:pointer;transition:background-color .12s ease,box-shadow .12s ease}
.check input[type="radio"]{border-radius:50%}
.check input:checked{background:var(--act);box-shadow:none}
.check input[type="checkbox"]:checked::after{content:"";width:10px;height:6px;border-left:2px solid var(--act-ink);border-bottom:2px solid var(--act-ink);transform:translateY(-1px) rotate(-45deg)}
.check input[type="radio"]:checked::after{content:"";width:8px;height:8px;border-radius:50%;background:var(--act-ink)}
.check input:focus-visible{outline:0;box-shadow:0 0 0 2px var(--page),0 0 0 4px var(--act-text)}
.check input:disabled{background:var(--card);box-shadow:inset 0 0 0 1px var(--rule);cursor:not-allowed}
.check:has(input:disabled){color:var(--ink3);cursor:not-allowed}
.check small{display:block;font-size:13px;color:var(--ink3)}
.chip{height:38px;padding:0 14px;border-radius:999px;border:0;background:var(--page);box-shadow:inset 0 0 0 1px var(--rule2);font-size:13.5px;font-weight:600;cursor:pointer;transition:background-color .14s,box-shadow .14s,color .14s}
@media (hover:hover){.chip:hover{box-shadow:inset 0 0 0 1px var(--ink3)}}
.chip[aria-pressed="true"]{background:var(--act);color:var(--act-ink);box-shadow:none}
.chip:focus-visible{outline:0;box-shadow:0 0 0 2px var(--page),0 0 0 4px var(--act-text)}

/* =====================================================================
   HEADER
   ===================================================================== */
.util{border-bottom:1px solid var(--rule);font-size:13px;color:var(--ink2)}
.util .wrap{display:flex;justify-content:space-between;align-items:center;height:36px;gap:20px}
.util ul{display:flex;gap:22px;list-style:none;align-items:center}
.util a,.util button{text-decoration:none;background:none;border:0;cursor:pointer;font-size:13px;color:inherit;padding:2px 0}
@media (hover:hover){.util a:hover,.util button:hover{color:var(--ink)}}
.util .tel{font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums}


.hdr{position:sticky;top:0;z-index:40;background:var(--page);border-bottom:1px solid transparent;transition:border-color .2s}
.hdr.scrolled{border-bottom-color:var(--rule)}
.hdr>.wrap{display:flex;align-items:center;height:var(--hdr);gap:24px}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;flex:none;border-radius:var(--r1)}
.brand svg{flex:none}
.brand .wm{display:flex;flex-direction:column;line-height:1}
.brand b{font-family:var(--serif);font-variation-settings:"opsz" 30;font-weight:480;font-size:23px;letter-spacing:-.015em}
.brand .wm span{font-size:11.5px;font-weight:500;color:var(--ink2);letter-spacing:.015em;margin-top:4px}

.mainnav{margin-left:auto}
.mainnav>ul{display:flex;gap:4px;list-style:none;align-items:center}
.mainnav>ul>li{position:relative}
.nav-t{display:inline-flex;align-items:center;gap:6px;height:40px;padding:0 10px;border:0;background:transparent;border-radius:var(--r2);font-size:14.5px;font-weight:500;color:var(--ink2);text-decoration:none;cursor:pointer;white-space:nowrap}
.nav-t svg{transition:transform .16s ease;color:var(--ink3)}
@media (hover:hover){.nav-t:hover{color:var(--ink);background:var(--card)}}
.nav-t[aria-current="page"],.nav-t[aria-current="true"]{color:var(--ink)}
.nav-t[aria-current="page"]::after,.nav-t[aria-current="true"]::after{content:"";position:absolute;left:10px;right:10px;bottom:2px;height:1.5px;background:var(--ink);border-radius:1px}
.has-menu.open>.nav-t{color:var(--ink);background:var(--card)}
.has-menu.open>.nav-t svg{transform:rotate(180deg)}

.menu{position:absolute;top:calc(100% + 10px);left:-8px;z-index:45;min-width:280px;background:var(--raised);border-radius:var(--r3);box-shadow:var(--shadow-lg),0 0 0 1px var(--rule);padding:10px;opacity:0;visibility:hidden;transform:translateY(-4px);transition:opacity .14s ease,transform .14s ease,visibility 0s linear .14s}
.menu::before{content:"";position:absolute;left:0;right:0;top:-12px;height:12px}
.has-menu.open>.menu{opacity:1;visibility:visible;transform:none;transition:opacity .14s ease,transform .14s ease}
.menu ul{list-style:none}
.menu a{display:block;padding:9px 12px;border-radius:var(--r2);text-decoration:none;font-size:14.5px;line-height:1.3;color:var(--ink)}
.menu a small{display:block;font-size:12.5px;color:var(--ink3);margin-top:2px;font-weight:400}
@media (hover:hover){.menu a:hover{background:var(--card)}}
.menu a[aria-current="page"]{background:var(--inset);font-weight:600}
.menu-wide{width:640px;display:grid;grid-template-columns:minmax(0,1fr) 220px;gap:10px;padding:12px}
.menu-wide .grid{display:grid;grid-template-columns:1fr 1fr;gap:0 4px}
.menu-wide .n{font-family:var(--serif);font-variation-settings:"opsz" 20;font-size:17px;font-weight:430;letter-spacing:-.005em}
.menu-aside{background:var(--card);border-radius:var(--r2);padding:14px;display:flex;flex-direction:column;gap:10px;font-size:13.5px;line-height:1.45;color:var(--ink2)}
.menu-aside a{padding:0;border-radius:0}
.menu-aside .tel{font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums}
.menu-aside .ba{margin-top:auto;display:block;padding:10px 12px;margin-left:-4px;margin-right:-4px;background:var(--raised);border-radius:var(--r2);box-shadow:var(--shadow)}
.menu-right{left:auto;right:-8px}

.theme{flex:none;width:38px;height:38px;border-radius:var(--r2);border:0;background:transparent;display:grid;place-items:center;cursor:pointer;color:var(--ink2)}
@media (hover:hover){.theme:hover{background:var(--card);color:var(--ink)}}
.hdr .cta{flex:none}
.menu-btn{display:none}

/* mobile menu sheet */
.msheet{position:fixed;inset:0;z-index:70;display:none}
.msheet.open{display:block}
.msheet .scrim{position:absolute;inset:0;background:var(--scrim);animation:fade .18s ease}
.msheet .panel{position:absolute;top:0;right:0;width:min(400px,100%);height:100%;background:var(--page);padding:10px 20px 28px;display:flex;flex-direction:column;overflow:auto;overscroll-behavior:contain;box-shadow:var(--shadow-lg);animation:sheetIn .2s var(--ease)}
@keyframes sheetIn{from{transform:translateX(24px);opacity:0}}
.msheet .top{display:flex;justify-content:space-between;align-items:center;height:56px;margin-bottom:6px}
.msheet .close{width:44px;height:44px;margin-right:-8px;border:0;background:transparent;border-radius:var(--r2);font-size:28px;line-height:1;cursor:pointer;color:var(--ink2)}
.msheet nav>ul{list-style:none;border-top:1px solid var(--rule)}
.msheet nav>ul>li{border-bottom:1px solid var(--rule)}
.msheet summary,.msheet .lone{display:flex;justify-content:space-between;align-items:center;padding:13px 0;font-family:var(--serif);font-variation-settings:"opsz" 24;font-size:22px;font-weight:400;letter-spacing:-.008em;text-decoration:none;cursor:pointer;list-style:none}
.msheet summary::-webkit-details-marker{display:none}
.msheet summary svg{color:var(--ink3);transition:transform .16s}
.msheet details[open] summary svg{transform:rotate(180deg)}
.msheet details ul{list-style:none;padding:0 0 12px;display:grid;grid-template-columns:1fr;gap:0}
.msheet details a{display:block;padding:8px 0;font-size:15.5px;text-decoration:none;color:var(--ink2)}
.msheet details a[aria-current="page"],.msheet .lone[aria-current="page"]{color:var(--ink);font-weight:600}
.msheet .acts{display:grid;gap:8px;margin-top:20px}
.msheet .acts .btn{width:100%;height:48px}
.msheet .nap{margin-top:20px;font-size:13.5px;line-height:1.5;color:var(--ink3)}

/* sticky phone action bar */
.actbar{display:none}

/* =====================================================================
   PAGE HEADERS + BREADCRUMB
   ===================================================================== */
.crumbs{font-size:13px;color:var(--ink3)}
.crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:4px 0;align-items:center}
.crumbs li{display:flex;align-items:center}
.crumbs li+li::before{content:"";width:5px;height:5px;margin:0 10px;border-top:1.2px solid var(--rule2);border-right:1.2px solid var(--rule2);transform:rotate(45deg)}
.crumbs a{text-decoration:none;color:var(--ink2)}
@media (hover:hover){.crumbs a:hover{color:var(--ink);text-decoration:underline;text-underline-offset:3px}}
.crumbs [aria-current="page"]{color:var(--ink3)}

.phead{padding:44px 0 40px;border-bottom:1px solid var(--rule)}
.phead .h1{margin-top:22px;max-width:18ch}
.phead .lede{margin-top:16px}
.phead-acts{margin-top:26px;display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center}
.phead-acts .tel{font-weight:600;text-decoration:none;font-variant-numeric:tabular-nums}
/* variant: procedure, with the what-to-expect label */
.expect{margin-top:32px;display:grid;grid-template-columns:repeat(var(--cols,3),minmax(0,1fr));background:var(--raised);border-radius:var(--r2);box-shadow:var(--shadow);max-width:940px}
.expect div{padding:14px 20px 15px;min-width:0}
.expect div+div{border-left:1px solid var(--rule)}
.expect dt{font-size:12px;font-weight:600;letter-spacing:.02em;color:var(--ink3)}
.expect dd{margin-top:4px;font-family:var(--serif);font-variation-settings:"opsz" 20;font-size:18px;font-weight:420;line-height:1.28;letter-spacing:-.005em}
.expect dd small{display:block;font-family:var(--sans);font-size:13px;font-weight:400;color:var(--ink2);margin-top:3px;letter-spacing:0;line-height:1.4}
/* variant: split, statement + framed object (56/44) */
.phead-split .wrap{display:grid;grid-template-columns:56fr 44fr;gap:56px;align-items:end}
/* variant: document */
.phead-doc{padding:36px 0 32px}
.phead-doc .h1{font-size:44px;max-width:22ch}

/* =====================================================================
   SECTIONS / LAYOUT
   ===================================================================== */
.sec{padding:112px 0}
.sec-tight{padding:80px 0}
.sec-rule{border-top:1px solid var(--rule)}
.sec-head{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:32px}
.split{display:grid;grid-template-columns:56fr 44fr;gap:72px;align-items:start}

/* procedure / document layout: sticky rail + column */
.doc{display:grid;grid-template-columns:240px minmax(0,1fr);gap:72px;align-items:start;padding-top:48px;padding-bottom:112px}
.rail{position:sticky;top:calc(var(--hdr) + 24px);display:flex;flex-direction:column;gap:24px}
.doc-main{min-width:0;max-width:760px}
.doc-main>section{padding:48px 0;border-top:1px solid var(--rule)}
.doc-main>section:first-child{padding-top:0;border-top:0}
.doc-main>section>.h2-sm+*{margin-top:18px}

/* in-page contents */
.toc .lbl{display:block;margin-bottom:8px}
.toc ol{list-style:none;border-left:1px solid var(--rule)}
.toc a{display:block;padding:6px 0 6px 14px;margin-left:-1px;border-left:1.5px solid transparent;font-size:14px;line-height:1.35;color:var(--ink2);text-decoration:none;transition:color .12s,border-color .12s}
@media (hover:hover){.toc a:hover{color:var(--ink)}}
.toc a[aria-current="true"]{color:var(--ink);font-weight:600;border-left-color:var(--ink)}

/* prose */
.prose{font-size:16.5px;line-height:1.62;color:var(--ink2);max-width:66ch}
.prose>*+*{margin-top:14px}
.prose h3{font-family:var(--serif);font-variation-settings:"opsz" 22;font-weight:450;font-size:21px;line-height:1.25;color:var(--ink);letter-spacing:-.006em;margin-top:28px}
.prose strong{color:var(--ink);font-weight:600}
.prose ul{padding-left:0;list-style:none}
.prose ul li{position:relative;padding-left:20px;margin-top:6px}
.prose ul li::before{content:"";position:absolute;left:3px;top:.72em;width:6px;height:1.5px;background:var(--ink3)}
.prose a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--rule2);text-underline-offset:3px}
.prose .first{font-size:18px;line-height:1.55;color:var(--ink)}

/* =====================================================================
   SIGNATURE COMPONENTS
   ===================================================================== */
/* the mat: 1 px inner rule inset 7 px */
.mat{border:1px solid var(--rule2)}

/* credential frame */
.dips{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
.dip{aspect-ratio:4/3;background:linear-gradient(155deg,#4A4035 0%,#2A2620 38%,#1B1814 100%);padding:9px;border-radius:1px;display:flex;box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 1px 2px rgba(40,25,10,.25),0 6px 12px -6px rgba(40,25,10,.3),0 22px 40px -20px rgba(40,25,10,.55)}
.dip>.mat{flex:1;background:var(--raised);padding:10px;display:flex;border:0;box-shadow:inset 0 2px 5px rgba(40,25,10,.22)}
.dip .leaf{flex:1;position:relative;border:1px solid var(--rule2);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:18px 26px 22px;gap:8px}
.dip .conf{font-family:var(--serif);font-variation-settings:"opsz" 22;font-weight:420;font-size:19px;line-height:1.22;letter-spacing:-.006em;text-wrap:balance}
.dip .inst{font-size:13.5px;font-weight:600;line-height:1.4;color:var(--ink2);letter-spacing:.01em;text-wrap:balance}
.dip .fact{font-size:12.5px;color:var(--ink3)}
.dseal{position:absolute;left:14px;bottom:12px;color:var(--g300)}
.dip.board{grid-column:1/-1;aspect-ratio:auto;background:linear-gradient(155deg,#2E5A46 0%,#112A20 45%,#0B1D16 100%)}
.dip.board .leaf{border-color:var(--g300);padding:30px 40px 34px;min-height:200px}
.dip.board .conf{font-size:15px;font-weight:600;font-family:var(--sans);color:var(--seal);letter-spacing:.06em}
.dip.board .inst{font-family:var(--serif);font-variation-settings:"opsz" 36;font-weight:380;font-size:32px;line-height:1.12;letter-spacing:-.014em;color:var(--ink)}
.dip.board .dseal{width:34px;height:34px;left:18px;bottom:16px;color:var(--seal)}
.dip.board .chk{position:absolute;right:18px;bottom:16px;font-size:13px}
.dip.compact{aspect-ratio:auto}
.dip.compact .leaf{padding:16px 18px 30px;min-height:0}
:root[data-theme="dark"] .dip{box-shadow:0 0 0 1px var(--rule2),0 16px 32px -16px rgba(0,0,0,.8)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .dip{box-shadow:0 0 0 1px var(--rule2),0 16px 32px -16px rgba(0,0,0,.8)}}

/* procedure register */
.reg{list-style:none;border-top:1px solid var(--ink)}
.reg li{border-bottom:1px solid var(--rule)}
.reg a{display:grid;grid-template-columns:190px minmax(0,1fr) 172px 16px;align-items:baseline;gap:20px;padding:10px 12px;min-height:52px;text-decoration:none;border-radius:var(--r1);transition:background-color .12s}
.reg .n{font-family:var(--serif);font-variation-settings:"opsz" 22;font-size:19px;font-weight:420;letter-spacing:-.008em;line-height:1.2}
.reg .d{font-size:14px;line-height:1.45;color:var(--ink2)}
.reg .m{font-size:12.5px;color:var(--ink3);white-space:nowrap;text-align:right}
.reg svg{color:var(--ink3);align-self:center}
@media (hover:hover){.reg a:hover{background:var(--card)}.reg a:hover svg{color:var(--ink)}}
.reg a.is-hover{background:var(--card)}
.reg a[aria-current="page"],.reg a.is-sel{background:var(--inset)}
.reg a[aria-current="page"] .n,.reg a.is-sel .n{font-weight:560}
.reg a:focus-visible{outline:0;box-shadow:inset 0 0 0 2px var(--act-text)}
.reg-compact a{grid-template-columns:minmax(0,1fr) auto 16px}
.reg-compact .d{display:none}

/* review pull quote + quote list */
.pull{background:var(--card);border-radius:var(--r1);padding:8px;margin:0}
.pull .mat{padding:28px 28px 22px}
.pull blockquote{font-family:var(--serif);font-variation-settings:"opsz" 28;font-weight:370;font-size:25px;line-height:1.3;letter-spacing:-.01em}
.pull cite,.quotes cite{display:block;margin-top:16px;font-style:normal;font-size:13px;color:var(--ink3)}
.pull cite b,.quotes cite b{color:var(--ink);font-weight:600}
.quotes{display:grid;grid-template-columns:1fr 1fr;gap:0 36px;border-top:1px solid var(--ink)}
.quotes figure{padding:14px 0 15px;border-bottom:1px solid var(--rule)}
.quotes blockquote{font-size:14.5px;line-height:1.5;color:var(--ink)}
.quotes cite{margin-top:8px}

/* timeline rows (stages, recovery): past / now / next */
.tl{list-style:none;border-top:1px solid var(--rule2)}
.tl li{display:grid;grid-template-columns:150px 1fr;gap:24px;padding:14px;border-bottom:1px solid var(--rule)}
.tl time,.tl .when{font-family:var(--serif);font-variation-settings:"opsz" 22;font-size:19px;font-weight:420;font-variant-numeric:tabular-nums lining-nums;line-height:1.25;letter-spacing:-.005em}
.tl .when small,.tl time small{display:block;font-family:var(--sans);font-size:12px;font-weight:500;color:var(--ink3);letter-spacing:0;margin-top:2px}
.tl h3{font-size:16px;font-weight:600;line-height:1.35;font-family:var(--sans)}
.tl p{font-size:14.5px;color:var(--ink2);line-height:1.5;margin-top:3px}
.tl li.past{color:var(--ink3)}
.tl li.past h3,.tl li.past .when,.tl li.past time{color:var(--ink3)}
.tl li.past .when::before,.tl li.past time::before{content:"";display:inline-block;width:8px;height:4px;border-left:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(-45deg);margin-right:9px;vertical-align:4px}
.tl li.cur{background:var(--act-soft);border-radius:var(--r1);border-bottom-color:transparent;box-shadow:inset 0 0 0 1px var(--g300)}
.tl li.cur .when::before,.tl li.cur time::before{content:"";display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--seal);box-shadow:0 0 0 2px var(--act-soft),0 0 0 3px var(--seal);margin-right:9px;vertical-align:2px}
.tl li.cur .when::after,.tl li.cur time::after{content:"Now";display:block;font:600 11.5px var(--sans);letter-spacing:.04em;color:var(--seal);margin-top:2px}
.tl li.next .when,.tl li.next time{color:var(--ink)}
.tframe{background:var(--card);padding:9px;border-radius:var(--r1);box-shadow:var(--shadow)}
.tframe>.mat{background:var(--raised);padding:18px 18px 10px}
.tframe .k{font-size:12px;font-weight:600;letter-spacing:.02em;color:var(--seal);margin:0 0 10px 14px}

/* callout / notice */
.notice{display:grid;grid-template-columns:18px 1fr;gap:12px;padding:14px 16px;border-radius:var(--r2);background:var(--card);font-size:14.5px;line-height:1.5;color:var(--ink2)}
.notice svg{margin-top:2px;color:var(--ink3)}
.notice b,.notice strong{color:var(--ink);font-weight:600}
.notice-key{background:var(--act-soft);color:var(--ink)}
.notice-key svg{color:var(--seal)}
.notice-err{background:var(--err-soft);color:var(--ink)}
.notice-err svg{color:var(--err)}
.notice-framed{background:var(--raised);padding:8px;display:block;box-shadow:var(--shadow);border-radius:var(--r1)}
.notice-framed>.mat{display:grid;grid-template-columns:18px 1fr;gap:12px;padding:14px 16px}

/* accordion */
.acc{border-top:1px solid var(--ink)}
.acc details{border-bottom:1px solid var(--rule)}
.acc summary{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:16px 4px;cursor:pointer;list-style:none;font-family:var(--serif);font-variation-settings:"opsz" 20;font-size:19px;font-weight:420;line-height:1.3;letter-spacing:-.005em;border-radius:var(--r1)}
.acc summary::-webkit-details-marker{display:none}
.acc summary::after{content:"";flex:none;width:9px;height:9px;border-right:1.5px solid var(--ink3);border-bottom:1.5px solid var(--ink3);transform:translateY(-3px) rotate(45deg);transition:transform .16s ease}
.acc details[open] summary::after{transform:translateY(2px) rotate(-135deg)}
@media (hover:hover){.acc summary:hover{background:var(--card)}}
.acc summary:focus-visible{outline:0;box-shadow:inset 0 0 0 2px var(--act-text)}
.acc .a{padding:0 4px 20px;font-size:15.5px;line-height:1.6;color:var(--ink2);max-width:62ch}
.acc .a>*+*{margin-top:10px}

/* tabs */
.tabs [role="tablist"]{display:flex;gap:2px;border-bottom:1px solid var(--rule2);overflow-x:auto;scrollbar-width:none}
.tabs [role="tab"]{position:relative;flex:none;height:44px;padding:0 14px;border:0;background:transparent;font-size:14.5px;font-weight:600;color:var(--ink2);cursor:pointer;border-radius:var(--r2) var(--r2) 0 0}
@media (hover:hover){.tabs [role="tab"]:hover{color:var(--ink);background:var(--card)}}
.tabs [role="tab"][aria-selected="true"]{color:var(--ink)}
.tabs [role="tab"][aria-selected="true"]::after{content:"";position:absolute;left:10px;right:10px;bottom:-1px;height:2px;background:var(--ink)}
.tabs [role="tab"]:focus-visible{outline:0;box-shadow:inset 0 0 0 2px var(--act-text)}
.tabs [role="tabpanel"]{padding:20px 2px 4px}

/* tables */
.tbl{width:100%;border-collapse:collapse;font-size:14.5px;line-height:1.45}
.tbl caption{text-align:left;font-size:12px;font-weight:600;letter-spacing:.02em;color:var(--ink3);padding-bottom:10px}
.tbl th{text-align:left;font-size:12.5px;font-weight:600;letter-spacing:.02em;color:var(--ink3);padding:10px 14px;border-bottom:1px solid var(--ink);vertical-align:bottom}
.tbl td{padding:13px 14px;border-bottom:1px solid var(--rule);vertical-align:top;color:var(--ink2)}
.tbl th:first-child,.tbl td:first-child{padding-left:4px}
.tbl tbody th{font-family:var(--serif);font-variation-settings:"opsz" 20;font-size:18px;font-weight:430;letter-spacing:-.005em;color:var(--ink);border-bottom:1px solid var(--rule);vertical-align:top;padding:12px 14px 12px 4px}
.tbl .num{text-align:right;font-variant-numeric:tabular-nums}
@media (hover:hover){.tbl tbody tr:hover td,.tbl tbody tr:hover th{background:var(--card)}}
.tbl tr.is-hover td,.tbl tr.is-hover th{background:var(--card)}
.tbl tr.is-sel td,.tbl tr.is-sel th{background:var(--inset)}

/* facts list (wall label) */
.facts{border-top:1px solid var(--ink)}
.facts>div{display:grid;grid-template-columns:130px 1fr;gap:16px;padding:11px 0;border-bottom:1px solid var(--rule);font-size:14.5px;line-height:1.45}
.facts dt{font-size:12.5px;font-weight:600;color:var(--ink3);letter-spacing:.02em;padding-top:2px}
.facts dd a{font-weight:600;text-decoration:none}
@media (hover:hover){.facts dd a:hover{text-decoration:underline}}

/* framed card (slip): referral slip, booking frame, pay frame */
.slip{background:var(--card);padding:9px;border-radius:var(--r1);box-shadow:var(--shadow)}
.slip>.mat{position:relative;background:var(--raised);padding:22px 26px 44px}
.slip .k{font-size:12px;font-weight:600;letter-spacing:.02em;color:var(--seal)}
.slip .dseal{left:16px;bottom:13px;color:var(--seal)}
.slip-nums{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:12px;padding-bottom:16px;border-bottom:1px dashed var(--rule2)}
.slip-nums span{display:block;font-size:12.5px;color:var(--ink3)}
.slip-nums b,.slip-nums a{font-family:var(--serif);font-variation-settings:"opsz" 40;font-weight:380;font-size:34px;line-height:1.1;letter-spacing:-.01em;font-variant-numeric:tabular-nums lining-nums;text-decoration:none;white-space:nowrap}
.slip-nums a{font-size:26px;color:var(--ink2)}
.slip dl>div{display:grid;grid-template-columns:120px 1fr;gap:14px;padding:9px 0;border-bottom:1px solid var(--rule);font-size:14px;line-height:1.45}
.slip dt{font-size:12.5px;font-weight:600;color:var(--ink3)}

/* booking frame (end of procedure pages / rail) */
.bookf{background:var(--card);padding:8px;border-radius:var(--r1);box-shadow:var(--shadow)}
.bookf>.mat{position:relative;background:var(--raised);padding:20px 20px 18px;border-color:var(--g300)}
.bookf .k{font-size:12px;font-weight:600;letter-spacing:.02em;color:var(--seal)}
.bookf h2,.bookf h3{margin-top:6px;font-family:var(--serif);font-variation-settings:"opsz" 24;font-weight:400;font-size:23px;line-height:1.16;letter-spacing:-.01em}
.bookf p{margin-top:8px;font-size:14px;line-height:1.5;color:var(--ink2)}
.bookf .btn{margin-top:16px;width:100%}
.bookf .tel{display:block;margin-top:12px;font-size:14px;color:var(--ink2);text-align:center}
.bookf .tel a{font-weight:600;color:var(--ink);text-decoration:none;font-variant-numeric:tabular-nums}
.bookf-wide>.mat{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 40px;align-items:center;padding:28px 32px}
.bookf-wide .btn{margin-top:0;width:auto}
.bookf-wide .acts{display:flex;flex-direction:column;align-items:stretch;gap:10px}
.bookf-wide .tel{margin-top:0}

/* empty state */
.empty{position:relative;border:1px dashed var(--rule2);border-radius:var(--r1);background:var(--page);padding:28px 24px 44px;display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.empty p{font-family:var(--serif);font-variation-settings:"opsz" 20;font-size:19px;line-height:1.35;color:var(--ink2);max-width:28ch}
.empty .dseal{color:var(--rule2)}

/* toast */
.toasts{position:fixed;left:50%;bottom:calc(24px + var(--bar));transform:translateX(-50%);z-index:90;display:flex;flex-direction:column;gap:8px;align-items:center;pointer-events:none}
.toast{display:inline-flex;align-items:center;gap:10px;padding:11px 16px;border-radius:var(--r2);background:var(--ink);color:var(--page);font-size:14px;font-weight:500;box-shadow:var(--shadow-lg);animation:toastIn .18s var(--ease);pointer-events:auto}
.toast svg{color:var(--g100)}
:root[data-theme="dark"] .toast svg{color:var(--g700)}
.toast.out{opacity:0;transform:translateY(6px);transition:opacity .18s,transform .18s}
@keyframes toastIn{from{opacity:0;transform:translateY(8px) scale(.98)}}
.toasts.static{position:static;transform:none;align-items:flex-start}

/* =====================================================================
   CONSULT NOTE (arch chart) · static first frame; the moment script makes it work
   ===================================================================== */
.mo-wrap{container-type:inline-size}
.mo{background:var(--card);border-radius:var(--r3);padding:40px 40px 36px;display:grid;grid-template-columns:250px minmax(0,1fr) 330px;gap:36px;align-items:stretch;position:relative}
.mo-intro{display:flex;flex-direction:column}
.mo-intro .h2{font-size:32px;line-height:1.1;margin-top:8px}
.mo-intro .body{margin-top:14px;font-size:15.5px}
.mo-intro .go{margin-top:18px}
.mo-label{margin-top:auto;padding-top:22px;font-size:12.5px;line-height:1.45;color:var(--ink3);display:flex;gap:8px}
.mo-label svg{flex:none;margin-top:2px}
.chart{display:grid;grid-template-columns:1fr;gap:4px;align-content:center;position:relative;max-width:430px;width:100%;justify-self:center}
.arch{position:relative;margin:0}
.arch svg{width:100%;height:auto;overflow:visible;display:block;touch-action:manipulation}
.arch figcaption{position:absolute;left:0;right:0;top:50%;text-align:center;font-size:12px;font-weight:600;color:var(--ink3);letter-spacing:.02em;pointer-events:none}
.arch.lower figcaption{top:auto;bottom:30%}
.tooth rect{fill:var(--raised);stroke:var(--ink2);stroke-width:1.1;transition:fill .16s ease,stroke .16s ease}
.tooth text{font:600 9.5px var(--sans);fill:var(--ink3);text-anchor:middle;dominant-baseline:central;font-variant-numeric:tabular-nums;pointer-events:none;transition:fill .16s}
.tooth.on rect{fill:var(--act);stroke:var(--act)}
.tooth.on text{fill:var(--ink)}
.tooth.gap:not(.on) rect{fill:transparent;stroke-dasharray:3 2.4;stroke:var(--ink)}
.sides{display:flex;align-items:center;gap:10px;margin:2px 0;font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--ink3)}
.sides i{flex:1;border-top:1px dashed var(--rule2)}
.mo-out{position:relative;display:flex;flex-direction:column}
.mo-frame{position:relative;height:100%;background:var(--raised);border-radius:var(--r1);box-shadow:var(--shadow);padding:8px;display:flex}
.mo-frame>.mat{flex:1;background:var(--raised);border-color:var(--g300);padding:18px 20px}
.mo-frame .k{font-size:12px;font-weight:600;letter-spacing:.02em;color:var(--seal)}
.mo-frame h3{margin-top:6px;font-family:var(--serif);font-variation-settings:"opsz" 28;font-weight:400;font-size:26px;line-height:1.12;letter-spacing:-.012em}
.mo-frame .desc{margin-top:6px;font-size:14px;line-height:1.45;color:var(--ink2)}
.mo-frame .alt{margin-top:4px;font-size:13px;color:var(--ink3)}
.mo-frame dl{margin-top:14px;border-top:1px solid var(--rule)}
.mo-frame dt{font-size:12px;font-weight:600;letter-spacing:.02em;color:var(--ink3);margin-top:12px}
.mo-frame ol{list-style:none;margin-top:4px}
.mo-frame ol li{display:grid;grid-template-columns:18px 1fr;gap:6px;font-size:13.5px;line-height:1.4;padding:3px 0;color:var(--ink2)}
.mo-frame ol li b{color:var(--ink);font-weight:600}
.mo-frame ol li em{font-style:normal;font-variant-numeric:tabular-nums;color:var(--ink3);font-size:12.5px;padding-top:1px}
.mo-frame .anes{margin-top:5px;display:flex;flex-wrap:wrap;gap:5px}
.mo-frame .anes span{font-size:12.5px;padding:3px 8px;border-radius:var(--r1);background:var(--card);color:var(--ink2)}
.mo-frame .noted{margin-top:16px;padding-top:12px;border-top:1px solid var(--rule);font-size:13px;color:var(--ink2)}
.mo-frame .noted b{color:var(--ink)}
.mo-frame .btn{margin-top:12px;width:100%}
@container (max-width:1060px){
  .mo{grid-template-columns:minmax(0,1fr) minmax(0,1fr);padding:32px}
  .mo-intro{grid-column:1/-1}
  .mo-label{margin-top:12px;padding-top:12px}
}
@container (max-width:620px){
  .mo{grid-template-columns:1fr;padding:22px 16px 18px;gap:18px;border-radius:var(--r2)}
  .mo-intro .h2{font-size:28px}
}

/* 3D explainer slot (poster first; the 3D agent fills it) */
.x3d{position:relative;background:var(--inset);border-radius:var(--r3);overflow:hidden;box-shadow:inset 0 1px 2px rgba(40,30,15,.12)}
.x3d-stage{position:relative;aspect-ratio:16/10;display:grid;place-items:center}
.x3d-stage svg{width:min(78%,520px);height:auto;overflow:visible}
.x3d-stage .p-line{stroke:var(--ink2);fill:none;stroke-width:1.3}
.x3d-stage .p-fill{fill:var(--raised);stroke:var(--ink2);stroke-width:1.3}
.x3d-stage .p-bone{fill:var(--card);stroke:var(--rule2)}
.x3d-stage .p-gum{fill:var(--rule);stroke:none}
.x3d-stage .p-act{fill:var(--act-soft);stroke:var(--seal);stroke-width:1.4}
.x3d-stage .p-lbl{font:italic 400 14px var(--serif);fill:var(--ink2)}
.x3d-stage .p-tick{stroke:var(--ink3);stroke-width:1}
.x3d-bar{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:14px 18px;background:var(--card);border-top:1px solid var(--rule)}
.x3d-bar p{font-size:13.5px;line-height:1.45;color:var(--ink2)}

/* =====================================================================
   FOOTER
   ===================================================================== */
.foot{background:var(--card);padding:64px 0 40px;font-size:14px;color:var(--ink2)}
.foot .top{display:grid;grid-template-columns:4fr 8fr;gap:72px}
.foot .nap{margin-top:18px;max-width:32ch;line-height:1.6}
.foot .nap a{text-decoration:none;font-weight:600;color:var(--ink)}
.foot .towns{font-family:var(--serif);font-size:19px;line-height:1.55;color:var(--ink);font-weight:380}
.foot .towns i{font-style:normal;color:var(--rule2);margin:0 8px}
.foot .cols{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-top:40px}
.foot h2,.foot h3{font-family:var(--sans);font-size:12.5px;font-weight:600;color:var(--ink3);letter-spacing:.02em;margin-bottom:8px;line-height:1.4}
.foot ul{list-style:none}
.foot li{padding:3px 0}
.foot a{text-decoration:none}
.foot button.as-link{background:none;border:0;padding:0;cursor:pointer;font-size:14px;color:inherit;text-align:left}
@media (hover:hover){.foot a:hover,.foot button.as-link:hover{color:var(--ink);text-decoration:underline;text-underline-offset:3px}}
.foot .base{margin-top:48px;padding-top:18px;border-top:1px solid var(--rule2);display:flex;justify-content:space-between;gap:12px 20px;font-size:12.5px;color:var(--ink3);flex-wrap:wrap}
.foot .base a{text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--rule2)}

/* =====================================================================
   DIALOGS (native <dialog>; built by site.js on first use)
   ===================================================================== */
dialog.dlg{position:fixed;inset:0;margin:auto;padding:0;border:0;background:transparent;color:var(--ink);width:min(720px,calc(100% - 48px));max-width:none;max-height:calc(100svh - 48px);overflow:visible}
dialog.dlg-sm{width:min(480px,calc(100% - 48px))}
dialog.dlg::backdrop{background:var(--scrim);animation:fade .18s ease}
dialog.dlg[open] .box{animation:dlgIn .18s var(--ease)}
.dlg .box{position:relative;max-height:calc(100svh - 48px);background:var(--raised);border-radius:var(--r3);box-shadow:var(--shadow-lg);display:flex;flex-direction:column;overflow:hidden}
@keyframes dlgIn{from{opacity:0;transform:scale(.96)}}
@keyframes fade{from{opacity:0}}
dialog.dlg.instant[open] .box,dialog.dlg.instant::backdrop{animation:none}
.dlg header{display:flex;justify-content:space-between;align-items:start;gap:16px;padding:22px 24px 16px;border-bottom:1px solid var(--rule)}
.dlg h2{font-family:var(--serif);font-variation-settings:"opsz" 28;font-weight:400;font-size:26px;letter-spacing:-.012em;line-height:1.15}
.dlg header p{font-size:13.5px;color:var(--ink2);margin-top:4px}
.dlg .x{width:40px;height:40px;flex:none;margin:-6px -8px 0 0;border:0;background:transparent;border-radius:var(--r2);cursor:pointer;display:grid;place-items:center;color:var(--ink2)}
@media (hover:hover){.dlg .x:hover{background:var(--card);color:var(--ink)}}
.dlg .x:focus-visible{outline:0;box-shadow:0 0 0 2px var(--act-text)}
.dlg .note{margin:16px 24px 0;padding:12px 14px;background:var(--act-soft);border-radius:var(--r2);font-size:14px;line-height:1.45;color:var(--ink)}
.dlg .note b{font-weight:600}
.dlg .note small{display:block;color:var(--ink2);font-size:12.5px;margin-top:2px}
.dlg .frame-area{margin:16px 24px 0;height:min(440px,50svh);border-radius:var(--r2);background:var(--card);position:relative;overflow:hidden}
.dlg .frame-area iframe{position:absolute;inset:0;width:100%;height:100%;border:0;background:#fff}
.dlg .loading{position:absolute;inset:0;text-align:center;line-height:1.7;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;font-size:14px;color:var(--ink2);padding:24px}
.dlg .loading .spin{width:18px;height:18px;border-radius:50%;border:2px solid var(--ink3);border-right-color:transparent;animation:sp .8s linear infinite}
.dlg .content{padding:18px 24px 4px;font-size:15px;line-height:1.55;color:var(--ink2)}
.dlg .content>*+*{margin-top:12px}
.dlg .content .big{font-family:var(--serif);font-variation-settings:"opsz" 30;font-size:28px;font-weight:380;letter-spacing:-.01em;color:var(--ink);text-decoration:none;font-variant-numeric:tabular-nums lining-nums}
.dlg footer{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:16px 24px 20px;flex-wrap:wrap}
.dlg footer .tel{font-size:14px;color:var(--ink2)}
.dlg footer .tel a{font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums;text-decoration:none}
body.locked{overflow:hidden}
/* inline (component sheet) dialog preview */
.dlg-preview{position:relative;inset:auto;display:block;width:100%;max-width:560px;margin:0}
.dlg-preview .box{animation:none}

/* dark: soften photographs a touch */
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .photo-soft{filter:brightness(.86)}}
:root[data-theme="dark"] .photo-soft{filter:brightness(.86)}

/* =====================================================================
   RESPONSIVE
   ===================================================================== */
@media (max-width:1180px){
  .nav-t{padding:0 8px;font-size:14px}
  .hdr>.wrap{gap:16px}
  .doc{grid-template-columns:200px minmax(0,1fr);gap:48px}
}
@media (max-width:1100px){
  .mainnav{display:none}
  .menu-btn{display:inline-flex}
  .theme{margin-left:auto}
  .split,.foot .top,.phead-split .wrap{grid-template-columns:1fr;gap:40px}
  .doc{grid-template-columns:1fr;gap:0}
  .rail{position:static;display:none}
  .rail.keep{display:flex}
  .doc-main{max-width:none}
}
@media (max-width:760px){
  :root{--gut:16px;--hdr:60px;--bar:68px}
  body{font-size:15.5px}
  .util{display:none}
  .hdr .cta{display:none}
  .hdr>.wrap{gap:6px}
  .brand b{font-size:21px}
  .brand .wm span{font-size:10.5px}
  .display{font-size:40px;line-height:1.04}
  .h1,.phead-doc .h1{font-size:36px;line-height:1.06}
  .h2{font-size:32px}
  .h2-sm{font-size:26px}
  .lede{font-size:16.5px}
  .sec{padding:72px 0}
  .sec-tight{padding:60px 0}
  .sec-head{flex-direction:column;align-items:start;gap:12px}
  .phead{padding:24px 0 32px}
  .phead .h1{margin-top:16px}
  .expect{grid-template-columns:1fr}
  .expect div+div{border-left:0;border-top:1px solid var(--rule)}
  .expect div{padding:12px 16px}
  .doc{padding-top:8px;padding-bottom:72px}
  .doc-main>section{padding:40px 0}
  .dips{grid-template-columns:1fr;gap:18px}
  .dip{aspect-ratio:auto;padding:7px}
  .dip>.mat{padding:7px}
  .dip .leaf{min-height:150px;padding:20px 20px 30px}
  .dip.board .inst{font-size:24px}
  .dip.board .leaf{padding:22px 18px 52px}
  .dip.board .chk{right:auto;left:50%;transform:translateX(-50%);white-space:nowrap}
  .dip.board .dseal{width:26px;height:26px;left:12px;bottom:12px}
  .reg a{grid-template-columns:1fr 16px;gap:2px 12px;padding:14px 6px}
  .reg .n{grid-column:1}.reg .d{grid-column:1;grid-row:2}.reg .m{grid-column:1;grid-row:3;text-align:left;white-space:normal}
  .reg svg{grid-column:2;grid-row:1/4}
  .quotes{grid-template-columns:1fr}
  .pull blockquote{font-size:21px}
  .pull .mat{padding:20px}
  .tl li{grid-template-columns:1fr;gap:4px;padding:12px 8px}
  .tl .when small,.tl time small{display:inline;margin-left:8px}
  .tl .when,.tl time{font-size:17px}
  .facts>div,.slip dl>div{grid-template-columns:1fr;gap:2px}
  .slip-nums{grid-template-columns:1fr;gap:10px}
  .slip>.mat{padding:18px 16px 40px}
  .slip-nums b{font-size:30px}
  .bookf-wide>.mat{grid-template-columns:1fr;padding:20px}
  .bookf-wide .btn{width:100%}
  .tbl-stack thead{display:none}
  .tbl-stack tr{display:block;border-bottom:1px solid var(--rule);padding:12px 0}
  .tbl-stack tbody th,.tbl-stack td{display:block;border:0;padding:3px 4px}
  .tbl-stack td[data-l]::before{content:attr(data-l);display:block;font-size:12px;font-weight:600;color:var(--ink3);letter-spacing:.02em;margin-top:6px}
  .foot{padding:48px 0 32px}
  .foot .cols{grid-template-columns:1fr 1fr;gap:24px 16px}
  .foot .towns{font-size:17px}
  dialog.dlg,dialog.dlg-sm{width:100%;max-width:100%;max-height:92svh;margin:auto 0 0}
  dialog.dlg .box{max-height:92svh;border-radius:var(--r3) var(--r3) 0 0;padding-bottom:env(safe-area-inset-bottom)}
  @keyframes dlgIn{from{opacity:0;transform:translateY(24px)}}
  .dlg header{padding:18px 16px 14px}
  .dlg .note,.dlg .frame-area{margin-left:16px;margin-right:16px}
  .dlg .content{padding:16px 16px 4px}
  .dlg footer{padding:14px 16px 18px}
  .dlg footer .btn{flex:1 1 100%}
  /* the phone action bar: Schedule · Call (68 px + safe area) */
  .actbar{display:grid;grid-template-columns:1fr 1fr;gap:8px;position:fixed;left:0;right:0;bottom:0;z-index:35;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:var(--raised);box-shadow:0 -1px 0 var(--rule),0 -10px 24px -14px rgba(40,25,10,.3)}
  .actbar .btn{height:48px;font-size:15px;padding:0 12px}
  body.locked .actbar{visibility:hidden}
  .actbar{transition:transform .2s var(--ease)}
  .actbar.away{transform:translateY(110%)}
  .toasts{bottom:calc(16px + var(--bar))}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .btn .spin,.dlg .loading .spin{animation-duration:1.6s!important;animation-iteration-count:infinite!important}
}
@media print{
  .util,.hdr,.actbar,.foot,.rail,.msheet{display:none!important}
  body{background:#fff;color:#000;padding:0}
}