/* ==========================================================================
   Trust in Jesus Christ — design system
   Tokens, typography, header, navigation, buttons, forms and footer.
   Page layouts live in their own files (home.css, …).
   ========================================================================== */

/* ---------- Fonts (self-hosted, OFL) ---------- */
@font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:400 700;font-display:swap;src:url('/assets/fonts/cormorant-garamond.latin.woff2') format('woff2')}
@font-face{font-family:'Cormorant Garamond';font-style:italic;font-weight:400 500;font-display:swap;src:url('/assets/fonts/cormorant-garamond-italic.latin.woff2') format('woff2')}
@font-face{font-family:'Manrope';font-style:normal;font-weight:200 800;font-display:swap;src:url('/assets/fonts/manrope.latin.woff2') format('woff2')}
/* Metric-matched fallbacks keep layout steady while the web fonts load. */
@font-face{font-family:'Cormorant Fallback';src:local('Georgia'),local('Times New Roman');size-adjust:88%;ascent-override:96%;descent-override:30%;line-gap-override:0%}
@font-face{font-family:'Manrope Fallback';src:local('Arial'),local('Helvetica');size-adjust:104%;ascent-override:102%;descent-override:29%;line-gap-override:0%}

/* ---------- Tokens ---------- */
:root,body.tij{
  /* Plum & violet: the ministry's leading colour */
  --plum-950:#1D1129;
  --plum-900:#2B1A3D;
  --plum-800:#3B2354;
  --plum-700:#4E2D72;
  --violet-600:#6B4C9A;
  --violet-400:#A48CC8;
  --lavender-200:#DCD0EB;
  --lavender-100:#EFE9F6;
  --lavender-50:#F7F3FB;
  /* Neutrals */
  --ivory:#FBF8F3;
  --paper:#FFFDF9;
  --white:#FFFFFF;
  --ink:#1C2740;          /* midnight navy body text */
  --ink-soft:#4A5368;
  --navy-900:#141F36;
  /* Champagne gold: rules, marks and accents on dark only */
  --gold-500:#B9975B;
  --gold-300:#E3CD9D;
  --gold-100:#F4EAD3;

  --line:rgba(78,45,114,.14);
  --line-strong:rgba(78,45,114,.26);
  --focus:#7A57B0;

  --font-display:'Cormorant Garamond','Cormorant Fallback',Georgia,'Times New Roman',serif;
  --font-body:'Manrope','Manrope Fallback',system-ui,-apple-system,'Segoe UI',Arial,sans-serif;

  /* Type scale */
  --step--1:clamp(.84rem,.82rem + .1vw,.9rem);
  --step-0:clamp(1rem,.97rem + .15vw,1.0625rem);
  --step-1:clamp(1.15rem,1.08rem + .35vw,1.3rem);
  --step-2:clamp(1.4rem,1.25rem + .7vw,1.75rem);
  --step-3:clamp(1.85rem,1.5rem + 1.6vw,2.75rem);
  --step-4:clamp(2.5rem,1.8rem + 3.2vw,4.25rem);
  --step-5:clamp(2.5rem,1.75rem + 4.6vw,5.4rem);

  /* Space */
  --space-1:.375rem;--space-2:.75rem;--space-3:1rem;--space-4:1.5rem;--space-5:2rem;--space-6:3rem;--space-7:4.5rem;--space-8:clamp(4rem,3rem + 5vw,7.5rem);

  --wrap:1200px;
  --gutter:clamp(1.25rem,.8rem + 2.2vw,2.5rem);
  --measure:66ch;

  --radius-sm:6px;
  --radius-md:10px;
  --radius-pill:999px;

  --ease:cubic-bezier(.2,.7,.2,1);
  --nav-height:76px;
}

/* ---------- Base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:calc(var(--nav-height) + 1rem)}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body.tij{margin:0;background:var(--ivory);color:var(--ink);font-family:var(--font-body);font-size:var(--step-0);line-height:1.7;font-weight:450;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
:where(.tij) img{max-width:100%;height:auto;display:block}
:where(.tij) a{color:var(--plum-700);text-decoration-thickness:1px;text-underline-offset:.2em}
:where(.tij) a:hover{color:var(--violet-600)}
.tij :focus-visible{outline:3px solid var(--focus);outline-offset:3px;border-radius:4px}
:where(.tij) :is(h1,h2,h3,h4){font-family:var(--font-display);font-weight:600;color:var(--plum-900);margin:0;letter-spacing:-.005em;text-wrap:balance}
:where(.tij) p{margin:0}
:where(.tij) p+p{margin-top:1em}
.tij ::selection{background:var(--lavender-200);color:var(--plum-950)}
.tij .visually-hidden{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.tij .wrap{width:min(100% - 2*var(--gutter),var(--wrap));margin-inline:auto}

.tij .skip-link{position:absolute;left:1rem;top:-100px;z-index:1000;background:var(--plum-900);color:var(--white);padding:.7rem 1.1rem;border-radius:var(--radius-sm);font-weight:700;text-decoration:none}
.tij .skip-link:focus{top:1rem;color:var(--white)}

/* Scripture reference: small caps, as printed Bibles set them */
.tij .ref{font-family:var(--font-display);font-variant:small-caps;font-feature-settings:"smcp","c2sc" 0;letter-spacing:.04em;font-weight:600;font-style:normal}

/* ---------- Buttons ---------- */
.tij .btn{display:inline-flex;align-items:center;justify-content:center;gap:.55em;min-height:48px;padding:.75rem 1.5rem;border-radius:var(--radius-pill);border:1.5px solid transparent;font-family:var(--font-body);font-size:.97rem;font-weight:700;line-height:1.2;letter-spacing:.005em;text-decoration:none;cursor:pointer;transition:background-color .2s var(--ease),color .2s var(--ease),border-color .2s var(--ease),transform .2s var(--ease)}
.tij .btn:active{transform:translateY(1px)}
.tij .btn-primary{background:var(--plum-700);color:var(--white)}
.tij .btn-primary:hover{background:var(--plum-800);color:var(--white)}
.tij .btn-gold{background:var(--gold-300);color:var(--plum-950)}
.tij .btn-gold:hover{background:var(--gold-100);color:var(--plum-950)}
.tij .btn-ghost-light{border-color:rgba(255,253,249,.55);color:var(--paper)}
.tij .btn-ghost-light:hover{background:rgba(255,253,249,.1);border-color:var(--paper);color:var(--paper)}
.tij .btn-quiet{border-color:var(--line-strong);color:var(--plum-800);background:transparent}
.tij .btn-quiet:hover{border-color:var(--plum-700);color:var(--plum-700);background:var(--lavender-50)}
.tij .btn[disabled]{opacity:.6;cursor:progress}

/* Inline text link with a growing underline */
.tij .text-link{font-weight:700;color:var(--plum-700);text-decoration:underline;text-decoration-color:var(--gold-500);text-decoration-thickness:2px;text-underline-offset:.32em}
.tij .text-link:hover{color:var(--plum-900);text-decoration-color:var(--plum-700)}

/* ---------- Forms ---------- */
.tij .field{display:grid;gap:.4rem}
.tij .field+.field{margin-top:1.05rem}
.tij .field label{font-size:.92rem;font-weight:700;color:var(--plum-900)}
.tij .field input,.tij .field textarea{width:100%;font:inherit;font-size:1rem;color:var(--ink);background:var(--white);border:1.5px solid var(--line-strong);border-radius:var(--radius-md);padding:.8rem .95rem;min-height:48px;transition:border-color .2s,box-shadow .2s}
.tij .field textarea{min-height:140px;resize:vertical;line-height:1.55}
.tij .field input:focus,.tij .field textarea:focus{outline:none;border-color:var(--violet-600);box-shadow:0 0 0 4px rgba(107,76,154,.18)}
.tij .field input::placeholder,.tij .field textarea::placeholder{color:#7C8396}
.tij .field input:user-invalid,.tij .field textarea:user-invalid{border-color:#A3364A}
.tij .hp{position:absolute!important;left:-10000px;width:1px;height:1px;overflow:hidden}
.tij .status{border-radius:var(--radius-md);padding:.85rem 1rem;font-weight:600;margin-bottom:1rem}
.tij .status.success{background:#EAF4EC;color:#1F5130;border:1px solid #B9D9C1}
.tij .status.error{background:#FBECEE;color:#7F2234;border:1px solid #EBC0C8}

/* ==========================================================================
   Header & navigation  (markup: app/partials/header.php, cmsRenderMenu)
   ========================================================================== */
.tij .site-nav{position:sticky;top:0;z-index:100;background:rgba(251,248,243,.94);-webkit-backdrop-filter:saturate(1.4) blur(14px);backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid transparent;transition:background-color .3s var(--ease),border-color .3s var(--ease),box-shadow .3s var(--ease)}
.tij .site-nav.scrolled{border-bottom-color:var(--line);box-shadow:0 10px 30px -24px rgba(29,17,41,.45)}
.tij .nav-inner{width:min(100% - 2*var(--gutter),1320px);margin-inline:auto;min-height:76px;display:flex;align-items:center;gap:1.5rem}
.tij .brand{display:inline-flex;align-items:center;gap:.7rem;text-decoration:none;color:var(--plum-900);flex:none}
.tij .brand-logo,.tij .foot-logo{width:46px;height:auto;border-radius:8px;background:var(--white);padding:3px}
.tij .brand-name{display:flex;flex-direction:column;font-family:var(--font-display);font-weight:600;font-size:1.42rem;line-height:1;letter-spacing:.005em}
.tij .brand-name>span{font-family:var(--font-body);font-size:.68rem;font-weight:700;letter-spacing:.06em;color:var(--violet-600);margin-bottom:.22rem}
.tij .brand:hover{color:var(--plum-700)}

.tij .nav-menu{margin-left:auto;display:flex;align-items:center;gap:.25rem;min-width:0}
.tij .nav-menu>a,.tij .nav-parent-link{display:inline-flex;align-items:center;min-height:44px;padding:.5rem .8rem;border-radius:var(--radius-pill);color:var(--ink);font-size:.95rem;font-weight:650;text-decoration:none;white-space:nowrap;transition:color .2s,background-color .2s}
.tij .nav-menu>a:hover,.tij .nav-parent-link:hover{color:var(--plum-700);background:var(--lavender-100)}
.tij .nav-menu a[aria-current="page"],.tij .nav-group.has-current>.nav-parent-link{color:var(--plum-700);box-shadow:inset 0 -2px 0 var(--gold-500);border-radius:0}
.tij .nav-icon{width:18px;height:18px;margin-right:.4rem}
.tij .nav-group{position:relative;display:flex;align-items:center}
.tij .nav-group .nav-parent-link{padding-right:.2rem}
.tij .nav-group details{position:static}
.tij .nav-group summary{list-style:none;display:inline-grid;place-items:center;width:32px;height:44px;cursor:pointer;color:var(--ink-soft);border-radius:var(--radius-pill)}
.tij .nav-group summary::-webkit-details-marker{display:none}
.tij .nav-group summary:hover{color:var(--plum-700)}
.tij .nav-toggle-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.tij .nav-chevron{width:15px;height:15px;transition:transform .2s var(--ease)}
.tij .nav-group details[open] .nav-chevron{transform:rotate(180deg)}
.tij .nav-children{position:absolute;top:calc(100% + .5rem);left:0;min-width:240px;padding:.5rem;background:var(--paper);border:1px solid var(--line);border-radius:var(--radius-md);box-shadow:0 24px 50px -28px rgba(29,17,41,.45),0 2px 8px rgba(29,17,41,.06);display:grid}
.tij .nav-children a{display:block;padding:.6rem .85rem;border-radius:var(--radius-sm);color:var(--ink);font-size:.95rem;font-weight:600;text-decoration:none}
.tij .nav-children a:hover{background:var(--lavender-100);color:var(--plum-700)}
.tij .nav-children a[aria-current="page"]{box-shadow:inset 3px 0 0 var(--gold-500);border-radius:0 var(--radius-sm) var(--radius-sm) 0}
@media (prefers-reduced-motion:no-preference){.tij .nav-group details[open]>.nav-children{animation:tij-drop .18s var(--ease)}}
@keyframes tij-drop{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
.tij .nav-menu .nav-search{padding-inline:.75rem}
.tij .nav-menu .nav-cta{margin-left:.5rem;background:var(--plum-700);color:var(--white);padding-inline:1.15rem}
.tij .nav-menu .nav-cta:hover{background:var(--plum-800);color:var(--white)}

/* Menu button: three bars (existing spans) + visible "Menu" label */
.tij .burger{display:none;position:relative;margin-left:auto;align-items:center;min-height:44px;padding:.45rem 1rem .45rem 2.6rem;border:1.5px solid var(--line-strong);border-radius:var(--radius-pill);background:transparent;color:var(--plum-900);font:inherit;cursor:pointer}
.tij .burger:hover{border-color:var(--plum-700);background:var(--lavender-50)}
.tij .burger>span[aria-hidden]{position:absolute;left:.95rem;display:block;width:18px;height:2px;margin:0;background:currentColor;border-radius:2px;transition:transform .25s var(--ease),opacity .2s}
.tij .burger>span[aria-hidden]:nth-child(1){top:calc(50% - 7px)}
.tij .burger>span[aria-hidden]:nth-child(2){top:calc(50% - 1px)}
.tij .burger>span[aria-hidden]:nth-child(3){top:calc(50% + 5px)}
.tij .nav-menu-label{font-weight:700;font-size:.92rem}

/* ----- Compact navigation (navigation.js sets .nav-compact below 1121px or when links do not fit) ----- */
.nav-ready .tij #nav.nav-compact .burger{display:inline-flex}
.nav-ready .tij #nav.nav-compact .nav-menu{position:fixed;inset:var(--nav-height) 0 0 auto;width:min(420px,100%);margin:0;display:none;flex-direction:column;align-items:stretch;gap:0;padding:1rem var(--gutter) 2rem;background:var(--paper);border-left:1px solid var(--line);box-shadow:-30px 0 60px -40px rgba(29,17,41,.5);overflow-y:auto;overscroll-behavior:contain}
.nav-ready .tij #nav.nav-compact .nav-menu.open{display:flex}
/* backdrop-filter would make the header the containing block of the fixed drawer */
.nav-ready .tij #nav.nav-compact:has(.nav-menu.open){-webkit-backdrop-filter:none;backdrop-filter:none;background:var(--paper)}
@media (prefers-reduced-motion:no-preference){.nav-ready .tij #nav.nav-compact .nav-menu.open{animation:tij-drawer .28s var(--ease)}}
@keyframes tij-drawer{from{transform:translateX(24px);opacity:0}to{transform:none;opacity:1}}
.tij #nav.nav-compact .nav-group{flex-wrap:wrap;border-bottom:1px solid var(--line)}
.tij #nav.nav-compact .nav-menu>a{border-bottom:1px solid var(--line);border-radius:0}
.tij #nav.nav-compact .nav-menu>a,.tij #nav.nav-compact .nav-parent-link{flex:1;min-height:56px;padding:.75rem .25rem;font-size:1.06rem;border-radius:0;background:none;box-shadow:none}
.tij #nav.nav-compact .nav-group summary{width:48px;height:56px}
.tij #nav.nav-compact .nav-group details{flex-basis:auto}
.tij #nav.nav-compact .nav-children{position:static;min-width:0;width:100%;border:0;box-shadow:none;background:transparent;padding:0 0 .75rem .5rem}
.tij #nav.nav-compact .nav-group details[open]{display:contents}
.tij #nav.nav-compact .nav-group details[open]>summary{order:0}
.tij #nav.nav-compact .nav-group details[open]>.nav-children{order:2;flex-basis:100%}
.tij #nav.nav-compact .nav-children a{padding:.6rem .75rem}
.tij #nav.nav-compact .nav-menu .nav-search{border-bottom:1px solid var(--line)}
.tij #nav.nav-compact .nav-menu .nav-cta{margin:1.25rem 0 0;justify-content:center;border-radius:var(--radius-pill);border-bottom:0;color:var(--white);background:var(--plum-700);flex:none;min-height:52px}
.tij #nav.nav-compact .burger[aria-expanded="true"] span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.tij #nav.nav-compact .burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.tij #nav.nav-compact .burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
.tij .sc-nav-backdrop{position:fixed;inset:var(--nav-height) 0 0 0;background:rgba(29,17,41,.38);z-index:-1}
/* Without JavaScript the links stay visible and simply wrap. */
@media (max-width:1120px){html:not(.nav-ready) .tij .nav-inner{flex-wrap:wrap;padding-block:.5rem}html:not(.nav-ready) .tij .nav-menu{flex-wrap:wrap;margin-left:0}}

/* ==========================================================================
   Footer  (markup: app/partials/footer.php)
   ========================================================================== */
.tij .site-footer{background:var(--plum-950);color:#D9D1E6;padding:var(--space-7) 0 var(--space-5);position:relative}
.tij .site-footer::before{content:"";position:absolute;inset:0 0 auto;height:1px;background:linear-gradient(90deg,transparent,var(--gold-500),transparent);opacity:.6}
.tij .foot-inner{width:min(100% - 2*var(--gutter),var(--wrap));margin-inline:auto;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,2fr);gap:var(--space-6) var(--space-7)}
.tij .footer-identity .brand{color:var(--paper)}
.tij .footer-identity .brand-name>span{color:var(--gold-300)}
.tij .footer-identity p{margin-top:1.1rem;max-width:32ch;color:#C9BFD9}
.tij .footer-meta-links{display:grid;gap:.5rem;margin-top:1.4rem}
.tij .site-footer a{color:#EDE7F5;text-decoration:none}
.tij .site-footer a:hover{color:var(--gold-300);text-decoration:underline;text-underline-offset:.25em}
.tij .footer-meta-links a{color:var(--gold-300);font-weight:600}
.tij .footer-groups{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-5)}
.tij .footer-group{display:grid;align-content:start;gap:.15rem}
.tij .footer-group h2{font-family:var(--font-display);font-size:1.3rem;font-weight:600;color:var(--paper);margin-bottom:.6rem}
.tij .footer-group a{padding:.3rem 0;font-size:.95rem}
.tij .footer-group details summary{cursor:pointer;padding:.3rem 0;font-size:.95rem;color:#B8ACCB;list-style:none}
.tij .footer-group details summary::-webkit-details-marker{display:none}
.tij .footer-group details summary::after{content:" +"}
.tij .footer-group details[open] summary::after{content:" –"}
.tij .footer-group details a{display:block}
.tij .footer-bottom{grid-column:1/-1;display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem 2rem;padding-top:var(--space-4);border-top:1px solid rgba(220,208,235,.14);font-size:.84rem;color:#ACA0C0}
.tij .footer-bottom p{margin:0;max-width:62ch}
@media (max-width:860px){
  .tij .foot-inner{grid-template-columns:1fr}
  .tij .footer-groups{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:340px){.tij .footer-groups{grid-template-columns:1fr}}

/* ---------- Motion preference ---------- */
@media (prefers-reduced-motion:reduce){
  .tij *,.tij *::before,.tij *::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}

/* ---------- Print ---------- */
@media print{
  .tij .site-nav,.tij .site-footer .footer-groups,.tij .skip-link{display:none!important}
  body.tij{background:#fff;color:#000}
}
