/* Seal: the NewsGuild of Greater Philadelphia site design (2026).
   Loads after style.css and css/mobile.css and overrides the 2012 base theme.
   Bricolage Grotesque for display, Instrument Sans for reading; navy/teal from the seal. */

:root { --font-display: 'Bricolage Grotesque', Arial, sans-serif; /* one line to change the heading font */
  --font-mono: 'IBM Plex Mono', ui-monospace, Menlo, monospace; /* form labels */
  --navy:#1d2b3a; --teal:#2f6f7f; --teal-dk:#245764; --sky:#e8f1f3; --ink:#1f262d; --paper:#ffffff; --line:#dbe4e8;
  --seal: url('/wp-content/uploads/2019/06/TNG_Logo_2019_Comp.png'); }

html body, html body.custom-background { background: var(--paper); color: var(--ink); font: 17px/1.65 'Domine', Arial, sans-serif; }
.header_wrap, .utility_wrap, .featured_wrap, .primary_wrap, .footer-logos, .footer_wrap { border: 0 !important; }
.featured_wrap, .footer_wrap { position: relative; display: flow-root; clip-path: inset(0 -100vmax); }

h1, h2, h3, h4, h5 { font-family: var(--font-display); color: var(--navy); font-weight: 800; letter-spacing: -.02em; }
h1 { font-size: 46px; line-height: 1.08; }
h2 { font-size: 31px; line-height: 1.18; }
h3 { font-size: 22px; line-height: 1.3; }
a { color: var(--teal); } a:hover { color: var(--navy); }
.content a { text-decoration: underline; text-decoration-color: rgba(47,111,127,.4); text-underline-offset: 3px; }
a:focus-visible, .btn2:focus-visible { outline: 3px solid var(--teal); outline-offset: 3px; }

/* nav: navy band, current page as a teal pill */
.utility { background: var(--navy); } /* band painted on the full-width .utility: no clip-path, so dropdowns can hang below */
.utility_wrap { background: none; }
.nav1 { height: auto; min-height: 58px; } .nav1 > li { height: auto; min-height: 58px; } /* top-level items only (dropdown items keep their own height); min-height so labels can grow under larger text spacing */
.nav1 a { font: 600 16px/20px var(--font-display); color: #dfe8ec; padding: 9px 12px; margin: 10px 2px 0 0; border-radius: 999px; }
.nav1 li:hover > a { background: rgba(255,255,255,.1); color: #fff; }
.nav1 li.current-menu-item > a, .nav1 li.current-menu-ancestor > a { background: var(--teal); color: #fff; }
.nav1 li.has_child > a { background-image: none; padding-right: 12px; }
.nav1 ul { top: 52px; }
.nav1 ul.sub-menu { background: var(--paper); padding: 8px; border-radius: 14px; box-shadow: 0 14px 34px rgba(29,43,58,.22); }
.nav1 ul.sub-menu a { font: 400 15px/1.35 'Domine', sans-serif; color: var(--ink); padding: 8px 12px; border-radius: 8px; margin: 0; }
.nav1 ul li:hover > a { background: var(--sky); color: var(--navy); }

/* page title: teal band, the seal set huge and faint */
.featured { background: var(--teal); } /* full-width wrapper: no box-shadow seams */
.featured_wrap { background: none; box-shadow: none; padding: 54px 30px 50px; overflow: visible; }
.page_titles h1 { color: #fff; font-size: 50px; line-height: 1.05; position: relative; }

/* buttons: pills */
.btn2, .btn2:visited, .royalBlue, .royalBlue:visited { background: var(--navy) !important; background-image: none !important; color: #fff !important; border: 0 !important; border-radius: 999px; text-shadow: none !important; box-shadow: none; font: 600 17px/1 var(--font-display) !important; padding: 15px 26px !important; text-decoration: none !important; }
.btn2:hover { background: var(--teal) !important; }

/* home */
body.home img.wp-image-147 { filter: drop-shadow(0 18px 30px rgba(29,43,58,.25)); }
.two_third h2 { font-size: 30px; }
.hr { border-bottom: 1px solid var(--line); }
ul.list6 li { background: none; position: relative; padding-left: 20px; }
ul.list6 li::before { content: ""; position: absolute; left: 0; top: .55em; width: 7px; height: 7px; border: 2px solid var(--teal); border-radius: 50%; }

/* sidebar */
.sidebar { color: #4a5560; }
.sidebar h5 { font: 800 18px/1.3 var(--font-display); color: var(--navy); }
.sidebar a { color: var(--ink); } .sidebar a:hover { color: var(--teal); }
.sidebar ul li { border-bottom: 1px solid var(--line); }
.searchbox { border: 1px solid var(--line); border-radius: 999px; padding-left: 8px; background: var(--sky); }

/* footer: navy, echoing the header */
.footer-logos { background: var(--paper); }
.footer_wrap { background: var(--navy); box-shadow: 0 0 0 100vmax var(--navy); padding-top: 26px; padding-bottom: 26px; }
.footer, .footer a { font: 14px/1.5 'Domine', sans-serif; color: #b7c6cf; }


/* ---------- home hero: the seal, with every workplace orbiting it like its own inscription ---------- */
body.home .primary_wrap, body.home .content.wide { overflow: visible; display: flow-root; }
.seal-hero { position: relative; isolation: isolate; margin: -30px 0 0; padding: 64px 0 68px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: 56px; align-items: center; }
.seal-hero h1 { color: #fff; font-size: 76px; line-height: .95; letter-spacing: -.035em; margin: 0 0 18px; }
body.home div.content.wide .seal-hero p.seal-sub { font: 400 21px/1.5 'Domine', sans-serif; color: #c5d4db; margin: 0 0 30px; max-width: 24em; }

/* ---------- interior pages ---------- */
/* sidebar: widgets out; a nav for the section you're in + one contact card (printed by local10_seal_sidebar) */
.sidebar .widgetwrap { display: none; }
.section-nav { margin: 0 0 28px; }
.section-nav h2, .contact-card h2 { font: 700 15px/1.3 var(--font-display); color: #5b6f7a; margin: 0 0 10px; padding-left: 14px; letter-spacing: 0; }
.section-nav ul { list-style: none; margin: 0; padding: 0; }
.sidebar .section-nav li { margin: 0; padding: 0; border: 0; }
.sidebar .section-nav a { display: block; padding: 8px 14px; border-radius: 999px; font: 400 16px/1.35 'Domine', sans-serif; color: var(--ink); }
.sidebar .section-nav a:hover { background: var(--sky); color: var(--navy); }
.sidebar .section-nav a[aria-current] { background: var(--navy); color: #fff; font-weight: 600; }
.contact-card { background: var(--sky); border-radius: 18px; padding: 18px 20px 4px; }
.contact-card h2 { padding-left: 0; color: var(--navy); font-size: 17px; }
.contact-card p { font: 400 16px/1.5 'Domine', sans-serif; color: var(--ink); }
.sidebar .contact-card a { color: var(--teal); text-decoration: underline; text-underline-offset: 3px; }

/* titles in the band are the page's own; long post headlines step down */
.single .page_titles h1 { font-size: 40px; line-height: 1.08; max-width: 15em; }
.single .entry > h2:first-child { display: none; } /* it's in the band now */

/* date / category line */
.meta-box { font: 400 15px/1.4 'Domine', sans-serif; text-transform: none; color: #5b6f7a; margin-bottom: 22px; }
.meta-box span { background: none !important; padding: 0 !important; margin: 0 !important; }
.meta-box .author { display: none; }
.meta-box .cats::before { content: ""; display: inline-block; width: 5px; height: 5px; margin: 0 10px 2px; border: 1.5px solid var(--teal); border-radius: 50%; }
.meta-box a { color: var(--teal); }

/* news list */
:is(.blog, .archive, .search) .entry { padding-bottom: 26px; margin-bottom: 30px; border-bottom: 1px solid var(--line); }
:is(.blog, .archive, .search) .entry h2 { font-size: 27px; line-height: 1.2; margin-bottom: 8px; }
:is(.blog, .archive, .search) .entry h2 a { color: var(--navy); text-decoration: none; }
:is(.blog, .archive, .search) .entry h2 a:hover { color: var(--teal); }
:is(.blog, .archive, .search) .entry p { color: #3d4952; }

/* reading: comfortable measure and rhythm in page/post bodies */
.content .entry p, .content > p { max-width: 38em; }
.content ul:not(.list), .content ol { padding-left: 1.2em; }
.content li { margin-bottom: 6px; }
.content strong { color: var(--navy); }
.contact-card a[href^="tel:"] { white-space: nowrap; }

/* ---------- title band ---------- */
.band-kicker { font: 600 15px/1.2 'Domine', sans-serif; color: #e2f1f4; margin: 0 0 10px; position: relative; }
.featured_wrap .page_titles { position: static; } /* so the textures below size to the whole band */
.page_titles h1, .band-kicker { position: relative; z-index: 1; }
/* halftone: newsprint dot screen fading in from the right */
.featured_wrap::before { content: ""; position: absolute; top: 0; bottom: 0; left: 35%; right: -100vmax; background: radial-gradient(rgba(255,255,255,.16) 1.6px, transparent 2px) 0 0 / 9px 9px; -webkit-mask: linear-gradient(90deg, transparent, #000 45%); mask: linear-gradient(90deg, transparent, #000 45%); pointer-events: none; }

/* ---------- footer: one clean navy row, edge to edge ---------- */
.footer { background: var(--navy); margin: 0; }
.footer_wrap { display: flex !important; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 8px 32px; background: none; box-shadow: none; clip-path: none; padding: 30px 30px 32px; }
.footer_wrap::before, .footer_wrap::after { display: none !important; }
.footer .notes_left, .footer .notes_right { float: none; width: auto; margin: 0; padding: 0; overflow: visible; text-align: left; }
.footer .top { display: none; } /* browsers already have "back to top" */
.footer, .footer a { font: 400 15px/1.5 'Domine', sans-serif; color: #b7c6cf; }
.footer a { text-decoration: underline; text-underline-offset: 3px; }
.footer a:hover { color: #fff; }

/* ---------- mobile menu (TapTap overlay) in Seal's type and colour ---------- */
@media (max-width: 767px) {
	.footer_wrap { padding: 24px 5% 28px; }
}

/* short pages: the canvas behind the white body is navy, so the footer never ends above a white gap */
html { background: var(--navy); }
.header { padding-top: 25px; } .header_wrap { margin-top: 0; } /* padding, not margin: a margin would collapse and show the navy canvas above the header */

/* ---------- search box ---------- */
.searchbox { width: 100%; max-width: 360px; height: 46px; box-sizing: border-box; display: flex; background: #fff; border: 1.5px solid #7d8f98; border-radius: 999px; padding: 0; overflow: hidden; }
.searchbox:focus-within { border-color: var(--teal); box-shadow: 0 0 0 3px rgba(47,111,127,.18); }
.searchbox #searchform { display: flex; width: 100%; margin: 0; }
.searchbox #searchform input#s { flex: 1; min-width: 0; height: 100%; border: 0; outline: 0; background: none; padding: 0 0 0 20px; font: 400 16px 'Domine', sans-serif; color: var(--ink); box-shadow: none; }
.searchbox #searchform input#searchsubmit { float: none; width: 48px; height: 100%; border: 0; cursor: pointer; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232f6f7f' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.3-4.3'/%3E%3C/svg%3E") center / 20px no-repeat; }
.searchbox #searchform input#searchsubmit:hover { background-color: var(--sky); }
.searchbox #searchform input#searchsubmit:focus-visible { outline: 3px solid var(--teal); outline-offset: -5px; } /* inset: .searchbox clips with overflow: hidden */
.searchbox input::placeholder, .gform_wrapper ::placeholder { color: #5b6f7a; opacity: 1; } /* 5.25:1; browser defaults go as low as 2.3:1 */

/* ---------- forms (Gravity Forms) ---------- */
.gform_wrapper .gfield_label { font: 600 16px/1.3 'Domine', sans-serif !important; color: var(--navy); }
.gform_wrapper input[type=text]:not(:where(.gfield_signature_text_input)), .gform_wrapper input[type=email], .gform_wrapper input[type=tel], .gform_wrapper input[type=number], .gform_wrapper select, .gform_wrapper textarea {
  font: 400 16px/1.4 'Domine', sans-serif !important; color: var(--ink); background: #fff; border: 1.5px solid #7d8f98 !important; border-radius: 10px !important; padding: 10px 12px !important; min-height: 46px; box-sizing: border-box; box-shadow: none !important; }
/* Signature add-on's "type your signature" box styles itself inline (script font, dashed pad border), so the rule above skips it; fit it on phones */
.gform_wrapper .gfield_signature_text_input { max-width: 100%; }
.gform_wrapper select { padding-right: 32px !important; }
.gform_wrapper input:focus, .gform_wrapper select:focus, .gform_wrapper textarea:focus { outline: 2px solid var(--teal); outline-offset: 2px; border-color: var(--teal) !important; box-shadow: 0 0 0 3px rgba(47,111,127,.18) !important; }
.gform_wrapper .gfield_required { color: #b3261e; margin-left: .25em; } /* gap after the label ("Phone *", not "Phone*") */
.gform_wrapper .ginput_complex label, .gform_wrapper .gfield_description { font: 400 14px/1.4 'Domine', sans-serif !important; color: #5b6f7a; }
.gform_wrapper .gform_footer :is(input, button)[type=submit], .gform_wrapper .gform_page_footer :is(input, button)[type=submit], .gform_wrapper .gform_page_footer :is(input, button).button, .gform_wrapper .gform_footer :is(input, button).button { background: var(--navy) !important; background-image: none !important; color: #fff !important; border: 0 !important; border-radius: 999px !important; font: 600 17px/1 var(--font-display) !important; padding: 16px 30px !important; margin-top: 8px !important; text-shadow: none !important; cursor: pointer; }
.gform_wrapper .gform_footer :is(input, button)[type=submit]:hover, .gform_wrapper .gform_page_footer :is(input, button).button:hover { background: var(--teal) !important; }
.gform_wrapper :is(button, input[type=submit], input[type=button]):focus-visible { outline: 3px solid var(--teal); outline-offset: 3px; } /* Submit, Next, signature Text/Clear */
.gform_wrapper input.gform-text-input-reset:focus-visible { outline: 2px solid var(--teal); outline-offset: 2px; } /* read-only price fields: GF strips their outline */
.error404 .content h2:first-of-type { display: none; } /* the band already says "Page not found" */

/* ---------- tables: quiet row rules, no grid ---------- */
.content table { width: 100%; max-width: 100%; border-collapse: collapse; margin: 8px 0 24px; font: 400 15px/1.45 'Domine', sans-serif; }
.content table th, .content table td { padding: 10px 12px !important; border: 0 !important; border-bottom: 1px solid var(--line) !important; background: none !important; text-align: left; vertical-align: top; font-size: 15px !important; line-height: 1.45 !important; }
.content table tr:first-child td, .content table th { font-weight: 600; color: var(--navy); border-bottom: 2px solid var(--navy) !important; }
.content table p { margin: 0; }

/* short pages: content area grows so the footer sits at the bottom of the window */
html body { min-height: 100vh; display: flex; flex-direction: column; }
html body > * { flex-shrink: 0; }
html body > .primary, html body > main { flex: 1 0 auto; } /* main wraps .primary (landmarks) */

/* ---------- accessibility fixes (contrast audit) ---------- */
/* current page inside a dropdown: white on teal (was dark text on teal, 2.7:1) */
.nav1 ul.sub-menu li.current-menu-item > a, .nav1 ul.sub-menu li.current-menu-ancestor > a { background: var(--teal); color: #fff; }
/* focus rings on dark bands: teal on navy is only 2.5:1, so use white there */
.utility a:focus-visible, .footer a:focus-visible, .seal-hero a:focus-visible, .featured a:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }
.nav1 ul.sub-menu a:focus-visible { outline: 3px solid var(--teal); outline-offset: -3px; }
.nav1 ul.sub-menu li:is(.current-menu-item, .current-menu-ancestor) > a:focus-visible { outline-color: var(--navy); outline-offset: 2px; }
.nav1 > li.is-closed > ul.sub-menu { display: none !important; } /* Escape closed it (functions.php) */

/* ---------- home: hero actions + redesigned sections ---------- */

.home-sections { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); grid-template-areas: "news contact" "units units"; gap: 56px 56px; margin: 56px 0 24px; }
.home-news { grid-area: news; } .home-contact { grid-area: contact; } .home-units { grid-area: units; }
.sec-head { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; margin-bottom: 8px; }
.home-sections h2 { font: 800 28px/1.15 var(--font-display); color: var(--navy); letter-spacing: -.02em; margin: 0; }
.sec-head a { font: 600 16px 'Domine', sans-serif; color: var(--teal); text-decoration: underline; text-underline-offset: 3px; }
.news-list, .staff-list, .unit-grid { list-style: none; margin: 0; padding: 0; }
.news-list li, .unit-grid li, .staff-list li { background: none; padding: 0; margin: 0; }
.news-list li { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 16px; align-items: baseline; padding: 16px 0; border-bottom: 1px solid var(--line); }
.news-list time { font: 400 15px 'Domine', sans-serif; color: #5b6f7a; }
.news-list a { font: 600 18px/1.35 'Domine', sans-serif; color: var(--navy); text-decoration: none; }
.news-list a:hover { color: var(--teal); text-decoration: underline; text-underline-offset: 3px; }
.home-contact { background: var(--sky); border-radius: 20px; padding: 26px 26px 20px; align-self: start; }
.home-contact h2 { font-size: 22px; margin-bottom: 12px; }
body.home div.content.wide .home-contact p.contact-lines { font: 400 16px/1.55 'Domine', sans-serif; color: var(--ink); margin: 0 0 18px; max-width: none; }
.contact-lines a { font-weight: 600; color: var(--teal); }
.staff-list li { padding: 12px 0; border-top: 1px solid #cfdde2; font: 400 15px/1.45 'Domine', sans-serif; }
.staff-list strong { color: var(--navy); font-weight: 600; }
.staff-list span { color: #4f6470; }
.staff-list a { display: block; color: var(--teal); text-decoration: underline; text-underline-offset: 3px; }
.home-units { padding-top: 40px; border-top: 1px solid var(--line); }
.home-units .sec-head { margin-bottom: 18px; }
.unit-grid { column-count: 3; column-gap: 48px; } /* flowing columns: no per-item rules to fall out of line when a name wraps */
.unit-grid li { break-inside: avoid; }
.unit-grid a { display: block; padding: 7px 0; font: 400 16px/1.4 'Domine', sans-serif; color: var(--ink); text-decoration: none; }
.unit-grid a:hover { color: var(--teal); text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 767px) {
	.seal-hero { grid-template-columns: 1fr; gap: 28px; padding: 40px 0 44px; } .seal-hero h1 { font-size: 52px; }
	.home-sections { grid-template-columns: 1fr; grid-template-areas: "news" "contact" "units"; gap: 40px; }
	.unit-grid { column-count: 1; }
	.news-list li { grid-template-columns: 1fr; gap: 2px; }
}

/* hero colour on a pseudo-element: a box-shadow spread left hairline seams at the container edges */
.seal-hero::before { content: ""; position: absolute; z-index: -1; top: 0; bottom: 0; left: -100vmax; right: -100vmax; background: var(--navy); }
.seal-hero { clip-path: inset(0 -100vmax); }
.news-list, .staff-list, .unit-grid { padding-left: 0 !important; }

.utility { box-shadow: inset 0 -1px 0 rgba(255,255,255,.12); } /* hairline between nav and hero */
.seal-hero { display: block; padding: 72px 0 76px; }
.seal-hero h1 { font-size: clamp(40px, 5.2vw, 62px); line-height: 1.04; letter-spacing: -.03em; max-width: 15em; margin: 0 0 36px; text-wrap: balance; }

/* pagination (was 10px grey caps, 2.8:1) */
.pagination { display: flex; justify-content: space-between; margin: 8px 0 24px; }
.pagination a { display: inline-flex; align-items: center; gap: 6px; }
.pagination a, .pagination a:visited { font: 600 16px/1.3 'Domine', sans-serif; text-transform: none; color: var(--teal); text-decoration: underline; text-underline-offset: 3px; }
.pagination a:hover { color: var(--navy); }

/* keyboard: tabbing into a top-level item opens its dropdown (it was hover-only) */
.nav1 li:focus-within > ul { display: block !important; visibility: visible !important; } /* !important: the menu script sets inline display:none */

/* ---------- home hero v3: existing home-page copy, four real buttons, banner texture shared with interior bands ---------- */
.seal-hero { display: block; padding: 72px 0 80px; }
.seal-hero h1 { font-size: clamp(40px, 5vw, 58px); line-height: 1.05; letter-spacing: -.03em; max-width: 14em; margin: 0 0 20px; text-wrap: balance; }
body.home div.content.wide .seal-hero p.seal-sub { font: 400 20px/1.5 'Domine', sans-serif; color: #c5d4db; max-width: 34em; margin: 0 0 36px; }
.seal-buttons { display: flex; flex-wrap: wrap; gap: 12px; }
.seal-btn { box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center; min-height: 56px; padding: 0 26px; border-radius: 999px; background: var(--teal); color: #fff !important; font: 600 17px/1.2 var(--font-display); text-decoration: none !important; text-align: center; }
.seal-btn:hover { background: #245764; }
.seal-btn.is-primary { background: #fff; color: var(--navy) !important; }
.seal-btn.is-primary:hover { background: var(--sky); }
/* home hero texture: wire copy (every workplace from the Contracts menu between the Guild's own words, data-wire from home.php)
   set on a -20° slant, fading in from the middle, drifting slowly along its slant and back. Decorative: empty alt text keeps it out of screen readers. */
.seal-hero > * { position: relative; }
.seal-hero::after { content: attr(data-wire) / ""; position: absolute; z-index: -1; top: -60%; bottom: -60%; left: calc(50% - 75vw - 1000px); right: calc(50% - 75vw - 1000px);
	font: 500 11.5px/2.2 var(--font-mono); letter-spacing: .14em; color: rgba(143,208,220,.14); word-break: break-all; overflow: hidden; pointer-events: none;
	transform: rotate(-20deg); /* layer oversized in every direction so the tilt and the drift never show an edge */
	-webkit-mask: linear-gradient(110deg, transparent calc(50% - 20vw), #000 calc(50% + 10vw)); mask: linear-gradient(110deg, transparent calc(50% - 20vw), #000 calc(50% + 10vw)); /* 110° = horizontal on screen once rotated; measured from the hero's centre */
	animation: l10-drift 200s infinite alternate; }
/* ~5px a second: eases in over the first 12s (and out before each turnaround) so it never starts or stops abruptly */
@keyframes l10-drift {
	0%   { transform: rotate(-20deg) translateX(0);       animation-timing-function: cubic-bezier(.4, 0, 1, 1); }
	6%   { transform: rotate(-20deg) translateX(-30px);   animation-timing-function: linear; }
	94%  { transform: rotate(-20deg) translateX(-970px);  animation-timing-function: cubic-bezier(0, 0, .6, 1); }
	100% { transform: rotate(-20deg) translateX(-1000px); }
}
.seal-hero:is(.is-offscreen, .is-paused)::after { animation-play-state: paused; }
/* pause button, bottom right of the hero */
.seal-hero .hero-pause { position: absolute; right: 0; bottom: 20px; width: 40px; height: 40px; display: grid; place-items: center; padding: 0; border: 1.5px solid rgba(255,255,255,.28); border-radius: 50%; background: rgba(29,43,58,.6); color: #dfe8ec; cursor: pointer; }
.seal-hero .hero-pause:hover { border-color: #fff; color: #fff; background: rgba(29,43,58,.9); }
.seal-hero .hero-pause:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }
.hero-pause .icon { width: 16px; height: 16px; grid-area: 1 / 1; }
.hero-pause .icon-play, .hero-pause[aria-pressed="true"] .icon-pause { display: none; }
.hero-pause[aria-pressed="true"] .icon-play { display: block; }
@media (prefers-reduced-motion: reduce) { .seal-hero .hero-pause { display: none; } } /* nothing moves, so nothing to pause */
/* phones: content and sidebar sit between equal 20px gutters (width:100% plus a left margin overhung the right edge by 20px) */
@media (max-width: 767px) { .primary_wrap > .content, .primary_wrap > .sidebar { width: auto !important; float: none !important; margin-left: 20px !important; margin-right: 20px !important; box-sizing: border-box; } }
@media (max-width: 767px) { .seal-hero { padding-bottom: 76px !important; } .seal-hero .hero-pause { bottom: 20px; } } /* phones: its own row below the stacked buttons */
/* reduced motion: the global rule at the end of this file stops the drift */
@media (max-width: 767px) { .seal-hero { padding: 44px 0 52px; } .seal-buttons { flex-direction: column; } .seal-btn { width: 100%; } }
/* dropdowns size to their content instead of the theme's fixed 205px */
.nav1 ul.sub-menu { width: max-content; min-width: 220px; max-width: 300px; }
.nav1 ul.sub-menu li { min-width: 0; float: none; display: block; height: auto; } /* theme floats nav items; one per row in dropdowns */
/* long menus (Contracts: 20 items) become a two-column panel, anchored right so it stays on screen */
#menu-main > li.menu-item-75 > ul.sub-menu { columns: 2; column-gap: 8px; width: 640px; max-width: none; left: auto; right: 0; }
#menu-main > li.menu-item-75 > ul.sub-menu li { break-inside: avoid; float: none; display: block; height: auto; }

/* title band: wider measure, size steps down for long titles instead of wrapping early */
.featured_wrap .page_titles { width: auto; max-width: 100%; float: none; margin-right: 0; }
.page_titles h1, .single .page_titles h1 { font-size: clamp(34px, 3.6vw, 48px); line-height: 1.08; max-width: 24em; text-wrap: balance; }

/* the theme's custom.js animates submenu padding-left 5px->12px on hover, re-wrapping long names; pin it */
.nav1 ul.sub-menu a { padding-left: 12px !important; padding-right: 12px !important; }

/* mobile.css indents band titles 5% on top of the band padding */
@media (max-width: 767px) { .page_titles h1 { margin-left: 0; } .featured_wrap { padding-left: 5%; padding-right: 5%; } }

/* long menu names wrap into even lines, never a lone word */
.nav1 ul.sub-menu a { text-wrap: balance; }

/* ---------- old-brand purple/red leftovers ---------- */
::selection { background: var(--teal); color: #fff; }
.featured ::selection, .seal-hero ::selection, .utility ::selection, .footer ::selection { background: #fff; color: var(--navy); }
/* form callouts (inline #44376e in header.php): quiet info note */
html body #field_5_43, html body #field_2_21, html body #field_4_28, html body #field_3_35 { background: var(--sky); color: var(--navy); border-left: 4px solid var(--teal); border-radius: 0 12px 12px 0; padding: 14px 18px !important; font: 600 16px/1.5 'Domine', sans-serif; }
/* "secure forms" lock: swap the old red PNG for a navy SVG */
img[src*="local10-secure"] { content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Ccircle cx='24' cy='24' r='24' fill='%231d2b3a'/%3E%3Crect x='15' y='22' width='18' height='14' rx='3' fill='%23fff'/%3E%3Cpath d='M18.5 22v-4a5.5 5.5 0 0 1 11 0v4' fill='none' stroke='%23fff' stroke-width='2.6'/%3E%3Ccircle cx='24' cy='28.5' r='2' fill='%231d2b3a'/%3E%3C/svg%3E"); width: 44px !important; height: 44px !important; }

/* ---------- audit leftovers ---------- */
/* old theme gave band titles a text-shadow (soft halo on white type) */
.page_titles h1, .seal-hero h1 { text-shadow: none !important; }
/* pasted Word formatting in older posts (Calibri/Arial/Symbol spans, 8pt notes) takes the site type */
.content .entry span, .content .entry font, .content .entry u, .content .entry a { font-family: inherit !important; }
.content .entry span[style*="font-size"] { font-size: max(14px, 1em) !important; }
/* text pasted from Word, Outlook or other websites carries its own font (Aptos, Calibri, Sentinel...), size, color and justification */
.content [style*="font-family"]:not(:where(.gfield--type-signature *)) { font-family: inherit !important; color: inherit !important; background-color: transparent !important; } /* not the signature add-on's typed-signature fonts */
.content :is(span, b, strong, i, em, font, u)[style*="font-family"] { font-size: inherit !important; line-height: inherit !important; }
.content [style*="justify"] { text-align: left !important; }
.content em { color: inherit; } /* old theme greyed every italic (#333) */
.content a[style*="color"] { color: var(--teal) !important; }
.content small, .content a[href*="maps.google"], .content small a { font-size: 14px; }
/* blockquotes: the old theme used a quote.png background */
.content blockquote { background: none; margin: 24px 0; padding: 4px 0 4px 20px; border-left: 4px solid var(--teal); font: italic 400 19px/1.55 'Domine', sans-serif; color: var(--navy); }

/* social icons: navy circles to match the palette (were Facebook blue / X black squares) */
.social-icons .social-icon.social-facebook, .social-icons .social-icon.social-x { background: var(--navy); border-radius: 50%; width: 36px; height: 36px; }
.social-icons .social-icon:hover { background: var(--teal); opacity: 1; }
.social-icons .social-icon:focus-visible { outline: 3px solid var(--teal); outline-offset: 2px; }
.footer .social-icons .social-icon:focus-visible, .mnav .social-icons .social-icon:focus-visible { outline-color: #fff; } /* teal on navy was 2.5:1 */
/* secure-forms note: lock and text centred on one row (content used inline top/left nudges) */
:has(> img[src*="local10-secure"]) { display: flex; align-items: center; gap: 14px; }
:has(> img[src*="local10-secure"]) > img { flex: none; margin: 0 !important; float: none !important; }
:has(> img[src*="local10-secure"]) > p { position: static !important; margin: 0 !important; }

/* ---------- forms: fields side by side on desktop ---------- */
@media (min-width: 768px) {
	/* membership form (2): Gender / Date of Birth / SSN on one row; Employment Type beside Job Title */
	#gform_fields_2 > #field_2_2 { grid-column: span 3; } #gform_fields_2 > #field_2_19 { grid-column: span 6; } #gform_fields_2 > #field_2_20 { grid-column: span 3; } /* DOB wider now forms are 720px: "Month" fits */
	#gform_fields_2 > #field_2_26 { grid-column: span 6; }
}
/* radio choices on one line (Full-time / Part-time, Allow / Opt out) */
.gform_wrapper .gfield_radio { display: flex !important; flex-wrap: wrap; gap: 6px 28px; }
.gform_wrapper .gfield_radio .gchoice { margin: 0 !important; }

@media (min-width: 768px) {
	/* address: street full width, then City / State / ZIP on one row */
	.gform_wrapper .ginput_container_address { display: grid !important; grid-template-columns: 2fr 1.4fr 1fr; gap: 0 16px; }
	.gform_wrapper .ginput_container_address > span { width: auto !important; float: none !important; margin: 0 !important; padding: 0 !important; }
	.gform_wrapper .ginput_container_address .ginput_address_line_1, .gform_wrapper .ginput_container_address .ginput_address_line_2 { grid-column: 1 / -1; }
	.gform_wrapper .ginput_container_address input, .gform_wrapper .ginput_container_address select { width: 100% !important; }
}
/* date dropdowns: tighter padding so Month / Day / Year stay readable */
.gform_wrapper .ginput_container_date select { padding-left: 10px !important; padding-right: 26px !important; min-width: 0; }
.gform_wrapper .gfield--type-date select { width: 100% !important; }
.gform_wrapper .gfield--type-date > .ginput_complex { width: 100%; }
/* radio choices size to their label */
.gform_wrapper .gfield_radio .gchoice { width: auto !important; float: none !important; }
.gform_wrapper .gfield_radio .gchoice label { max-width: none !important; }
.gform_wrapper .gfield_radio { padding-left: 0 !important; }
@media (min-width: 768px) {
	/* newer Gravity Forms markup (div grid): fields holding a medium input take half the row */
	.gform_wrapper div.gform_fields { column-gap: 20px; }
	.gform_wrapper div.gform_fields > .gfield:has(> .ginput_container > input.medium, > .ginput_container > select.medium) { grid-column: span 6; }
	.gform_wrapper div.gform_fields > .gfield :is(input.medium, select.medium) { width: 100% !important; }
}
/* date dropdowns never crush "Month" / "Year" */
.gform_wrapper .gfield--type-date select { min-width: 6.5em; }
@media (min-width: 768px) {
	.gform_wrapper div.gform_fields > .gfield:is(.gfield--type-date, .gfield--type-phone, .gfield--type-email, .gfield--type-select):not(:has(select[multiple])) { grid-column: span 6; }
	.gform_wrapper div.gform_fields > .gfield:is(.gfield--type-phone, .gfield--type-email, .gfield--type-select) :is(input, select) { width: 100% !important; }
}
.gform_wrapper .gfield--type-date .ginput_complex { display: flex !important; gap: 8px; width: 100%; flex-wrap: nowrap; }
.gform_wrapper .gfield--type-date .ginput_complex > .ginput_container_date { flex: 1 1 0; min-width: 0; width: auto !important; max-width: none !important; margin: 0 !important; padding: 0 !important; }

/* form confirmation after submit (was brick red #a15050) */
.gform_confirmation_message { background: var(--sky); border-left: 4px solid var(--teal); border-radius: 0 14px 14px 0; padding: 22px 26px; font: 600 19px/1.5 'Domine', sans-serif; color: var(--navy) !important; }

/* ---------- footer: four columns of the essentials, then the copyright row ---------- */
.footer-main { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 40px 40px; max-width: 900px; margin: 0 auto; padding: 56px 30px 40px; text-align: left; }
.footer-col h2 { font: 700 17px/1.3 var(--font-display); color: #fff; margin: 0 0 14px; letter-spacing: 0; }
.footer-col p, .footer-col li { font: 400 15px/1.6 'Domine', sans-serif; color: #c5d4db; margin: 0 0 12px; }
.footer-col ul { list-style: none; margin: 0; padding: 0; }
.footer-col li { margin: 0 0 8px; padding: 0; background: none; }
.footer .footer-col a { color: #e2ecef; text-decoration: none; }
.footer .footer-col a:hover { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.footer .footer-col p a { text-decoration: underline; text-underline-offset: 3px; }
.footer-id img { display: block; width: 132px; height: 132px; margin: -6px 0 16px; }
.footer-id p { font-size: 14px; max-width: 13em; color: #9fb4bd; margin-bottom: 16px; }
.footer-id strong { color: #fff; font-weight: 600; }
.footer-id .social-icons { margin-top: 4px; }
.footer .footer-id .social-icon { background: rgba(255,255,255,.1); }
.footer .footer-id .social-icon:hover { background: var(--teal); }
.footer .footer_wrap { background: linear-gradient(rgba(255,255,255,.14), rgba(255,255,255,.14)) 30px 0 / calc(100% - 60px) 1px no-repeat; padding-top: 22px; padding-bottom: 24px; } /* divider aligned to the columns */
@media (max-width: 767px) { .footer .footer_wrap { background-position: 5% 0; background-size: 90% 1px; } }
.footer .footer_wrap, .footer .footer_wrap a { font-size: 14px; }
@media (max-width: 900px) { .footer-main { grid-template-columns: 1fr 1fr; } }
@media (max-width: 767px) { .footer-main { grid-template-columns: 1fr; gap: 28px; padding: 40px 5% 28px; } .footer-id img { width: 104px; height: 104px; } }

/* address: GF grid-row's -9px side margins no longer cancelled by column padding */
.gform_wrapper .ginput_container_address { margin-left: 0 !important; margin-right: 0 !important; }
/* product price (read-only): plain navy text, not a red "input" */
.gform_wrapper .ginput_product_price_wrapper { display: flex; align-items: baseline; gap: 8px; }
.gform_wrapper input.ginput_product_price { color: var(--navy) !important; font: 700 20px/1.2 'Domine', sans-serif !important; border: 0 !important; background: none !important; padding: 0 !important; min-height: 0 !important; width: auto !important; box-shadow: none !important; }
.gform_wrapper .ginput_product_price_label { font: 400 16px 'Domine', sans-serif !important; color: #4f6470; }
/* PayPal/Braintree hosted card fields (iframes): style the wrappers like every other input */
.gform_wrapper .ginput_card_field { box-sizing: border-box; min-height: 46px; display: flex !important; align-items: center; padding: 12px 12px !important; background: #fff; border: 1.5px solid #7d8f98 !important; border-radius: 10px !important; }
.gform_wrapper .ginput_card_field iframe { height: 20px !important; width: 100% !important; }
.gform_wrapper .ginput_card_field.braintree-hosted-fields-focused { border-color: var(--teal) !important; box-shadow: 0 0 0 3px rgba(47,111,127,.18); }
.gform_wrapper .ginput_card_field.braintree-hosted-fields-invalid { border-color: #b3261e !important; }
.gform_wrapper .ginput_cardextras { display: grid !important; grid-template-columns: 1fr 1fr; gap: 0 16px; margin: 0 !important; }
.gform_wrapper .ginput_cardextras > span { width: auto !important; padding: 0 !important; margin: 0 !important; float: none !important; }
.gform_wrapper .ginput_card_security_code_icon { display: none; }
@media (min-width: 768px) { .gform_wrapper .gfield--type-paypal, .gform_wrapper .gfield--type-creditcard { grid-column: span 6; } }
.gform_wrapper .ginput_cardinfo_left, .gform_wrapper .ginput_cardinfo_right { width: auto !important; max-width: none !important; flex: none !important; padding: 0 !important; }
.gform_wrapper .ginput_cardinfo_left .ginput_card_field, .gform_wrapper .ginput_cardinfo_right .ginput_card_field { width: 100% !important; max-width: none !important; } /* GF reserves 30px for the CVV icon we hide */
.gform_wrapper .ginput_container_custom_card_fields > span, .gform_wrapper .ginput_container_creditcard > span { margin-bottom: 14px !important; }

/* ---------- header lockup: seal image + live text (follows the site's display font) ---------- */

.brand { padding: 18px 0 18px 30px !important; max-width: none !important; float: left; }
.brand-lockup { display: flex; align-items: center; gap: clamp(10px, 1.8vw, 18px); text-decoration: none !important; }
.brand-lockup img { width: clamp(54px, 12vw, 104px); height: auto; aspect-ratio: 1; flex: none; }
.brand-text { display: flex; flex-direction: column; gap: clamp(3px, .6vw, 6px); }
.brand-name { font: 800 clamp(16px, 4.4vw, 30px)/1.05 var(--font-display); letter-spacing: -.02em; color: var(--navy); }
.brand-sub { font: 700 clamp(9px, 2.2vw, 15px)/1.2 var(--font-display); letter-spacing: .04em; text-transform: uppercase; color: var(--teal); }
@media (max-width: 767px) {
	.brand { padding: 12px 0 12px 5% !important; box-sizing: border-box; width: calc(95% - 92px) !important; max-width: none !important; } /* stop short of the MENU button (right 5%, ~56px wide) */
	.brand-sub { letter-spacing: .02em; }
}

/* ---------- forms: IBM Plex Mono labels, calmer row rhythm ---------- */
.gform_wrapper .gfield_label, .gform_wrapper legend.gfield_label { font: 500 14px/1.35 var(--font-mono) !important; color: var(--navy); margin-bottom: 10px !important; letter-spacing: -.01em; }
.gform_wrapper .gfield_required { font-family: var(--font-mono); }
.gform_wrapper .ginput_complex label, .gform_wrapper .gform-field-label--type-sub, .gform_wrapper .gfield_description, .gform_wrapper .ginput_product_price_label { font: 400 12.5px/1.4 var(--font-mono) !important; color: #5b6f7a; letter-spacing: -.01em; padding-top: 6px !important; }
.gform_wrapper .gfield_description { margin-top: 2px; }
/* space between rows */
.gform_wrapper div.gform_fields { row-gap: 30px !important; }
.gform_wrapper .ginput_container_address { row-gap: 16px; }
.gform_wrapper .gfield--type-section { margin-top: 18px !important; padding-top: 0 !important; }
.gform_wrapper .gfield--type-section h2, .gform_wrapper .gsection_title { font: 700 22px/1.2 var(--font-display) !important; color: var(--navy); }

/* phones: no desktop header padding above the lockup */
@media (max-width: 767px) { .header { padding-top: 0; } .brand { padding-top: 14px !important; padding-bottom: 14px !important; } }

/* ---------- forms: spacing refinement ---------- */
.gform_wrapper div.gform_fields { row-gap: 26px !important; }
.gform_wrapper .gfield_label, .gform_wrapper legend.gfield_label { margin-bottom: 8px !important; }
.gform_wrapper .ginput_complex label, .gform_wrapper .gform-field-label--type-sub { padding-top: 5px !important; margin: 0 !important; }
/* multi-part fields (name, address): tighter inner rows than the gap between fields */
.gform_wrapper .ginput_container_address { row-gap: 12px !important; }
.gform_wrapper .ginput_complex.gform-grid-row { row-gap: 12px; }
/* opt-ins without their own label belong to the field above: pull them up, add a hairline under */
.gform_wrapper .gform_fields > .gfield--type-radio:not(:has(> .gfield_label:not(:empty), > legend.gfield_label:not(:empty))) { margin-top: -12px !important; }
.gform_wrapper .gfield_radio label, .gform_wrapper .gfield_checkbox label { font-size: 15px !important; }
/* inputs and selects share one height */
.gform_wrapper .gfield :is(input[type=text], input[type=email], input[type=tel], input[type=number], select) { height: 46px; }

/* display type: Bricolage condensed (its width axis; body and form fonts have none, so they are unaffected) */
/* Bricolage width: full (100) by default; condensed (82) where space is tight or text runs long.
   !important because the font shorthand used throughout resets font-variation-settings. */
html, html * { font-variation-settings: "wdth" 100 !important; }
:is(.nav1 a, .mnav-menu a, .seal-btn, .btn2, .page_titles h1, .brand-sub, .gform_wrapper .gform_footer :is(input, button)[type=submit], .gform_wrapper .gform_page_footer :is(input, button)) { font-variation-settings: "wdth" 82 !important; }
/* condensed items run a size larger */
.nav1 > li > a { font-size: 20px !important; padding: 9px 10px !important; margin-right: 0 !important; }
.nav1 li.has_child > a { padding-right: 10px !important; }
.nav1 ul.sub-menu a { font-size: 16px !important; }
.seal-btn, .btn2, .btn2:visited, .gform_wrapper .gform_footer :is(input, button)[type=submit], .gform_wrapper .gform_page_footer :is(input, button) { font-size: 19px !important; }
.page_titles h1, .single .page_titles h1 { font-size: clamp(38px, 4.6vw, 58px) !important; }
.brand-sub { font-size: clamp(10px, 2.5vw, 17px) !important; }
/* nav spans the full content width; item text aligns with the content edges (pill padding hangs outside) */
@media (min-width: 768px) {
	.nav1 { display: flex !important; justify-content: space-between; float: none !important; width: auto !important; margin: 0 20px !important; padding: 0 !important; }
	.nav1 > li { float: none !important; }
	.nav1 > li:last-child > ul.sub-menu, .nav1 > li:nth-last-child(2) > ul.sub-menu { left: auto; right: 0; }
}
/* title band: shorter on desktop */
@media (min-width: 768px) { .featured_wrap { padding-top: 34px !important; padding-bottom: 32px !important; } .band-kicker { margin-bottom: 6px !important; } }
/* header: no extra top padding (was 25px + 18px above the lockup) */
.header { padding-top: 0 !important; }
@media (min-width: 768px) { .brand { padding-top: 22px !important; padding-bottom: 22px !important; } }
/* mobile toggle centred on the lockup: brand padding (14px) + half the seal, minus half the toggle (27px) */
/* phones: seal pinned to the top of the lockup so the MENU toggle (above) centres on it */
@media (max-width: 767px) { .brand-lockup { align-items: flex-start; } .brand-text { padding-top: 2px; } }
/* sidebar links: rounded rectangle, not a pill (multi-line titles made a lozenge) */
.sidebar .section-nav a { border-radius: 10px !important; }
.seal-btn { box-sizing: border-box; max-width: 100%; }
@media (max-width: 767px) {
	.seal-hero h1 { font-size: clamp(30px, 8.4vw, 40px); }
	body.home div.content.wide .seal-hero p.seal-sub { font-size: 17px; line-height: 1.5; margin-bottom: 28px; }
}
/* phones: each lockup line on one line — condensed, sized to the space beside the seal (~90vw - 138px) */
@media (max-width: 767px) {
	.brand-name, .brand-sub { white-space: nowrap; font-variation-settings: "wdth" 82 !important; }
	.brand-name { font-size: calc((90vw - 138px) / 15.6) !important; }
	.brand-sub { font-size: calc((90vw - 138px) / 21.8) !important; letter-spacing: .01em; font-variation-settings: "wdth" 75 !important; }
	.brand-lockup { align-items: center; }
}
@media (max-width: 767px) {
	/* lockup runs up to ~10px before the MENU toggle; text width = 90vw - 127px */
	.brand { width: calc(95% - 63px) !important; overflow: visible !important; }
	.brand-name { font-size: max(0.64rem, calc((90vw - 127px) / 15.6)) !important; } /* rem floor = the 320px size, so zoom still enlarges it */
	.brand-sub { font-size: max(0.43rem, calc((90vw - 127px) / 23.4)) !important; }
	html body, html body.custom-background { font: 16px/1.6 'Domine', Arial, sans-serif; }
}
@media (max-width: 319px) { .brand-name, .brand-sub { white-space: normal; } } /* only when zoomed past phone width */
/* header: social icons vertically centred on the lockup */
@media (min-width: 768px) {
	.header_wrap { display: flex !important; align-items: center; justify-content: space-between; }
	.header_wgt_area { float: none !important; margin: 0 30px 0 0 !important; padding: 0 !important; width: auto !important; }
	.header_wgt_area .textwidget { display: flex; }
}
/* phones: wide tables (pasted Word tables with fixed widths) scroll sideways inside their own box */
@media (max-width: 767px) {
	.content table { display: block; width: auto !important; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
	.content table td, .content table th { min-width: 120px; }
	.content img, .content video { max-width: 100% !important; height: auto; }
	.content iframe, .content embed { max-width: 100% !important; } /* keep their height attribute (PDF viewer is 1200px tall) */
	.content iframe[src*="pdfjs"] { height: 70vh !important; height: 70svh !important; } /* leaves a strip of page to scroll past; svh doesn't jump with the address bar */
}
/* phones: a calmer type scale */
@media (max-width: 767px) {
	.page_titles h1, .single .page_titles h1 { font-size: clamp(28px, 8vw, 34px) !important; line-height: 1.05 !important; }
	.content h2, .content .entry h2 { font-size: 22px !important; line-height: 1.2 !important; }
	.content h3, .content .entry h3 { font-size: 19px !important; line-height: 1.25 !important; }
	.content h2 b, .content h2 strong { font-size: inherit !important; }
	:is(.blog, .archive, .search) .entry h2 { font-size: 21px !important; }
	.home-sections h2 { font-size: 24px !important; }
	.home-contact h2 { font-size: 20px !important; }
}
@media (max-width: 767px) { .content :is(p, div, li, span, b, strong, font)[style*="font-size"] { font-size: inherit !important; line-height: inherit !important; } } /* phones: pasted inline sizes match the body text (was forced to 20px, bigger than the text around it) */
/* Contracts panel: positioned against the nav bar (always on screen), never wider than it */
@media (min-width: 768px) {
	.nav1 { position: relative !important; }
	#menu-main > li.menu-item-75 { position: static !important; }
	#menu-main > li.menu-item-75 > ul.sub-menu { top: 100% !important; left: auto !important; right: 0 !important; width: min(640px, 100%) !important; box-sizing: border-box; }
}
/* 768–1000px: the old theme's fixed 960px layout overflowed; go fluid */
@media (min-width: 768px) and (max-width: 1000px) {
	.header_wrap, .utility_wrap, .primary_wrap, .footer-logos, .featured_wrap, .footer_wrap { width: auto !important; max-width: none !important; box-sizing: border-box; }
	.featured_wrap, .footer_wrap { padding-left: 30px !important; padding-right: 30px !important; }
	.wide { width: auto !important; margin-left: 30px !important; margin-right: 30px !important; }
	.content { width: calc(64% - 40px) !important; }
	.sidebar { width: calc(36% - 60px) !important; }
	.nav1 > li > a { font-size: clamp(15px, 2vw, 20px) !important; padding-left: 7px !important; padding-right: 7px !important; }
	.home-sections { grid-template-columns: 1fr; grid-template-areas: "news" "contact" "units"; }
}
/* Flash embeds (2009-era video) can't play in any browser; drop the blank box */
object[type="application/x-shockwave-flash"], embed[type="application/x-shockwave-flash"] { display: none !important; }
.content object, .content embed { max-width: 100% !important; }
/* phones: shorter title band */
@media (max-width: 767px) { .featured_wrap { padding-top: 24px !important; padding-bottom: 22px !important; } .band-kicker { margin-bottom: 4px !important; } }
/* sidebar: search + latest news restored */
.sidebar .searchbox { max-width: none; margin: 0 0 28px; }
.sidebar-news time { display: block; font: 400 12.5px/1.4 var(--font-mono); color: #5b6f7a; margin-bottom: 2px; }
.sidebar .sidebar-news a { font-size: 15px; line-height: 1.35; }
.sidebar .sidebar-news a.all-news { color: var(--teal); text-decoration: underline; text-underline-offset: 3px; font-size: 15px; }

/* ---------- page width: one shared box, min(1050px, 100% - 60px), centred; every row aligns to its edges ---------- */
@media (min-width: 1001px) {
	.header_wrap, .utility_wrap, .primary_wrap, .footer-logos, .featured_wrap, .footer_wrap, .footer-main {
		width: min(1050px, calc(100% - 60px)) !important; max-width: none !important; box-sizing: border-box;
		margin-left: auto !important; margin-right: auto !important; padding-left: 0 !important; padding-right: 0 !important; }
	.brand { padding-left: 0 !important; }
	.header_wgt_area { margin-right: 0 !important; }
	.nav1 { margin: 0 -10px !important; } /* item text on the edges, pill padding hangs outside */
	.wide { width: auto !important; margin-left: 0 !important; margin-right: 0 !important; }
	.content { width: calc(100% - 350px) !important; margin-left: 0 !important; margin-right: 0 !important; }
	.sidebar { width: 290px !important; margin-left: 60px !important; margin-right: 0 !important; }
	.footer .footer_wrap { background-position: 0 0 !important; background-size: 100% 1px !important; }
}
/* PDF embeds: not held to the 38em reading width; full content width, centred */
.content p:has(> iframe), .content p:has(> embed), .content div:has(> iframe[src*="pdfjs"]) { max-width: none !important; text-align: center; }
.content iframe[src*="pdfjs"] { display: block; width: 100% !important; margin: 0 auto; }
.content iframe[src*="google.com/maps"] { display: block; width: 100% !important; height: auto; aspect-ratio: 16 / 9; min-height: 300px; border: 1px solid var(--line) !important; border-radius: 16px; box-sizing: border-box; } /* Contact map fills its column (was a fixed 600x350 embed) */
@media (min-width: 1001px) { .content.wide { width: auto !important; } } /* full-width pages (contracts, PDFs) use the whole box */
.content div:has(> iframe[src*="pdfjs"]) { display: block !important; width: 100% !important; float: none !important; }
@media (min-width: 768px) { .primary_wrap:not(:has(.sidebar)) > .content { width: auto !important; float: none !important; margin-right: 0 !important; } } /* no sidebar -> full width (phones use the equal-gutter rule) */

/* ---------- section landing pages (Benefits, Contracts): card grid ---------- */
.section-cards { list-style: none; margin: 8px 0 24px; padding: 0 !important; display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 14px; }
.section-cards li { margin: 0; padding: 0; background: none; }
.section-card { display: flex; flex-direction: column; gap: 10px; height: 100%; box-sizing: border-box; padding: 26px 26px 22px; background: var(--sky); border-radius: 22px; text-decoration: none !important; color: var(--ink) !important; transition: background .15s; }
.section-card:hover { background: #d8e8ec; }
.section-card:focus-visible { outline: 3px solid var(--teal); outline-offset: 3px; }
.section-card .icon { width: 30px; height: 30px; color: var(--teal); stroke-width: 1.75; margin-bottom: 4px; }
.section-card-title { font: 800 21px/1.2 var(--font-display); color: var(--navy); letter-spacing: -.01em; text-wrap: balance; }
.section-card-text { font: 400 15.5px/1.55 'Domine', Georgia, serif; color: #3d4952; }
.section-card-cta { margin-top: auto; padding-top: 6px; font: 500 13px/1 var(--font-mono); color: var(--teal); }
.section-card:hover .section-card-cta { text-decoration: underline; text-underline-offset: 3px; }
/* compact list for sections without descriptions (Contracts): hairline rows in columns, name + arrow */
.section-cards--list { grid-template-columns: repeat(auto-fill, minmax(min(300px, 100%), 1fr)); gap: 0 32px; border-top: 2px solid var(--navy); }
.section-cards--list .section-card { flex-direction: row; align-items: center; justify-content: space-between; gap: 16px; height: 100%; padding: 16px 12px; background: none; border-bottom: 1px solid var(--line); border-radius: 0; }
.section-cards--list .section-card:hover { background: var(--sky); }
.section-cards--list .section-card-title { font-size: 18px; }
.section-cards--list .section-card-title::after { display: none; }
.section-cards--list .section-card-cta { margin: 0; padding: 0; flex: none; display: flex; }
.section-cards--list .section-card-cta .icon { width: 20px; height: 20px; color: var(--teal); transition: transform var(--t, .2s) var(--ease, ease); }
.section-cards--list .section-card:hover .section-card-cta .icon { transform: translateX(4px); } /* the arrow nudges; the row itself stays put */
@media (prefers-reduced-motion: reduce) { .section-card, .section-card-title::after, .section-card-cta::after { transition: none; } }

/* PDF viewers (contracts, by-laws, benefits): a Download PDF / Open full screen bar over each (printed by the do_shortcode_tag filter) */
.pdf-doc { margin: 0 0 40px; }
.content .pdf-doc-head { max-width: none; margin: 0 0 14px; display: flex; flex-wrap: wrap; align-items: center; gap: 10px 22px; text-align: left; }
.content a.pdf-open { font: 600 15px/1 var(--font-display); color: var(--teal); text-underline-offset: 3px; }
.pdf-download-size { font: 500 13px/1 var(--font-mono); } /* full strength: faded it failed contrast (4.27:1) */
.content a.pdf-download { display: inline-flex; align-items: center; gap: 8px; padding: 10px 18px; border-radius: 999px; background: var(--teal); color: #fff; font: 600 15px/1 var(--font-display); text-decoration: none; }
.content a.pdf-download::before { content: "↓"; font-weight: 800; }
.content a.pdf-download:hover { background: var(--navy); color: #fff; }

/* search results: "Contract" label, highlighted matches from Relevanssi excerpts */
.search-again { margin: 0 0 30px; }
.search .result-kind { margin: 0 0 6px; font: 500 13px/1 var(--font-mono); color: var(--teal); }
.search .entry mark { background: #d8e8ec; color: var(--navy); padding: 0 2px; border-radius: 3px; }

/* Lucide icons: inline SVGs sized to the text they sit with (local10_icon) */
.icon { width: 1.15em; height: 1.15em; flex: none; vertical-align: -.2em; stroke-width: 2; }
.ico-lines { list-style: none; padding: 0 !important; margin: 0 0 12px; }
.ico-lines li { display: flex; gap: 10px; align-items: flex-start; margin: 0 0 8px; padding: 0; background: none; }
.ico-lines .icon { margin-top: .22em; color: var(--teal); }
.content a.pdf-download .icon { width: 18px; height: 18px; vertical-align: 0; }
.content a.pdf-download::before { content: none; }
.content a.pdf-open { display: inline-flex; align-items: center; gap: 6px; }
.content a.pdf-open .icon { width: 16px; height: 16px; }
.sidebar .ico-lines li { border: 0 !important; padding: 0 !important; margin: 0 0 8px !important; }
.sidebar .contact-card .ico-lines a { text-decoration: none; }
.sidebar .contact-card .ico-lines a:hover { text-decoration: underline; text-underline-offset: 3px; }
/* forms: lock beside "Data is encrypted…" notes (icon added by the gform_field_content filter) */
.gfield_description .icon { width: 13px; height: 13px; margin-right: 5px; vertical-align: -2px; }
/* Your Rights: three steps above the letter */
.rights-steps { margin: 0 0 36px; padding: 26px 28px 8px; background: var(--sky); border-radius: 22px; }
.rights-steps h2 { font-size: 24px; margin: 0 0 18px; }
.rights-steps ol { list-style: none; padding: 0 !important; margin: 0; counter-reset: none; }
.rights-steps li { display: flex; gap: 16px; align-items: flex-start; margin: 0 0 18px; padding: 0; background: none; }
.rights-steps li > .icon { width: 44px; height: 44px; padding: 10px; box-sizing: border-box; border-radius: 50%; background: var(--navy); color: #fff; stroke-width: 1.75; }
.rights-steps h3 { font-size: 18px; margin: 2px 0 4px; }
.rights-steps p { margin: 0; font-size: 16px; line-height: 1.55; }

/* ---------- motion: hover and focus ease instead of snapping ---------- */
:root { --ease: cubic-bezier(.2, .7, .2, 1); --t: .2s; }
:where(a, button, input[type=submit], input[type=button], .button, select, input, textarea, .searchbox, #searchsubmit, .section-card, .contact-card a, .nav1 a, .seal-btn, .btn2, .pdf-download, .pdf-open) {
	transition: color var(--t) var(--ease), background-color var(--t) var(--ease), border-color var(--t) var(--ease), box-shadow var(--t) var(--ease), text-decoration-color var(--t) var(--ease), outline-offset var(--t) var(--ease), transform var(--t) var(--ease);
}
a { text-decoration-color: color-mix(in srgb, currentColor 45%, transparent); }
a:hover { text-decoration-color: currentColor; }
/* focus rings grow in rather than appearing */
:focus-visible { outline-offset: 3px; }
/* dropdowns fade and drop into place when they open (the menu script toggles display, so this runs on each open) */
@keyframes l10-drop { from { opacity: 0; transform: translateY(-6px); } }
.nav1 li:hover > ul.sub-menu, .nav1 li:focus-within > ul.sub-menu { animation: l10-drop .18s var(--ease); }

/* reduced motion: no movement or fades anywhere, including the hero ticker and card arrows */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; }
}

/* PDF viewer frame: rounded, hairline border, matching the cards (the viewer's insides are styled by css/pdf-viewer.css) */
/* desktop: the whole viewer (toolbar + page) fits on screen once scrolled to, instead of a fixed 1200px taller than most laptops */
@media (min-width: 768px) { .content iframe[src*="pdfjs"] { height: clamp(600px, calc(100vh - 48px), 1100px) !important; } }
.content iframe.pdfjs-iframe { border: 1px solid var(--line) !important; border-radius: 16px; background: #eef3f5; box-sizing: border-box; }

/* ---------- mobile menu (local10_mobile_menu) ---------- */
.mnav-toggle, .mnav { display: none; }
@media (max-width: 767px) {
	.mnav-toggle { display: inline-flex; flex-direction: column; align-items: center; gap: 2px; position: absolute; z-index: 1001; right: 12px; top: calc(14px + clamp(54px, 12vw, 104px) / 2 - 26px); min-width: 52px; min-height: 52px; padding: 6px 4px; border: 0; border-radius: 12px; background: none; color: var(--navy); cursor: pointer; font: 600 12px/1 var(--font-display); letter-spacing: .02em; }
	.mnav-toggle .icon { width: 26px; height: 26px; stroke-width: 2.25; }
	.mnav-toggle .icon-close, .mnav-toggle[aria-expanded="true"] .icon-open { display: none; }
	.mnav-toggle[aria-expanded="true"] .icon-close { display: block; }
	.mnav-open .mnav-toggle { position: fixed; top: max(12px, env(safe-area-inset-top)); color: #fff; }
	.mnav-toggle:focus-visible { outline: 3px solid var(--teal); outline-offset: 2px; }
	.mnav-open .mnav-toggle:focus-visible { outline-color: #fff; }
	.mnav-open, .mnav-open body { overflow: hidden; } /* page behind stays put */

	.mnav { display: block; position: fixed; inset: 0; z-index: 1000; overflow-y: auto; overscroll-behavior: contain; background: var(--navy); text-align: left;
		visibility: hidden; opacity: 0; transform: translateY(-10px); transition: opacity .25s var(--ease), transform .25s var(--ease), visibility 0s linear .25s; }
	.mnav.is-open { visibility: visible; opacity: 1; transform: none; transition-delay: 0s; }
	.mnav:focus { outline: none; } /* the whole-screen panel takes focus when opened by tap; Tab then moves to its links */
	.mnav::before { content: ""; position: sticky; top: 0; z-index: 1; display: block; height: calc(max(12px, env(safe-area-inset-top)) + 70px); margin-bottom: calc(-1 * (max(12px, env(safe-area-inset-top)) + 70px)); background: linear-gradient(var(--navy) 72%, rgba(29,43,58,0)); pointer-events: none; } /* clear ground under the Close button as the menu scrolls */
	.mnav-inner { padding: calc(max(12px, env(safe-area-inset-top)) + 60px) 24px calc(24px + env(safe-area-inset-bottom)); }
	.mnav .searchbox { max-width: none; background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.5); margin: 0 0 16px; }
	.mnav .searchbox:focus-within { border-color: #fff; box-shadow: 0 0 0 2px #fff; }
	.mnav .searchbox #searchform input#searchsubmit { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.3-4.3'/%3E%3C/svg%3E"); }
	.mnav .searchbox #searchform input#searchsubmit:focus-visible { outline-color: #fff; }
	.mnav .searchbox input[type=search] { color: #fff; background: transparent; }
	.mnav .searchbox input[type=search]::placeholder { color: #9fb3bc; }

	.mnav-menu, .mnav-menu .sub-menu { list-style: none; margin: 0; padding: 0 !important; }
	.mnav-menu > li { display: flex; flex-wrap: wrap; align-items: center; border-bottom: 1px solid rgba(255,255,255,.1); }
	.mnav-menu li { margin: 0; padding: 0; background: none; }
	.mnav-menu > li > a { flex: 1; padding: 9px 0; font: 700 21px/1.2 var(--font-display); color: #fff !important; text-decoration: none; letter-spacing: -.01em; }
	.mnav-menu .sub-menu { flex-basis: 100%; margin: -2px 0 10px !important; overflow: hidden; transition: height .3s var(--ease); }
	.mnav-menu .sub-menu:not([hidden]) > li { animation: l10-sub-in .32s var(--ease) both; animation-delay: calc(var(--i, 0) * 22ms); }
	@keyframes l10-sub-in { from { opacity: 0; transform: translateY(-6px); } }
	.mnav-menu .sub-menu a { display: block; padding: 6px 0 6px 14px; border-left: 2px solid rgba(255,255,255,.14); font: 400 15.5px/1.35 'Domine', serif; color: #c5d4db !important; text-decoration: none; }
	/* where you are: a teal bar beside the current page and its section */
	.mnav-menu li.current-menu-item > a, .mnav-menu li.current-menu-ancestor > a, .mnav-menu li.current-menu-parent > a { color: #8fd0dc !important; }
	.mnav-menu > li.current-menu-item > a::before, .mnav-menu > li.current-menu-ancestor > a::before, .mnav-menu > li.current-menu-parent > a::before { content: ""; display: inline-block; width: 4px; height: .9em; margin: 0 10px -1px 0; border-radius: 2px; background: #8fd0dc; }
	.mnav-menu .sub-menu li.current-menu-item > a { border-left-color: #8fd0dc; color: #fff !important; font-weight: 700; }
	.mnav-sub { display: grid; place-items: center; width: 44px; height: 44px; margin: -4px -10px -4px 0; padding: 0; border: 0; border-radius: 50%; background: none; color: #9fc3cc; cursor: pointer; }
	.mnav-sub .icon { width: 22px; height: 22px; transition: transform .2s var(--ease); }
	.mnav-sub[aria-expanded="true"] .icon { transform: rotate(180deg); }
	.mnav-sub:focus-visible, .mnav a:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }

	.mnav-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 20px 0 16px; }
	.mnav-actions .seal-btn { width: 100%; min-height: 48px; padding: 6px 12px; font-size: 15px; line-height: 1.15; }
	.mnav .social-icons a { color: #fff; background: rgba(255,255,255,.1); }
}
@media (prefers-reduced-motion: reduce) { .mnav { transform: none; } }

/* long URLs and runs of pasted non-breaking spaces wrap instead of running off a phone screen */
.content :is(p, li, td, dd, blockquote) { overflow-wrap: anywhere; }
/* old-theme small print (e.g. "Tagged ..." lines) was 11px */
.content p.small, .content .small { font-size: 13px !important; }
/* form radio buttons and checkboxes: control centred beside its label, 20px */
.gform_wrapper :is(.gfield_radio, .gfield_checkbox) .gchoice { display: flex !important; align-items: center; gap: 8px; }
.gform_wrapper :is(.gfield_radio, .gfield_checkbox) .gchoice input { flex: none; width: 20px !important; height: 20px !important; margin: 0 !important; accent-color: var(--teal); }
.gform_wrapper :is(.gfield_radio, .gfield_checkbox) .gchoice label { margin: 0 !important; padding: 0 !important; }
.content :is(p, div, span, table, img)[style*="width"] { max-width: 100% !important; box-sizing: border-box; } /* pasted fixed widths (e.g. width: 590px) fit the column */
div.content.wide p:first-of-type { font-size: inherit; line-height: inherit; } /* old theme enlarged the first paragraph in every block on full-width pages (form intros, contract notes) */

/* skip link: first thing keyboard users reach; hidden until focused */
.skip-link { position: absolute; z-index: 2000; left: 12px; top: -60px; padding: 12px 18px; border-radius: 0 0 10px 10px; background: var(--navy); color: #fff !important; font: 600 16px/1 var(--font-display); text-decoration: none; transition: top .15s var(--ease); }
.skip-link:focus { top: 0; outline: 3px solid var(--teal); outline-offset: 2px; }
main#main { display: block; outline: none; }
.content .gform_wrapper { max-width: 720px; } /* forms on full-width pages were stretching to 1050px */
/* date-of-birth dropdowns: gap between Month / Day / Year, each shrinks to its share instead of overlapping */
.gform_wrapper .gfield--type-date .ginput_complex { display: flex !important; gap: 8px; }
.gform_wrapper .gfield--type-date .ginput_complex > span { flex: 1 1 0; min-width: 0; width: auto !important; margin: 0 !important; padding: 0 !important; }
.gform_wrapper .gfield--type-date select { width: 100% !important; min-width: 0 !important; padding-left: 10px !important; padding-right: 24px !important; }

/* ---------- Windows High Contrast (forced colors) ---------- */
@media (forced-colors: active) {
	.seal-btn { border: 2px solid ButtonText; } /* the pill is drawn with a background only, which forced colors removes */
	.seal-hero::after { display: none; } /* the decorative wire text would show through the intro */
}
