/* Google Fonts files (Lora v37, Source Sans 3 v20, latin), self-hosted so WordPress renders exactly like the approved static build. */
@font-face{font-family:'Lora';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/lora-latin-variable.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Lora';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/lora-latin-variable.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Source Sans 3';font-style:normal;font-weight:300;font-display:swap;src:url('../fonts/source-sans-3-latin-variable.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Source Sans 3';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/source-sans-3-latin-variable.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Source Sans 3';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/source-sans-3-latin-variable.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* ============================================================
   YUANLING ACUPUNCTURE : Design tokens (from Design Kit)
   Layout uses FLEX ONLY. No CSS grid. Elementor-mappable.
   ============================================================ */
:root{
  --deep-navy:#16305C;
  --navy:#1B3A6B;
  --gold:#C0902F;
  --gold-light:#E4C77C;
  --paper:#FBF9F5;
  --sand:#F3EEE2;
  --line:#E3DDD0;
  --hero-sand:#EDE1D0;   /* hero field, desktop : sampled from the treatment room wall */
  --hero-indigo:#0C1D38; /* hero field, mobile */
  --leaf-dark:#164700;   /* deep green of the leaf outlines in the logo */
  --leaf-ink:#0F3300;    /* near-black green used for labels on --leaf-mid */
  --clay:#C49A6C;        /* warm tan: eyebrows and headings on dark grounds */
  --clay-deep:#795548;   /* clay on paper and sand: eyebrows, rules, tile hover, stars */
  --clay-press:#5E4237;  /* darker clay for the button hover on light grounds */
  --leaf-pale:#EAF5B7;  /* pale leaf fill sampled from the logo. Service-card chips. */
  --leaf-mid:#6AA96A;    /* lighter leaf green: footer headings and button hover.
                            Headings clear AA at 4.65:1. On hover the label goes
                            #0F3300 rather than the logo green #164700, which
                            only reaches 3.87:1 on this lighter fill. */
  --body:#4A5160;
  --on-navy-body:#D7DEEA;
  --serif:'Lora',Georgia,'Times New Roman',serif;
  --sans:'Source Sans 3',-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif;
  --wrap:1120px;
  --gutter:24px;
  --sec:56px;
}
@media(min-width:900px){:root{--gutter:64px;--sec:72px}}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--body);font-family:var(--sans);font-weight:400;font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
h1,h2,h3,h4{font-family:var(--serif);font-weight:500;color:var(--navy);margin:0}
h1{font-size:40px;line-height:1.15;letter-spacing:-.01em}
h2{font-size:28px;line-height:1.25}
h3{font-size:21px;line-height:1.3}
@media(min-width:900px){h1{font-size:56px}h2{font-size:34px}}
p{margin:0 0 16px;max-width:68ch}
p:last-child{margin-bottom:0}
a{color:var(--navy);text-decoration:none}
a:hover{text-decoration:underline}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px;border-radius:2px}

/* --- structure --- */
.wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding-left:var(--gutter);padding-right:var(--gutter)}
.section{padding-top:var(--sec);padding-bottom:var(--sec)}
.band-navy{background:var(--deep-navy)}
.band-navy h2,.band-navy h3,.band-navy h1{color:#fff}
.band-navy p,.band-navy li{color:var(--on-navy-body)}

/* Closing CTA band, Sept 9: --sand, the same tint as the About and pricing
   panels, and it now inherits those panels' type colours rather than setting
   its own. Heading falls through to --navy, body to --body, links to --navy.
   Only three things are declared here: the field, the rule (--clay-deep, as on
   every other light ground) and the button ring the sand surface requires. */
.band-sand{background:var(--sand)}
.band-sand .rule{background:var(--clay-deep)}
.band-sand a.btn-leaf-solid{border-color:var(--leaf-dark)}
/* Sept 21. Secondary buttons carrying .hover-gold fill with --gold-light on
   hover. The label goes navy, matching the resting border and label, so the
   hover reads as the button filling in with its own colour rather than
   changing identity. Navy on #E4C77C is 6.84:1, passes AA for body text.
   Sand, the previous hover label, measures 1.42:1 on this gold and could not
   be kept. Applied to the hero Contact Us, the pricing panel button and the
   closing band's Contact us. The element selector gives this 0,3,1 so it
   outranks the .hero .btn-outline:hover rules further down, including the
   760px breakpoint variant, which are 0,3,0.
   The other two outline buttons, How NAET works and Read all reviews, still
   hover navy while this is evaluated. */
a.btn-outline.hover-gold:hover{background:var(--gold-light);color:var(--navy);border-color:var(--gold-light)}
.row{display:flex;flex-wrap:wrap}
.col{flex:1 1 0;min-width:0}
.gap-16{gap:16px}.gap-24{gap:24px}.gap-40{gap:28px}.gap-56{gap:28px}
@media(min-width:900px){.gap-40{gap:40px}.gap-56{gap:56px}}
.center{text-align:center}
.center p,.center .rule{margin-left:auto;margin-right:auto}
.stack{display:flex;flex-direction:column}

/* --- type helpers --- */
/* Section eyebrows, Sept 9. One hue, two weights, because a single value cannot
   clear 4.5:1 on both paper and navy. --clay-deep on light grounds (6.23:1 on
   paper, 5.66:1 on sand), --clay on dark ones (5.08:1 on navy). At 12px they
   read as the same colour. This also fixes a pre-existing failure: the design
   kit's gold measured 2.75:1 on paper. */
.eyebrow{font-size:12px;line-height:1.4;letter-spacing:.06em;text-transform:uppercase;font-weight:600;color:var(--clay-deep);margin:0 0 12px}
.band-navy .eyebrow{color:var(--clay)}
.lede{font-size:18px;line-height:1.6;color:var(--body)}
.band-navy .lede{color:var(--on-navy-body)}
.arrow-link{display:inline-block;font-size:15px;line-height:1.4;font-weight:600;color:var(--navy)}
.arrow-link:hover{text-decoration:none;color:var(--clay-deep)}
.arrow-link .ar{display:inline-block;transition:transform .18s ease}
.arrow-link:hover .ar{transform:translateX(4px)}
.band-navy .arrow-link{color:#fff}
.band-navy .arrow-link:hover{color:var(--gold-light)}
.rule{width:56px;height:2px;background:var(--clay-deep);border:0;margin:0 0 24px}
.band-navy .rule{background:var(--clay)}
.center .rule{margin-left:auto;margin-right:auto}

/* --- CONFIRM placeholder chip --- */
.confirm{display:inline-flex;align-items:center;background:#FCF1D6;border:1px dashed var(--gold);color:#7E5C10;padding:0 8px;border-radius:3px;font-size:.8em;font-weight:600;letter-spacing:.02em;white-space:nowrap;font-family:var(--sans)}
.band-navy .confirm{background:rgba(228,199,124,.16);border-color:var(--gold-light);color:var(--gold-light)}

/* --- buttons --- */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:11px 26px;border-radius:4px;font-family:var(--sans);font-size:16px;font-weight:600;line-height:1.2;text-align:center;border:1.5px solid transparent;cursor:pointer;transition:background .18s ease,color .18s ease,border-color .18s ease}
.btn:hover{text-decoration:none}
.btn-gold{background:var(--clay-deep);color:#fff;border-color:var(--clay-deep)}
.btn-gold:hover{background:var(--clay-press);color:#fff;border-color:var(--clay-press)}
.btn-outline{background:transparent;color:var(--navy);border-color:var(--navy)}
.btn-outline:hover{background:var(--navy);color:#fff}
.band-navy .btn-outline,.hero .btn-outline{color:#fff;border-color:rgba(255,255,255,.65)}
.band-navy .btn-outline:hover,.hero .btn-outline:hover{background:#fff;color:var(--deep-navy);border-color:#fff}
.btn-row{display:flex;flex-wrap:wrap;gap:16px;align-items:center}

/* --- icons --- */
.svgdefs{position:absolute;width:0;height:0;overflow:hidden}
.ico{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;flex:none}
.chip{width:40px;height:40px;border-radius:50%;background:var(--sand);color:var(--navy);display:flex;align-items:center;justify-content:center;flex:none}
.chip-outline{width:48px;height:48px;border-radius:50%;border:1.5px solid var(--gold-light);color:var(--gold-light);display:flex;align-items:center;justify-content:center;flex:none}

/* ============ HEADER ============ */
.site-header{background:var(--deep-navy);position:sticky;top:0;z-index:60}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:76px}
.brand{display:flex;align-items:center;gap:13px;flex:none}
.brand:hover{text-decoration:none}
.brand img{width:44px;height:44px}
.brand-name{font-family:var(--serif);font-weight:500;font-size:20px;line-height:1.2;color:#fff;display:block}
.brand-name{letter-spacing:.005em}
@media(max-width:359px){
  .header-inner{gap:12px}
  .brand{gap:9px}
  .brand img{width:38px;height:38px}
  .brand-name{font-size:17px}
}
.nav{display:none}
@media(min-width:1080px){
  .nav{display:flex;align-items:center;gap:26px}
  .nav-item{position:relative}
  .nav-link{display:flex;align-items:center;gap:5px;font-size:15px;font-weight:600;color:#fff;padding:26px 0;line-height:1.2}
  .nav-link:hover{text-decoration:none;color:var(--gold-light)}
  .caret{width:9px;height:9px;stroke-width:2}
  .submenu{position:absolute;top:100%;left:-16px;min-width:270px;background:#fff;border:1px solid var(--line);border-radius:4px;padding:8px 0;box-shadow:0 1px 2px rgba(22,48,92,.06);opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .16s ease,transform .16s ease,visibility .16s;list-style:none;margin:0}
  .nav-item:hover .submenu,.nav-item:focus-within .submenu{opacity:1;visibility:visible;transform:translateY(0)}
  .submenu a{display:block;padding:9px 20px;font-size:15px;color:var(--body);line-height:1.4}
  .submenu a:hover{background:var(--sand);color:var(--navy);text-decoration:none}
  .submenu .sep{height:1px;background:var(--line);margin:8px 0}
}
.header-cta{display:none}
@media(min-width:1080px){.header-cta{display:inline-flex}}
.burger{display:inline-flex;flex-direction:column;justify-content:center;gap:5px;width:48px;height:48px;padding:12px;background:transparent;border:0;cursor:pointer;margin-right:-12px}
@media(min-width:1080px){.burger{display:none}}
.burger span{display:block;height:2px;width:100%;background:#fff;border-radius:2px;transition:transform .22s ease,opacity .18s ease}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* mobile drawer */
.drawer{display:none;background:var(--deep-navy);border-top:1px solid rgba(255,255,255,.14);max-height:calc(100vh - 76px);overflow-y:auto}
.drawer.open{display:block}
@media(min-width:1080px){.drawer,.drawer.open{display:none}}
.drawer ul{list-style:none;margin:0;padding:0}
.drawer a{display:block;padding:14px 0;font-size:17px;font-weight:600;color:#fff;border-bottom:1px solid rgba(255,255,255,.12)}
.drawer a:hover{text-decoration:none;color:var(--gold-light)}
.drawer .sub a{padding:11px 0 11px 18px;font-size:15px;font-weight:400;color:var(--on-navy-body);border-bottom:1px solid rgba(255,255,255,.07)}
.drawer .grp{padding-top:16px;font-size:12px;letter-spacing:.06em;text-transform:uppercase;font-weight:600;color:var(--gold-light)}
.drawer .btn{width:100%;margin:24px 0 32px}

/* ============ HERO ============ */
/* Elementor map: Container (background = --hero-sand on desktop, --hero-indigo on mobile)
     - Container .hero-photo : background image, position right, size cover, width = height x 1.243
         + Background Overlay : linear gradient, field color 100% left to 0% at 42% (44% under 1100px)
     - Container .hero-inner : Heading, Text Editor, 2 Buttons                     */
.hero{position:relative;background:var(--hero-indigo);overflow:hidden}
.hero-photo{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden}
.hero-photo picture{display:contents}
.hero-photo img{position:absolute;top:0;left:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:center 50%}
.hero-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(12,29,56,.52) 0%,rgba(12,29,56,.70) 42%,rgba(12,29,56,.90) 100%)}
.hero-inner{position:relative;z-index:3;padding-top:72px;padding-bottom:56px;display:flex;flex-direction:column;align-items:flex-start}
.hero h1{color:#fff;max-width:14ch}
.hero .sub{color:#EEF2F8;font-size:18px;line-height:1.6;max-width:52ch;margin:20px 0 0}
.hero .btn-outline{color:#fff;border-color:rgba(255,255,255,.65)}
.hero .btn-outline:hover{background:#fff;color:var(--deep-navy);border-color:#fff}
.hero .btn-row{margin-top:32px}

/* Sept 30, hero photo #4 (space heater removed), framed like the original live
   home page: table big in the foreground with no legs, art prominent top right,
   right edge of the window with daylight at left, only a sliver of the chair.
   The photo pane takes its width from the image ratio (1600x1287), so the whole
   crop always shows at any screen width. */
@media(min-width:760px){
  .hero{background:var(--hero-sand);min-height:clamp(560px,46vw,760px);display:flex;align-items:center}
  .hero-photo{left:auto;width:auto;aspect-ratio:1600/1287}
  .hero-photo img{object-position:center}
  .hero-photo::after{background:linear-gradient(90deg,rgba(237,225,208,1) 0%,rgba(237,225,208,.9) 18%,rgba(237,225,208,.45) 30%,rgba(237,225,208,0) 44%)}
  .hero-inner{padding-top:72px;padding-bottom:72px}
  .hero h1{color:var(--navy);max-width:13ch;font-size:44px}
  .hero .sub{color:var(--body);max-width:30ch}
  .hero .btn-outline{color:var(--navy);border-color:var(--navy)}
  .hero .btn-outline:hover{background:var(--navy);color:#fff}
}
@media(min-width:1100px){
  /* Wide screens: a long eased fade (0 by 42%) so there is no hard seam and the end of the headline sits on sand, not on the photo */
  .hero-photo::after{background:linear-gradient(90deg,rgba(237,225,208,1) 0%,rgba(237,225,208,.94) 5%,rgba(237,225,208,.8) 10%,rgba(237,225,208,.58) 16%,rgba(237,225,208,.34) 23%,rgba(237,225,208,.14) 30%,rgba(237,225,208,.04) 36%,rgba(237,225,208,0) 42%)}
  .hero-inner{padding-top:88px;padding-bottom:88px}
  .hero h1{font-size:50px}
  .hero .sub{font-size:19px}
}
@media(min-width:1300px){.hero h1{font-size:54px}}
/* Oct 24: narrow-tablet contrast fix (760-899). The photo pane is a fixed 696px wide and sits right, so here the headline overlaps it.
   The sand stays solid only to just past the headline's right edge (358px, plus scrollbar allowance) and fades out over the next 50px.
   900px+ keeps the original fade. */
@media(min-width:760px) and (max-width:899px){.hero-photo::after{background:linear-gradient(90deg,rgba(237,225,208,1) 0,rgba(237,225,208,1) calc(1076px - 100vw),rgba(237,225,208,.6) calc(1096px - 100vw),rgba(237,225,208,.2) calc(1114px - 100vw),rgba(237,225,208,0) calc(1126px - 100vw))}}
/* 900-979: same treatment. Headline right edge is 398px here (wider gutter), so the solid sand ends at calc(1116px - 100vw). */
@media(min-width:900px) and (max-width:979px){.hero-photo::after{background:linear-gradient(90deg,rgba(237,225,208,1) 0,rgba(237,225,208,1) calc(1116px - 100vw),rgba(237,225,208,.6) calc(1136px - 100vw),rgba(237,225,208,.2) calc(1154px - 100vw),rgba(237,225,208,0) calc(1166px - 100vw))}}

/* ============ TRUST BAR ============ */
.trustbar{background:var(--navy)}
.trustbar .row{padding:32px 0;gap:28px 24px;justify-content:center}
.trust-item{flex:0 1 44%;max-width:210px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px}
@media(min-width:560px){.trust-item{flex:0 1 29%;max-width:200px}}
@media(min-width:1000px){.trust-item{flex:1 1 0;max-width:none}}
.trust-item span{font-size:13px;line-height:1.35;font-weight:600;color:#fff;max-width:15ch}

/* ============ generic panels/cards ============ */
.panel{background:var(--sand);border-radius:8px;padding:28px}
.insurer-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:26px 44px;margin-top:30px;padding-top:26px;border-top:1px solid #DCD4C4}
.insurer-row img{height:36px;width:auto;display:block}
@media(max-width:1099px){
  .insurer-row{gap:22px 24px;margin-top:26px;padding-top:24px}
  .insurer-row img{width:calc(50% - 12px);height:32px;object-fit:contain}
}
@media(max-width:759px){
  .insurer-row{gap:20px 24px;margin-top:24px;padding-top:22px}
  .insurer-row img{height:30px}
}
@media(min-width:900px){.panel{padding:40px}}
.card{background:#fff;border:1px solid var(--line);border-radius:4px;padding:24px}

/* list rows */
.listrow{display:flex;align-items:flex-start;gap:16px;padding:14px 0;border-bottom:1px solid var(--line)}
.listrow:last-child{border-bottom:0}
.listrow p{margin:0;font-size:17px;color:var(--navy);font-weight:400;padding-top:7px}

/* service cards */
.svc{flex:1 1 100%;display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:4px;padding:28px}
@media(min-width:820px){.svc{flex:1 1 0}}
.svc .chip-lg{width:76px;height:76px;border-radius:50%;background:var(--leaf-pale);color:var(--navy);display:flex;align-items:center;justify-content:center;margin-bottom:20px;flex:none}
.svc .chip-lg .ico{width:34px;height:34px}
.svc h3{margin-bottom:10px}
.svc p{font-size:16px;flex:1 1 auto;margin-bottom:20px}

/* condition tiles */
.tiles{display:flex;flex-wrap:wrap;gap:12px}
.tile{flex:1 1 calc(50% - 6px);display:flex;flex-direction:column;align-items:center;justify-content:flex-start;text-align:center;gap:12px;padding:24px 12px;background:#fff;border:1px solid var(--line);border-radius:4px;color:var(--navy);transition:border-color .18s ease,background .18s ease}
@media(min-width:640px){.tile{flex:1 1 calc(25% - 9px)}}
@media(min-width:1024px){.tile{flex:1 1 calc(14.28% - 11px)}}
.tile:hover{text-decoration:none;border-color:var(--clay-deep);background:var(--sand)}
.tile:hover .tile-label{color:var(--clay-deep)}
.tile .ico{width:28px;height:28px;color:var(--navy)}
.tile-label{font-size:14px;line-height:1.35;font-weight:600;color:var(--navy)}

/* reviews */
.review{flex:1 1 100%;background:#fff;border:1px solid var(--line);border-radius:4px;padding:26px;display:flex;flex-direction:column}
@media(min-width:820px){.review{flex:1 1 0}}
/* Stars stay gold. Amber is the near-universal convention for ratings, so it
   is treated as a semantic colour rather than a palette one. */
.stars{display:flex;gap:3px;margin-bottom:14px;color:var(--gold)}
.stars .ico{width:18px;height:18px;fill:var(--gold);stroke:var(--gold)}
.review blockquote{margin:0 0 18px;font-family:var(--serif);font-size:18px;line-height:1.55;color:var(--navy);flex:1 1 auto}
.review cite{font-style:normal;font-size:14px;font-weight:600;color:var(--body);letter-spacing:.02em}

/* NAP + hours */
.nap{font-size:17px;line-height:1.7;color:var(--body)}
.nap strong{display:block;font-family:var(--serif);font-size:20px;font-weight:500;color:var(--navy);margin-bottom:4px}
.hours{width:100%;border-collapse:collapse;margin-top:8px}
.hours th,.hours td{text-align:left;padding:9px 0;border-bottom:1px solid var(--line);font-size:15px}
.hours th{font-weight:600;color:var(--navy);width:42%}
.hours tr:last-child th,.hours tr:last-child td{border-bottom:0}
.map{width:100%;border:1px solid var(--line);border-radius:4px;overflow:hidden;line-height:0;background:var(--sand)}
.map iframe{width:100%;height:340px;border:0;display:block}
@media(min-width:900px){.map iframe{height:100%;min-height:440px}}

/* footer */
.site-footer{background:var(--deep-navy);color:var(--on-navy-body);font-size:15px}
.site-footer a{color:var(--on-navy-body)}
.site-footer a:hover{color:#fff}
.foot-col{flex:1 1 100%}
@media(min-width:680px){.foot-col{flex:1 1 calc(50% - 20px)}}
@media(min-width:1000px){.foot-col{flex:1 1 0}.foot-col.brandcol{flex:1.4 1 0}}
/* Footer headings, client choice Sept 9. --clay measures 5.08:1 on the navy
   footer, clear of the 4.5:1 these 12px labels need. */
.foot-h{font-size:12px;letter-spacing:.06em;text-transform:uppercase;font-weight:600;color:var(--clay);margin:0 0 16px}
/* Footer CTA, Sept 8 final: --leaf-mid fill with a --leaf-ink label.
   The fill carries the button on its own at 4.65:1 against the navy footer, so
   no border is needed at rest; the resting border matches the fill. Hover
   swaps only the border to --leaf-dark, which reads at 3.9:1 against the fill.
   Label is 5.0:1 on the fill. Border is 2px, not the button default of 1.5px:
   browsers round 1.5px down to 1px at 1x density, which made the hover ring a
   near-invisible hairline. The resting border is the same 2px in the fill
   colour, so only the colour changes on hover and the geometry never moves. */
/* Primary CTA, one component for header, drawer, hero and footer.
   Rest  : --leaf-mid fill, --leaf-ink label (5.0:1), 2px border.
   Hover : fill drops to --leaf-dark, white label at 10.9:1. The border swaps to
           --leaf-mid so the button keeps its footprint: --leaf-dark alone is
           1.2:1 on navy and the shape would otherwise dissolve on hover.
           Ring to fill is 3.9:1, gentle enough not to shimmer.
   Selectors are a.btn-leaf-solid, not .btn-leaf-solid: the footer sets
   ".site-footer a" (0,1,1), which outranks a bare class (0,1,0) and was
   repainting the footer label #D7DEEA. */
a.btn-leaf-solid{background:var(--leaf-mid);color:var(--leaf-ink);border-color:var(--leaf-mid);border-width:2px}
a.btn-leaf-solid:hover{background:var(--leaf-dark);color:#fff;border-color:var(--leaf-mid)}
.site-footer a.btn-leaf-solid{color:var(--leaf-ink)}
.site-footer a.btn-leaf-solid:hover{color:#fff}
/* The sand hero is the one light field: --leaf-mid reaches only 2.17:1 there,
   under the 3:1 a control needs, so the resting ring is drawn in --leaf-dark. */
.hero a.btn-leaf-solid{border-color:var(--leaf-dark)}
.hero a.btn-leaf-solid:hover{border-color:var(--leaf-mid)}
@media(max-width:759px){.hero a.btn-leaf-solid{border-color:var(--leaf-mid)}}
.foot-list{list-style:none;margin:0;padding:0}
.foot-list li{margin-bottom:10px;line-height:1.5}
/* Compact hours: day label and time on one line, closed days grouped. */
.foot-hours{list-style:none;margin:0;padding:0;max-width:230px}
.foot-hours li{display:flex;gap:8px;font-size:14px;line-height:1.6;color:var(--on-navy-body)}
.foot-hours li span{flex:0 0 92px;color:#fff}
.foot-hours li.closed{margin-top:8px;padding-top:8px;border-top:1px solid rgba(255,255,255,.14)}
.foot-bottom{border-top:1px solid rgba(255,255,255,.14);padding:24px 0;display:flex;flex-wrap:wrap;gap:12px 28px;align-items:center;justify-content:space-between;font-size:13px;color:#9FB0C9}
.foot-bottom a{color:#9FB0C9}
.foot-logo{width:52px;height:52px;margin-bottom:16px}

.skip{position:absolute;left:-9999px;top:0;background:#fff;color:var(--navy);padding:12px 20px;z-index:200;font-weight:600}
.skip:focus{left:8px;top:8px}


/* ============================================================
   ACCESSIBILITY FIXES (Oct 1, 2026), applied sitewide.
   1. Focus outline: navy on light grounds (gold was 2.75:1 on paper,
      under the 3:1 non-text minimum); light gold on dark grounds.
   2. Links inside running text are underlined, not colour-only.
   ============================================================ */
:focus-visible{outline-color:var(--navy)}
.site-header :focus-visible,.site-footer :focus-visible,.band-navy :focus-visible,.drawer :focus-visible,.trustbar :focus-visible,.skip:focus-visible{outline-color:var(--gold-light)}
.tn-list a,.rv-head p:not(.rv-links) a{text-decoration:underline;text-underline-offset:2px}

/* H1 line breaks (Oct 24, SB): .h1-nw keeps short phrases together so a heading line never ends on "and"/"in"/"is" and "MA" never sits alone.
   .h1-k phrases stay on one line only at the widths where they were measured to fit (Lora 500); elsewhere they wrap. */
.h1-nw{white-space:nowrap}

/* Oct 25 (SB): phone numbers never break across lines */
a[href^="tel:"]{white-space:nowrap}

/* ============================================================
   WORDPRESS THEME LAYER (Oct 25, 2026)
   ============================================================ */
/* Sticky header clears the logged-in admin bar */
.admin-bar .site-header{top:32px}
@media(max-width:782px){.admin-bar .site-header{top:46px}}
@media(max-width:600px){.admin-bar .site-header{top:0}}
/* Primary nav sits in a WordPress-menu managed region */
.nav-region{display:none}
@media(min-width:1080px){.nav-region{display:flex;align-items:center}}
/* Footer legal links region keeps the old paragraph's layout */
.foot-legal{margin:0;display:flex;gap:20px;flex-wrap:wrap}
/* Pencilino rich text wrappers behave like the paragraphs they replace */
.pencil-richtext>p:last-child{margin-bottom:0}
/* Static markup: a paragraph is "last" only if nothing follows the text block (e.g. a link after a card text). */
.pencil-richtext:not(:last-child)>p:last-child{margin-bottom:16px}
.pencil-managed-region:not(:last-child)>p:last-child{margin-bottom:16px}
/* Utility classes that replace the static build's inline image/paragraph styles */
.img-r4{border-radius:4px}
.img-full{width:100%}
.mb-18{margin-bottom:18px}
