/* DLN archive standard (2026-11-01)
   One source for type, header, footer, display-only forms, glow graphics and
   entrance animation. Pages link this file first; page styles handle layout only. */

/* ---------- Fonts (SIL Open Font License, see /assets/fonts/OFL.txt) ---------- */
@font-face{font-family:"DLN Archivo";src:url("../fonts/archivo.woff2") format("woff2");font-weight:100 900;font-stretch:62% 125%;font-style:normal;font-display:swap}
@font-face{font-family:"DLN Kumbh Sans";src:url("../fonts/kumbh-sans.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}

/* ---------- Tokens ---------- */
:root{
  color-scheme:dark;
  --dln-display:"DLN Archivo",Arial,Helvetica,sans-serif;
  --dln-sans:"DLN Kumbh Sans",Arial,Helvetica,sans-serif;
  --dln-teal:#4ac4b7;
  --dln-white:#ffffff;
  --dln-text:#c3c6c8;      /* body */
  --dln-strong:#e6e9e9;    /* bold emphasis in body */
  --dln-muted:#8f9497;     /* small text, company lines, captions */
  --dln-footer:#b7b7b8;    /* footer text (measured on the live site) */
  --dln-h1:52px;--dln-h2:34px;--dln-h3:24px;--dln-h4:20px;
  --dln-body:17px;--dln-small:15px;--dln-nav:20px;--dln-btn:15px;
  --dln-header-h:84px;--dln-logo-w:168px;
  --dln-frame:min(1200px,calc(100% - 116px));  /* header and footer width */
}
@media (max-width:1024px){:root{--dln-h1:44px;--dln-h2:30px;--dln-h3:22px;--dln-h4:19px;--dln-frame:calc(100% - 64px)}}
@media (max-width:767px){:root{--dln-h1:34px;--dln-h2:26px;--dln-h3:20px;--dln-h4:18px;--dln-body:16px;--dln-small:14px;--dln-header-h:72px;--dln-logo-w:145px;--dln-frame:calc(100% - 36px)}}

/* ---------- Base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--dln-header-h) + 12px)}
body.dln-std{margin:0;background:#000;color:var(--dln-text);font-family:var(--dln-sans);font-size:var(--dln-body);line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
.dln-std a{color:inherit;text-decoration:none}
.dln-std p{margin:0}
.dln-std strong,.dln-std b{font-weight:700;color:var(--dln-strong)}
.dln-std :focus-visible{outline:2px solid #5be3d4;outline-offset:4px}
.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}

/* ---------- Type roles ---------- */
.t-h1,.t-h2,.t-h3,.t-h4{font-family:var(--dln-display);font-stretch:110%;letter-spacing:0;text-transform:none;margin:0}
.t-h1{font-size:var(--dln-h1);font-weight:800;line-height:1;color:var(--dln-white)}
.t-h2{font-size:var(--dln-h2);font-weight:800;line-height:1.1;color:var(--dln-white)}
.t-h3{font-size:var(--dln-h3);font-weight:800;line-height:1.2;color:var(--dln-teal)}
.t-h4{font-size:var(--dln-h4);font-weight:700;line-height:1.3;color:var(--dln-white)}
.t-body{font-family:var(--dln-sans);font-size:var(--dln-body);font-weight:400;line-height:1.6;color:var(--dln-text)}
.t-small{font-family:var(--dln-sans);font-size:var(--dln-small);font-weight:400;line-height:1.5;color:var(--dln-muted)}
/* Colour helpers come after the size roles so they win (e.g. "t-body t-teal"). */
.t-white{color:var(--dln-white)}
.t-teal{color:var(--dln-teal)}
.t-strong{color:var(--dln-strong)}

/* ---------- Buttons ---------- */
.dln-std .dln-btn,.dln-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:45px;min-width:146px;padding:10px 25px;border-radius:100px;background:linear-gradient(105deg,#49c5bd,#2a9d96);color:#fff;font-family:var(--dln-sans);font-size:var(--dln-btn);font-weight:700;line-height:1;transition:transform .2s,filter .2s}
a.dln-btn:hover{transform:translateY(-2px);filter:brightness(1.12)}
.dln-btn.is-inactive{cursor:default;user-select:none}

/* ---------- Header ---------- */
.dln-masthead{position:sticky;top:0;z-index:2000;height:var(--dln-header-h);background:rgba(0,0,0,.97);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:background-color .3s ease}
.dln-js .dln-masthead.is-over-hero:not(.is-scrolled){background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}
.dln-masthead-inner{width:var(--dln-frame);height:100%;margin-inline:auto;display:flex;align-items:center;justify-content:space-between;gap:28px}
.dln-logo{display:inline-flex;flex-shrink:0}
.dln-logo img{display:block;width:var(--dln-logo-w);height:auto}
.dln-menu{display:flex;align-items:center;gap:30px;margin-right:42px}
.dln-menu a{font-family:var(--dln-sans);font-size:var(--dln-nav);font-weight:600;line-height:1.3;color:#fff;white-space:nowrap;transition:color .2s}
.dln-menu a:hover,.dln-menu a[aria-current="page"]{color:var(--dln-teal)}
.dln-menu-mobile{display:none;position:relative}
.dln-menu-mobile summary{list-style:none;cursor:pointer;padding:8px 13px;border:1px solid #315b56;border-radius:9px;color:#fff;font-family:var(--dln-sans);font-size:16px;font-weight:700}
.dln-menu-mobile summary::-webkit-details-marker{display:none}
.dln-menu-mobile nav{position:absolute;right:0;top:50px;min-width:190px;padding:12px;display:grid;gap:4px;background:#081b1a;border:1px solid #28534d;border-radius:14px;box-shadow:0 15px 40px #000a}
.dln-menu-mobile nav a{padding:9px 12px;border-radius:7px;font-size:17px;font-weight:600;color:#fff;white-space:nowrap}
.dln-menu-mobile nav a:hover,.dln-menu-mobile nav a[aria-current="page"]{background:#173b36;color:var(--dln-teal)}
@media (max-width:1024px){.dln-menu{display:none}.dln-menu-mobile{display:block}}

/* ---------- Footer ---------- */
.dln-sitefooter{position:relative;z-index:1;border-top:1px solid rgba(255,255,255,.08);background:#000;padding:26px 0}
.dln-sitefooter-inner{width:var(--dln-frame);margin-inline:auto;display:flex;align-items:center;justify-content:space-between;gap:16px 24px;flex-wrap:wrap;color:var(--dln-footer);font-size:var(--dln-small);line-height:1.5}
.dln-sitefooter nav{display:flex;align-items:center;gap:22px}
.dln-sitefooter a{color:var(--dln-footer);transition:color .2s}
.dln-sitefooter a:hover{color:var(--dln-teal)}
.dln-totop{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px}
.dln-totop svg{width:16px;height:16px}
@media (max-width:767px){.dln-sitefooter-inner{justify-content:center;text-align:center}}

/* ---------- Display-only contact form (forms are retired; nothing can be typed or sent) ---------- */
.dln-form-display{width:min(670px,100%);margin:0 auto;padding:40px 40px 36px;display:grid;gap:22px;text-align:left;border:1px solid #3a3d3d;border-radius:26px;background:#141616;pointer-events:none;user-select:none}
.dln-field{display:flex;align-items:center;min-height:44px;padding:8px 20px;border-radius:24px;background:#262828;color:#8a8e90;font-family:var(--dln-sans);font-size:var(--dln-small);line-height:1.3}
.dln-field.is-message{min-height:96px;align-items:flex-start;padding-top:12px;border-radius:16px}
.dln-form-submit{justify-self:start;display:inline-flex;align-items:center;justify-content:center;min-height:46px;min-width:98px;margin-top:40px;padding:8px 24px;border:1px solid #585e5e;border-radius:30px;color:var(--dln-teal);font-family:var(--dln-sans);font-size:var(--dln-btn);font-weight:700}
.dln-form-consent{display:flex;align-items:center;gap:8px;color:var(--dln-text);font-family:var(--dln-sans);font-size:var(--dln-small);line-height:1.4}
.dln-form-check{flex:0 0 14px;width:14px;height:14px;border:1px solid #d9dfdf;border-radius:2px;background:#fff}
.dln-form-consent .t-teal{color:var(--dln-teal)}
.dln-form-consent + .dln-form-submit{margin-top:18px}
@media (max-width:767px){.dln-form-display{padding:26px 20px 24px;border-radius:20px}}

/* ---------- Tick icon (teal circle with check, used in tick boxes and tick lists) ---------- */
.dln-tick{flex:0 0 18px;width:18px;height:18px;margin-top:4px}

/* ---------- Glow graphic (original WordPress dots.png; the glow is in the image) ---------- */
.dln-glow{display:block;width:min(170px,50vw);height:auto;margin-inline:auto}

/* ---------- Ambient lighting (unchanged from v1.1) ---------- */
:root{--dln-ambient-left:rgba(7,68,49,.39);--dln-ambient-right:rgba(6,64,50,.37);--dln-ambient-cycle:1660px}
body.dln-std{position:relative;min-height:100vh;isolation:isolate}
body.dln-std::after{content:"";display:block;position:absolute;inset:0;z-index:1000;pointer-events:none;background-image:radial-gradient(ellipse 44% 420px at -1% 18%,var(--dln-ambient-left),transparent 88%),radial-gradient(ellipse 41% 445px at 101% 76%,var(--dln-ambient-right),transparent 88%);background-repeat:repeat-y;background-size:100% var(--dln-ambient-cycle);mix-blend-mode:screen;opacity:.78}
@media (max-width:720px){:root{--dln-ambient-cycle:1370px}body.dln-std::after{background-image:radial-gradient(ellipse 64% 390px at -6% 16%,var(--dln-ambient-left),transparent 88%),radial-gradient(ellipse 65% 420px at 107% 75%,var(--dln-ambient-right),transparent 88%);opacity:.74}}
@media print{body.dln-std::after{display:none}}

/* ---------- Entrance animation: Elementor "fade in up", matched to the live recording ----------
   Element waits hidden until it scrolls into view, then rises by its own height while fading in
   over 1.25s. Only active when dln-site.js runs; off for visitors who ask for reduced motion. */
@keyframes dlnFadeInUp{from{opacity:0;transform:translate3d(0,100%,0)}to{opacity:1;transform:none}}
.dln-js [data-reveal]:not(.is-revealed){visibility:hidden}
.dln-js [data-reveal].is-revealed{animation:dlnFadeInUp 1.25s ease both}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .dln-js [data-reveal]:not(.is-revealed){visibility:visible}
  .dln-js [data-reveal].is-revealed{animation:none}
  .dln-btn,.dln-masthead{transition:none}
}