/*
Theme Name: OPD Office
Theme URI: http://archphila.org/
Description: Archdiocese of Philadelphia
Author: AoP
Version: 2.0.24
*/

/*██ COMPONENT VARIABLES - Global design tokens are defined in theme.json */
:root {--nav-bg:var(--wp--preset--color--white);--nav-text:var(--wp--preset--color--ink);--nav-submenu-text:var(--wp--preset--color--ink);--nav-highlight-bg:var(--wp--preset--color--secondary);--nav-highlight-text:var(--wp--preset--color--white);--nav-accent:var(--wp--preset--color--accent);--nav-shadow:transparent;--nav-border:rgba(0, 0, 0, 0.1);--content-width:var(--wp--style--global--content-size, 1600px);--gutter:var(--wp--custom--spacing--gutter);--transition-speed:var(--wp--custom--transition--base);--shadow-color:var(--wp--custom--shadow--color);}

/*██ CSS RESET */
*, *::before, *::after { box-sizing: border-box; }
html { -moz-text-size-adjust: none; -webkit-text-size-adjust: none; text-size-adjust: none; }
body {-webkit-font-smoothing:antialiased;}
img, picture, video, canvas, svg { display: block; max-width: 100%; }
input, button, textarea, select { font: inherit; }
p, h1, h2, h3, h4, h5, h6 { overflow-wrap: break-word; }
h1, h2, h3, h4, h5, h6 { text-wrap: balance; }
a:not([class]) {text-decoration-skip-ink:auto;}
:target { scroll-margin-block: 5ex; }

/*██ BASE - Global typography and colors are defined in theme.json */
body {text-align:left;}
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { font-weight: inherit; color: inherit; text-decoration: none; }

p { margin: 0 0 1em; }
ul, ol { margin-bottom: 1em; padding: 0 0 0 1.5em; list-style-position: inside; }

em, i { font-style: italic; }
strong, b { font-weight: bold; }
small { font-size: 80%; }

hr {border:solid currentColor;border-width:1px 0 0;clear:both;margin:var(--wp--preset--spacing--50) auto;height:0;}

a {text-decoration:underline;}
a:hover, a:focus { text-decoration: none; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {outline:3px solid var(--wp--preset--color--ink);outline-offset:3px;box-shadow:0 0 0 6px var(--wp--preset--color--white);}

img { height: auto; }
object, embed, iframe { max-width: 100%; }

/*██ ACCESSIBILITY */
.screen-reader-text, .assistive-text { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.screen-reader-text:focus, .assistive-text:focus {background:var(--wp--preset--color--primary);border:3px solid var(--wp--preset--color--white);clip:auto !important;clip-path:none !important;color:var(--wp--preset--color--white);display:block;font-size:1rem;padding:var(--wp--preset--spacing--40);position:absolute;top:5px;left:5px;width:auto;height:auto;z-index:100000;}
@media (prefers-reduced-motion:reduce) {*, *::before, *::after {scroll-behavior:auto !important;animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;}}

/*██ PAGINATION */
nav.pagination {margin:var(--wp--preset--spacing--40) 0;display:block;padding:var(--wp--preset--spacing--40) 0;}
.nav-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 0; }
.page-numbers {background:var(--wp--preset--color--primary);color:var(--wp--preset--color--white);padding:var(--wp--preset--spacing--40);border:1px solid var(--wp--preset--color--white);flex:1 1 auto;text-align:center;text-decoration:none;}
.page-numbers.current, .page-numbers:hover {background:var(--wp--preset--color--secondary);color:var(--wp--preset--color--white);}

/*██ LAYOUT */
#content { overflow-x: hidden; display: block; } /* "display block" so "overflow-x hidden" works */
#content > * { padding-left: var(--gutter); padding-right: var(--gutter); margin-left: auto; margin-right: auto; }
#content > *:not(.alignfull) { max-width: var(--content-width); }
#content .alignfull { max-width:100vw; }

/* WP defaults */
img.alignleft, .alignleft { float:left; margin:0 1.5em 1.5em 0; }
img.alignright, .alignright { float:right; margin:0 0 1.5em 1.5em; }
img.aligncenter, .aligncenter { display:block; margin-left:auto; margin-right:auto; margin-bottom:1.5em; }
.wp-caption.alignleft, figure.alignleft { float:left; margin:0 1.5em 1.5em 0; }
.wp-caption.alignright, figure.alignright { float:right; margin:0 0 1.5em 1.5em; }
.wp-caption.aligncenter, figure.aligncenter { display:block; margin:0 auto 1.5em; }


/*██ ARCHIVES */
.archiveblock {margin-bottom:var(--wp--preset--spacing--50);padding-bottom:var(--wp--preset--spacing--50);border-bottom:1px solid var(--shadow-color);}
.archiveblock h3 {margin-bottom:var(--wp--preset--spacing--40);}
.archiveblock a { text-decoration: none; }


/*██ FRONT PAGE */
.callout .wp-block-column {box-shadow:var(--wp--preset--shadow--small);border-radius:7px;padding:var(--wp--preset--spacing--40);}
#content .didyouknow {font-family:var(--wp--preset--font-family--sans);background:var(--wp--preset--gradient--ministry);min-height:100vh;overflow-x:hidden;max-width:100%;}
.didyouknowcontainer { max-width:1200px; margin:0 auto; padding:20px; }
.hero-section { text-align:center; padding:20px 0; position:relative; }
.main-title {font-weight:700;color:var(--wp--preset--color--white);margin-bottom:20px;text-shadow:2px 2px 4px rgba(0, 0, 0, 0.3);animation:fadeInUp 1s ease-out;}
.subtitle {font-size:var(--wp--preset--font-size--large);color:var(--wp--preset--color--white);margin-bottom:50px;animation:fadeInUp 1s ease-out 0.2s both;}
.stats-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(200px, 1fr)); gap:30px; margin:50px 0; }
.stat-card {background:rgba(255, 255, 255, 0.95);backdrop-filter:blur(10px);border-radius:20px;padding:30px;text-align:center;transform:translateY(20px);opacity:0;animation:slideInUp 0.8s ease-out forwards;box-shadow:var(--wp--preset--shadow--large);position:relative;overflow:hidden;}
.stat-card:nth-child(1) { animation-delay:0.1s; }
.stat-card:nth-child(2) { animation-delay:0.2s; }
.stat-card:nth-child(3) { animation-delay:0.3s; }
.stat-card:nth-child(4) { animation-delay:0.4s; }
.stat-icon { font-size:3rem; margin-bottom:15px; display:block; }
.stat-number {font-size:2.5rem;font-weight:700;color:var(--wp--preset--color--ink);margin-bottom:10px;}
.stat-text {font-size:1.1rem;color:var(--wp--preset--color--muted);line-height:1.4;}
.cta-section {background:rgba(255, 255, 255, 0.95);backdrop-filter:blur(10px);border-radius:30px;padding:50px;margin:50px 0;text-align:center;animation:fadeInUp 1s ease-out 0.6s both;box-shadow:var(--wp--preset--shadow--x-large);}
.cta-title {color:var(--wp--preset--color--ink);margin-bottom:20px;font-weight:700;}
.cta-subtitle {font-size:1.3rem;color:var(--wp--preset--color--muted);margin-bottom:40px;line-height:1.6;}
.roles-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(200px, 1fr)); gap:25px; margin:40px 0; }
.role-card {background:var(--wp--preset--color--primary);color:var(--wp--preset--color--white);padding:25px;border-radius:15px;text-align:center;transform:scale(0.9);opacity:0;animation:popIn 0.6s ease-out forwards;}
.role-card:nth-child(1) { animation-delay:0.7s; }
.role-card:nth-child(2) { animation-delay:0.8s; }
.role-card:nth-child(3) { animation-delay:0.9s; }
.role-card:nth-child(4) { animation-delay:1.0s; }
.role-icon { font-size:2.5rem; margin-bottom:15px; display:block; }
.role-text { font-size:1rem; line-height:1.4; }
.action-section {background:var(--wp--preset--gradient--ministry);color:var(--wp--preset--color--white);padding:40px;border-radius:20px;text-align:center;margin:30px 0;animation:fadeInUp 1s ease-out 1.2s both;}
.action-text { font-size:1.2rem; margin-bottom:25px; line-height:1.6; }
.btn {display:inline-block;padding:15px 30px;margin:10px;background:var(--wp--preset--color--white);color:var(--wp--preset--color--primary);text-decoration:none;border-radius:50px;font-weight:700;font-size:1.1rem;transition:all var(--transition-speed) ease;box-shadow:var(--wp--preset--shadow--medium);}
.btn:hover {transform:translateY(-3px);box-shadow:var(--wp--preset--shadow--large);background:var(--wp--preset--color--surface);color:var(--wp--preset--color--secondary);}
@keyframes fadeInUp {from {opacity:0;transform:translateY(30px);} to {opacity:1;transform:translateY(0);}}
@keyframes slideInUp {from {opacity:0;transform:translateY(50px);} to {opacity:1;transform:translateY(0);}}
@keyframes popIn {from {opacity:0;transform:scale(0.8);} to {opacity:1;transform:scale(1);}}
@media (max-width:768px) {.stats-grid {grid-template-columns:1fr;}.cta-section {padding:30px 20px;}.roles-grid {grid-template-columns:1fr;}}


/*██ NAVIGATION */
.top-navigation {background: var(--nav-bg); box-shadow: 0 2px 4px var(--nav-shadow);}

.menu-toggle {position: absolute; opacity: 0; pointer-events: none;}
.menu-label {display:none;width:100%;padding:var(--wp--preset--spacing--40);background:var(--nav-bg);color:var(--nav-text);border:0;font-size:1rem;font-weight:500;cursor:pointer;transition:background-color var(--transition-speed);user-select:none;}
.menu-label:hover, .menu-toggle:focus + .menu-label {background: var(--nav-accent);}
.menu-icon {display: block; width: 24px; height: 2px; background: currentColor; position: relative; transition: background-color var(--transition-speed);}
.menu-icon::before, .menu-icon::after {content: ''; display: block; width: 24px; height: 2px; background: currentColor; position: absolute; left: 0; transition: transform var(--transition-speed);}
.menu-icon::before {top: -8px;}
.menu-icon::after {bottom: -8px;}
.menu-toggle:checked + .menu-label {background: var(--nav-accent);}
.menu-toggle:checked + .menu-label .menu-icon {background: transparent;}
.menu-toggle:checked + .menu-label .menu-icon::before {transform: translateY(8px) rotate(45deg);}
.menu-toggle:checked + .menu-label .menu-icon::after {transform: translateY(-8px) rotate(-45deg);}

.nav-bar {list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; align-items: stretch; background: var(--shadow-color);}
.nav-bar li {position: relative;}
.nav-bar a {color:var(--nav-text);text-decoration:none;padding:.5rem var(--wp--preset--spacing--40);display:block;font-weight:500;transition:all var(--transition-speed);}
.nav-bar a:hover, .nav-bar a:focus {background: var(--nav-highlight-bg); color: var(--nav-highlight-text);}
.nav-bar > .noparent > a {position: relative;}
.nav-bar .current-menu-item > a {background: var(--nav-highlight-bg); color: var(--nav-highlight-text); font-weight: 600;}
.nav-bar ul {list-style: none; margin: 0; padding: 0; background: var(--nav-bg); box-shadow: 0 4px 12px var(--nav-shadow); border-radius: 4px; position: absolute; top: 100%; left: 0; min-width: 200px; z-index: 9999; opacity: 0; visibility: hidden; transform: translateY(-10px); transition: opacity var(--transition-speed), transform var(--transition-speed), visibility 0s var(--transition-speed);}
.nav-bar ul a {color:var(--nav-submenu-text);padding:.75rem var(--wp--preset--spacing--40);}
.nav-bar ul a:hover, .nav-bar ul a:focus {background: var(--nav-highlight-bg); color: var(--nav-highlight-text);}
/*.nav-bar .noparent > a:hover, .nav-bar .noparent > a:focus, .nav-bar .noparent.current-menu-item > a {background:transparent;color:var(--nav-text);border-bottom:2px solid var(--wp--preset--color--accent);font-weight:normal;}*/
.nav-bar ul ul {left: 100%; top: 0;}
.nav-bar ul .current-menu-item > a {background: var(--nav-highlight-bg); color: var(--nav-highlight-text);}
.nav-bar li:hover > ul, .nav-bar li:focus-within > ul {opacity: 1; visibility: visible; transform: translateY(0); transition-delay: 0s;}
.nav-bar .menu-item-has-children > a::after { content: ''; display: inline-block; width: 0.4rem; height: 0.4rem; margin-left: 0.5rem; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); vertical-align: middle; }
.nav-bar ul .menu-item-has-children > a::after { transform: rotate(-45deg); }
.sub-menu a {background:var(--shadow-color);}

@media (pointer:coarse) {.nav-bar ul {padding:.75rem 0;}.nav-bar ul a {padding:1rem var(--wp--preset--spacing--40);}}
@media (max-width:768px) {.menu-label {display:flex;align-items:center;gap:var(--wp--preset--spacing--40);}.nav-bar {display:none;flex-direction:column;background:var(--nav-bg);box-shadow:0 4px 6px var(--nav-shadow);}.menu-toggle:checked ~ .nav-bar {display:flex;}.nav-bar a {color:var(--nav-submenu-text);border-bottom:1px solid var(--nav-border);padding:var(--wp--preset--spacing--40);}.nav-bar a:hover, .nav-bar a:focus {background:var(--nav-highlight-bg);}.nav-bar > .noparent > a::after {display:none;}.nav-bar .current-menu-item > a, .nav-bar .current_page_parent > a {background:var(--nav-highlight-bg);color:var(--nav-highlight-text);}.nav-bar ul {position:static;box-shadow:none;border-radius:0;padding:0;opacity:1;visibility:visible;transform:none;max-height:0;overflow:hidden;transition:max-height var(--transition-speed);background:var(--nav-highlight-bg);}.nav-bar li.submenu-open > ul {max-height:1000px;}.nav-bar ul a {padding-left:var(--wp--preset--spacing--60);}.nav-bar ul ul a {padding-left:var(--wp--preset--spacing--70);}.nav-bar .menu-item-has-children > a::after {right:var(--wp--preset--spacing--40);top:50%;margin-top:-.2rem;transform:translateY(-50%) rotate(45deg);transition:transform var(--transition-speed);}.nav-bar .menu-item-has-children.submenu-open > a::after {transform:translateY(-50%) rotate(-135deg);}}

/*██ PRINT STYLES */
@media print {*, *::before, *::after {background:transparent !important;color:#000 !important;box-shadow:none !important;text-shadow:none !important;}a, a:visited {text-decoration:underline;}a[href]::after {content:" (" attr(href) ")";font-size:.875em;}a[href^="#"]::after, a[href^="javascript:"]::after {content:"";}abbr[title]::after {content:" (" attr(title) ")";}pre, blockquote {border:1px solid #999;page-break-inside:avoid;}img, tr {page-break-inside:avoid;}p, h2, h3 {orphans:3;widows:3;}h2, h3 {page-break-after:avoid;}thead {display:table-header-group;}img {max-width:100% !important;max-height:4in;}#navigation, .no-print, nav.pagination {display:none !important;}.print-only {display:block !important;}body {font-size:12pt;line-height:1.4;}#content > * {max-width:100%;padding:0;}}