/* DECT / controlled refinements — hero, About timeline, mobile portal, current page.
   Brand palette: deep navy #0b1727, DECT blue #3273a6, gold #bca06f, cream #f7f5ef. */

/* 1. Home: richer, visibly flowing blue + warm champagne aurora.
   Lights stay behind the content and never flash. */
.hero.dect-glow-hero { background:#091626!important; }
.hero.dect-glow-hero .dect-glow-field { background:#071321; }
.hero.dect-glow-hero .dect-glow-field::before {
  opacity:1; filter:contrast(151%) saturate(163%);
  animation:dect-aurora-turn 19s ease-in-out infinite alternate!important;
}
.hero.dect-glow-hero .dect-glow-field .glow-a {
  opacity:.52!important;filter:blur(31px);
  animation-duration:13s!important;
}
.hero.dect-glow-hero .dect-glow-field .glow-b {
  opacity:.42!important;filter:blur(38px);
  animation-duration:17s!important;
}
.hero.dect-glow-hero .dect-glow-field .glow-c {
  width:78%;height:60%;right:-7%;top:36%;opacity:.88!important;
  background:radial-gradient(ellipse at 46% 54%,rgba(225,191,124,.86) 0%,rgba(190,151,85,.58) 20%,rgba(136,102,59,.26) 43%,transparent 69%);
  filter:blur(39px);
  animation-duration:14s!important;
}
.hero.dect-glow-hero .dect-glow-field .glow-d {
  opacity:.46!important;filter:blur(33px);
  animation-duration:18s!important;
}
.hero.dect-glow-hero .dect-glow-field .glow-e {
  width:74%;height:34%;left:-18%;top:4%;border-radius:55%;opacity:.62!important;
  background:linear-gradient(96deg,transparent 5%,rgba(165,127,71,.02) 20%,rgba(219,180,114,.74) 42%,rgba(250,219,153,.77) 52%,rgba(162,131,90,.31) 70%,transparent 90%);
  filter:blur(31px);transform:rotate(-24deg);
  animation:dect-aurora-wave-e 16s ease-in-out infinite alternate;
}
@keyframes dect-aurora-wave-e {
  0%{transform:translate3d(-17%,12%,0) rotate(-24deg) scale(.95)}
  50%{transform:translate3d(14%,-6%,0) rotate(-12deg) scale(1.12)}
  100%{transform:translate3d(22%,8%,0) rotate(-22deg) scale(1)}
}
/* Preserve a readable dark island around the text. */
.hero.dect-glow-hero .dect-glow-field::after {
  background:radial-gradient(ellipse 42% 34% at 50% 47%,rgba(7,18,34,.86),rgba(7,18,34,.28) 80%,transparent 99%),
             linear-gradient(0deg,#07101de6,transparent 25%,transparent 81%,#07101da8);
}
@media(max-width:700px){
  .hero.dect-glow-hero .dect-glow-field .glow-e{top:5%;left:-35%;width:116%;filter:blur(41px)}
  .hero.dect-glow-hero .dect-glow-field .glow-c{width:105%;right:-27%;filter:blur(45px);opacity:.67!important}
}

/* 2. About: official logo replaces typed brand letters. */
.about-layout .about-official-logo {
  display:block;width:min(100%,460px);height:auto;max-height:220px;object-fit:contain;
  object-position: center;justify-self:center;
  filter:drop-shadow(0 14px 24px rgba(16,31,51,.09));
}
@media(max-width:850px){.about-layout .about-official-logo{width:min(78%,360px);justify-self:start;object-position:start}}
[dir=rtl] .about-layout .about-official-logo{object-position:right center}

/* 3. About: step timeline inspired by the horizontal reference, but with DECT's process and content. */
.dect-process-section{background:#eeeae2;color:#1d2937;padding:clamp(70px,8vw,116px) 0;}
.dect-process-wrap{max-width:1320px;}
.dect-process-heading{display:flex;flex-direction:column;align-items:center;text-align:center;margin:0 auto 37px;max-width:760px;}
.dect-process-heading .eyebrow{color:#9b7b49!important;margin:0 0 13px;font-size:.72rem;letter-spacing:.15em}
.dect-process-heading h2{font-size:clamp(2.2rem,4.5vw,4.15rem);font-weight:650;letter-spacing:-.058em;line-height:1.15;color:#1d2d40;margin:0 0 15px;}
.dect-process-heading>p:last-child{max-width:580px;margin:0;color:#615d57;font-size:.95rem;line-height:1.75;}
.dect-process-panel{
  padding:clamp(27px,4vw,51px);background:linear-gradient(145deg,#fdfcf9,#f8f6f1);
  border:1px solid #d9d1c4;border-radius:22px;
  box-shadow:0 25px 65px rgba(38,45,52,.065),inset 0 1px 0 rgba(255,255,255,.94);
}
.dect-process-track{--timeline-left:15px;list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  gap:clamp(13px,2.6vw,40px);position:relative;padding:0;margin:0;}
.dect-process-track::before{content:"";position:absolute;inset-block-start:18px;inset-inline:17px;
  height:2px;background:linear-gradient(90deg,#bca06f,#779abb 50%,#bca06f);opacity:.58;pointer-events:none;}
.dect-process-step{position:relative;min-width:0;}
.dect-process-marker{position:relative;z-index:1;width:38px;height:38px;border-radius:50%;
  display:grid;place-items:center;background:#fdfcf9;border:2px solid #b6a58a;
  color:#956d36;box-shadow:0 0 0 7px #fdfcf9;font-size:.67rem;font-weight:750;letter-spacing:.03em;
  transition:border-color .25s,background .25s,box-shadow .25s,transform .25s;}
.dect-process-copy{padding:28px 3px 2px;}
.dect-process-kicker{display:block;font-size:.66rem;letter-spacing:.16em;font-weight:800;color:#a08050;margin-bottom:14px;}
.dect-process-copy h3{font-size:clamp(1.35rem,2vw,1.85rem);letter-spacing:-.04em;line-height:1.22;
  font-weight:700;color:#1d3048;margin:0 0 12px;}
.dect-process-copy p{font-size:clamp(.81rem,.96vw,.93rem);line-height:1.75;color:#655f56;margin:0;max-width:27ch;}
@media(hover:hover) and (pointer:fine){
  .dect-process-step:hover .dect-process-marker{border-color:#bca06f;background:#172f4c;color:#fbf6e9;
    box-shadow:0 0 0 7px #fdfcf9,0 0 23px rgba(188,160,111,.38);transform:scale(1.07);}
}
@media(max-width:800px){
  .dect-process-panel{padding:28px 30px;}
  .dect-process-track{display:grid;grid-template-columns:1fr;gap:0;}
  .dect-process-track::before{inset-block:18px 18px;inset-inline-start:18px;inset-inline-end:auto;width:2px;height:auto;
    background:linear-gradient(180deg,#bca06f,#779abb 55%,#bca06f);}
  .dect-process-step{display:grid;grid-template-columns:38px minmax(0,1fr);gap:23px;padding-bottom:24px;}
  .dect-process-step:last-child{padding-bottom:0;}
  .dect-process-marker{grid-column:1;grid-row:1;}
  .dect-process-copy{grid-column:2;grid-row:1;padding:1px 0 0;}
  .dect-process-copy h3{margin-bottom:9px;}
  .dect-process-copy p{max-width:60ch;}
}
@media(max-width:450px){
  .dect-process-section{padding:60px 0;}
  .dect-process-heading{margin-bottom:27px;}
  .dect-process-panel{padding:24px 18px;border-radius:17px;}
  .dect-process-step{gap:18px;}
  .dect-process-copy h3{font-size:1.43rem;}
}
[dir=rtl] .dect-process-heading h2,[dir=rtl] .dect-process-copy h3{letter-spacing:0;}

/* 4. Nav: subtle blue edge identifies the current page, on desktop AND bottom dock. */
.dock a[aria-current="page"] {
  outline:2px solid #367cb4!important;outline-offset:-2px!important;
  border:1px solid rgba(207,231,249,.85)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.32),0 0 0 3px rgba(50,115,166,.16),0 4px 16px rgba(36,100,150,.18)!important;
}
.dock a[aria-current="page"]:hover,.dock a[aria-current="page"]:focus-visible{
  outline-color:#2e83be!important;box-shadow:0 0 0 4px rgba(50,115,166,.23),0 6px 18px rgba(36,100,150,.23)!important;
}

.dock-client-label-short{display:none;}
/* 5. The blue portal pill in the mobile header reveals its purpose toward the logo.
   The language selector shifts naturally as the pill widens, not overlaying the label. */
@media(max-width:850px){
  .header .header-inner .brand-image{transition:width .36s cubic-bezier(.2,.75,.3,1);}
  .header-actions>.dock-support{
    display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:0!important;
    min-width:40px!important;width:42px!important;max-width:none!important;
    border-radius:999px!important;overflow:hidden!important;direction:inherit;
    background:#3273a6!important;color:#fff!important;
    box-shadow:0 4px 14px rgba(50,115,166,.29),inset 0 1px 1px rgba(255,255,255,.37)!important;
    transition:width .38s cubic-bezier(.2,.8,.2,1),background .3s ease,box-shadow .3s ease!important;
    flex-shrink:0!important;
  }
  .header-actions>.dock-support .dock-client-label-full{display:none!important;}
  .header-actions>.dock-support .dock-client-label-short{display:inline!important;}
  .header-actions>.dock-support .dock-support-text{
    display:inline-block!important;position:static!important;
    max-width:0!important;width:auto!important;height:auto!important;font-size:.7rem!important;
    font-weight:800!important;line-height:1!important;color:#fff;opacity:0;white-space:nowrap;
    overflow:hidden!important;margin-inline-end:0!important;
    transition:max-width .38s cubic-bezier(.2,.8,.2,1),opacity .2s ease,margin .38s ease!important;
  }
  .header-actions>.dock-support svg {flex:0 0 19px!important;width:19px!important;height:19px!important;}
  .header-actions>.dock-support:is(:hover,:focus,:focus-visible){
    width:126px!important;background:linear-gradient(125deg,#224c75,#3273a6 63%,#446c91)!important;
    box-shadow:0 6px 23px rgba(30,91,149,.32),0 0 0 2px rgba(188,160,111,.38),0 0 20px rgba(188,160,111,.23),inset 0 1px 0 rgba(255,255,255,.32)!important;
  }
  .header-actions>.dock-support:is(:hover,:focus,:focus-visible) .dock-support-text{
    max-width:82px!important;opacity:1!important;margin-inline-end:9px!important;
  }
  .header .header-inner:has(.dock-support:is(:hover,:focus,:focus-visible)) .brand-image {width:91px!important;}
}
@media(min-width:601px) and (max-width:850px){
  .header .header-inner:has(.dock-support:is(:hover,:focus,:focus-visible)) .brand-image {width:120px!important;}
}
@media(max-width:420px){
  .header-actions>.dock-support:is(:hover,:focus,:focus-visible){width:109px!important;}
  .header-actions>.dock-support:is(:hover,:focus,:focus-visible) .dock-support-text{max-width:62px!important;margin-inline-end:6px!important;font-size:.66rem!important;}
  .header .header-inner:has(.dock-support:is(:hover,:focus,:focus-visible)) .brand-image{width:77px!important;}
}
@media(max-width:365px){
  .header .header-inner:has(.dock-support:is(:hover,:focus,:focus-visible)) .brand-image{width:66px!important;}
  .header .language-switch a{min-width:26px!important;padding-inline:4px!important;}
  .header .header-actions{gap:5px!important;}
}
@media(prefers-reduced-motion:reduce){
  .hero.dect-glow-hero .dect-glow-field::before,.hero.dect-glow-hero .dect-glow-field .glow-e{animation:none!important;}
  .hero.dect-glow-hero .dect-glow-field>span{animation:none!important;}
  .header-actions>.dock-support,.header-actions>.dock-support .dock-support-text,
  .header .header-inner .brand-image,.dect-process-marker{transition:none!important;}
}
