/* EUKLI v10 — product colour layer.
   Loads after clarity-v9.css. Changes colour only: layout, type, motion and logos stay as they are.
   Shorts Voca = navy, Now day = tangerine. Company pages keep the EUKLI navy. */
:root{
  --sv:#14307F;        /* Shorts Voca — brand navy */
  --sv-deep:#091A4B;
  --sv-ink:#0B1A45;
  --sv-tint:#E1E7F6;
  --sv-soft:#F1F4FB;
  --nd:#FF5A1E;        /* Now day */
  --nd-strong:#D43C10; /* headings on white */
  --nd-deep:#2B0C00;
  --nd-tint:#FFE5D8;
  --nd-soft:#FFF4EE;
}

/* ───────── Phone mockups (every page) ───────── */
.phone-voca .app-sub strong,.phone-voca .sound-symbol,.phone-voca .voca-word-card>small{color:var(--sv)}
.phone-voca .app-nav .selected{color:var(--sv)}
.phone-voca .voca-word-card{background:var(--sv);border-color:var(--sv);box-shadow:0 14px 30px rgba(20,48,127,.3);color:#fff}
.phone-voca .voca-word-card>small{color:rgba(255,255,255,.72)}
.phone-voca .voca-word-card>span:not(.sound-symbol){color:rgba(255,255,255,.7)}
.phone-voca .voca-word-card>p{color:rgba(255,255,255,.82)}
.phone-voca .voca-word-card .sound-symbol{color:#fff}
.phone-voca .word-rule{background:rgba(255,255,255,.22)}
.phone-voca .collection-icon{background:var(--sv-tint);color:var(--sv)}
.phone-voca .collection-row:first-of-type .collection-icon{background:var(--sv);color:#fff}
.phone-voca .screen-foot{background:var(--sv-soft);color:var(--sv)}
.phone-voca .quiz-progress span{background:var(--sv)}
.phone-voca .quiz-options span:first-child{border-color:var(--sv);background:var(--sv);color:#fff}
.phone-voca .screen-title small{color:var(--sv)}

.phone-now .app-nav .selected{color:var(--nd)}
.phone-now .now-week .today{color:var(--nd-strong)}
.phone-now .now-week .today b{background:var(--nd)}
.phone-now .now-current{background:var(--nd);border-color:var(--nd);color:var(--nd-deep)}
.phone-now .now-current small,.phone-now .now-current>span{color:rgba(43,12,0,.72)}
.phone-now .now-current i{background:var(--nd-deep)}
.phone-now .timeline-item time{color:var(--nd-strong);font-weight:700}
.phone-now .day-clock{background:conic-gradient(var(--nd) 0deg 78deg,#FFB08F 78deg 154deg,var(--nd-tint) 154deg 220deg,var(--nd-deep) 220deg 285deg,#F4ECE7 285deg)}
.phone-now .day-clock-inner small{color:var(--nd-strong)}
.phone-now .clock-legend span:nth-child(1){color:var(--nd-strong)}
.phone-now .week-grid b{background:var(--nd-soft);color:var(--nd-strong)}
.phone-now .week-grid span:not(:nth-child(3)):not(:nth-child(n+6)) b{background:var(--nd);color:#fff}
.phone-now .reflection-card div span{background:var(--nd);color:var(--nd-deep)}
.phone-now .reflection-card div span+span{background:var(--nd-soft);color:#9A5A3E}

/* ───────── Home ───────── */
.hero-story-slide[data-story-step="1"] h2 em{color:var(--sv)}
.hero-story-slide[data-story-step="2"] h2 em{color:var(--nd-strong)}

.hp-track[data-home-product="voca"] .hp-art{background:var(--sv);border-color:var(--sv)}
.hp-track[data-home-product="voca"] .hp-art-grid{background-image:linear-gradient(rgba(255,255,255,.13) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.13) 1px,transparent 1px)}
.hp-track[data-home-product="voca"] .hp-preview .phone{filter:drop-shadow(0 26px 34px rgba(6,10,80,.38))}
.hp-track[data-home-product="voca"] .hp-serial,
.hp-track[data-home-product="voca"] .hp-step{color:var(--sv)}
.hp-track[data-home-product="voca"] .hp-product-name:hover,
.hp-track[data-home-product="voca"] .hp-detail-link:hover{color:var(--sv)}
.hp-track[data-home-product="voca"] .hp-detail-link{border-color:var(--sv)}
.hp-track[data-home-product="voca"] .hp-development{border-color:var(--sv-tint);background:var(--sv-soft);color:var(--sv)}
.hp-track[data-home-product="voca"] .hp-progress-bars i::after{background:var(--sv)}

.hp-track[data-home-product="now"] .hp-art{background:var(--nd);border-color:var(--nd)}
.hp-track[data-home-product="now"] .hp-art-grid{background-image:linear-gradient(rgba(43,12,0,.11) 1px,transparent 1px),linear-gradient(90deg,rgba(43,12,0,.11) 1px,transparent 1px)}
.hp-track[data-home-product="now"] .hp-preview .phone{filter:drop-shadow(0 26px 34px rgba(80,22,0,.35))}
.hp-track[data-home-product="now"] .hp-serial,
.hp-track[data-home-product="now"] .hp-step{color:var(--nd-strong)}
.hp-track[data-home-product="now"] .hp-now-word{color:var(--nd)}
.hp-track[data-home-product="now"] .hp-product-name:hover,
.hp-track[data-home-product="now"] .hp-detail-link:hover{color:var(--nd-strong)}
.hp-track[data-home-product="now"] .hp-detail-link{border-color:var(--nd)}
.hp-track[data-home-product="now"] .hp-development{border-color:var(--nd-tint);background:var(--nd-soft);color:var(--nd-strong)}
.hp-track[data-home-product="now"] .hp-progress-bars i::after{background:var(--nd)}

/* ───────── Products index ───────── */
.inner-product-grid .inner-product{border:0}
.inner-product-grid .inner-product:hover{transform:translateY(-6px)}
.inner-product-grid .inner-product:first-child{background:var(--sv);color:#fff}
.inner-product-grid .inner-product:first-child .inner-product-label{color:rgba(255,255,255,.78)}
.inner-product-grid .inner-product:first-child h2{color:#fff}
.inner-product-grid .inner-product:first-child p{color:rgba(255,255,255,.84)}
.inner-product-grid .inner-product:first-child b{color:#fff}
.inner-product-grid .inner-product:first-child .soft-orbit{border-color:rgba(255,255,255,.28);box-shadow:0 0 0 50px rgba(255,255,255,.07)}
.inner-product-grid .inner-product:first-child .inner-product-art img{box-shadow:0 22px 50px rgba(6,10,80,.4)}
.inner-product-grid .inner-product:nth-child(2){background:var(--nd);color:var(--nd-deep)}
.inner-product-grid .inner-product:nth-child(2) .inner-product-label{color:rgba(43,12,0,.7)}
.inner-product-grid .inner-product:nth-child(2) h2,
.inner-product-grid .inner-product:nth-child(2) b,
.inner-product-grid .inner-product:nth-child(2) .now-artword{color:var(--nd-deep)}
.inner-product-grid .inner-product:nth-child(2) p{color:rgba(43,12,0,.8)}
.inner-product-grid .inner-product:nth-child(2) .soft-orbit{border-color:rgba(43,12,0,.16);box-shadow:0 0 0 50px rgba(255,255,255,.12)}

/* ───────── Shorts Voca detail ───────── */
body.product-voca{--navy:var(--sv-deep);--blue:var(--sv)}
.product-voca .site-header{background:var(--sv);border-bottom-color:rgba(255,255,255,.16)}
.product-voca .site-header .main-nav a,.product-voca .site-header .nav-locale{color:rgba(255,255,255,.86)}
.product-voca .site-header:after{background:#fff}
.product-voca .detail-hero{background:var(--sv)}
.product-voca .detail-hero::before{background-image:linear-gradient(rgba(255,255,255,.11) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.11) 1px,transparent 1px)}
.product-voca .detail-hero::after{border-color:rgba(255,255,255,.22);box-shadow:0 0 0 80px rgba(255,255,255,.035),0 0 0 160px rgba(255,255,255,.025)}
.product-voca .detail-hero .back-link,.product-voca .detail-eyebrow{color:rgba(255,255,255,.74)}
.product-voca .detail-eyebrow span{color:#fff}
.product-voca .detail-lead{color:rgba(255,255,255,.86)}
.product-voca .detail-hero .arrow-link:hover{color:var(--sv-tint)}
.product-voca .detail-hero-art::before{background:radial-gradient(circle at 55% 44%,rgba(255,255,255,.2),transparent 69%);border-color:rgba(255,255,255,.24)}
.product-voca .detail-hero-logo{background:#fff;border-color:#fff;box-shadow:0 14px 36px rgba(6,10,80,.32);backdrop-filter:none}
.product-voca .detail-hero-phone{filter:drop-shadow(0 35px 42px rgba(6,10,80,.4))}
.product-voca .detail-intro{background:var(--sv-deep);border-color:var(--sv-deep)}
.product-voca .detail-intro h2{color:#fff}
body.product-voca .features-heading h2{color:var(--sv)!important}
body.product-voca .feature-story-track .feature-copy h3,
body.product-voca .feature-copy h3,
body.product-voca .mobile-feature-description h3{color:var(--sv-ink)!important}
body.product-voca .feature-copy p,body.product-voca .mobile-feature-description p{color:#3E4470}
body.product-voca .feature-no,body.product-voca .feature-story-track .feature-no{color:var(--sv)}
.product-voca .feature-copy.is-current{border-left-color:var(--sv)}
body.product-voca .feature-story-track .feature-stage{background:var(--sv);border-color:var(--sv)}
body.product-voca .feature-story-track .feature-stage::before{border-color:rgba(255,255,255,.22)}
body.product-voca .feature-story-track .feature-preview .phone{box-shadow:0 26px 50px rgba(6,10,80,.4)}
body.product-voca .mobile-preview{background:var(--sv);border-color:var(--sv)}
.product-voca .feature-story-progress{color:var(--sv)}
.product-voca .feature-progress-bars i::before{background:var(--sv)}
.product-voca .detail-outro{background:var(--sv)}
.product-voca .detail-outro .section-number{color:rgba(255,255,255,.7)}
.product-voca .detail-outro-inner>p{color:rgba(255,255,255,.84)}
.product-voca .other-product-link{color:rgba(255,255,255,.84);border-color:rgba(255,255,255,.3)}
.product-voca .product-extra .extra-grid article{border-color:var(--sv)}
.product-voca .product-extra .extra-index,.product-voca .product-extra .editorial-kicker{color:var(--sv)}
.product-voca .product-extra h2,.product-voca .product-extra .extra-grid h3{color:var(--sv-ink)}
.product-voca .product-banner{background:var(--sv-deep)}
.product-voca .product-banner p{color:rgba(255,255,255,.8)}
.product-voca .product-banner a{border-color:#fff}
.product-voca .footer{background:var(--sv-deep)}
.product-voca .footer-top p,.product-voca .footer-bottom{color:rgba(255,255,255,.7)}
.product-voca .footer-bottom a{color:#fff}

/* ───────── Now day detail ───────── */
body.product-now{--navy:var(--nd-deep);--blue:var(--nd-strong)}
.product-now .site-header{background:var(--nd);border-bottom-color:rgba(43,12,0,.12)}
.product-now .site-header .main-nav a,.product-now .site-header .nav-locale{color:var(--nd-deep)}
.product-now .site-header .main-nav a:hover{color:#fff}
.product-now .site-header .language-switch{background:transparent;color:var(--nd-deep);border-color:rgba(43,12,0,.3)}
.product-now .site-header:after{background:var(--nd-deep)}
.product-now .detail-hero{background:var(--nd);border-bottom:0}
.product-now .detail-hero::before{background:radial-gradient(circle,rgba(255,255,255,.26),rgba(255,255,255,.06) 45%,transparent 72%)}
.product-now .detail-hero::after{background-image:linear-gradient(rgba(43,12,0,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(43,12,0,.08) 1px,transparent 1px)}
.product-now .detail-eyebrow,.product-now .back-link{color:rgba(43,12,0,.7)}
.product-now .detail-eyebrow span{color:var(--nd-deep)}
.product-now .detail-hero h1{color:var(--nd-deep)}
.product-now .detail-lead{color:rgba(43,12,0,.82)}
.product-now .detail-hero .arrow-link{color:var(--nd-deep);border-color:var(--nd-deep)}
.product-now .detail-hero .arrow-link:hover{color:#fff}
.product-now .detail-hero-art::before{background:rgba(255,255,255,.2);border-color:rgba(43,12,0,.14)}
.product-now .detail-hero-logo{background:#fff;border-color:#fff;box-shadow:0 14px 36px rgba(80,22,0,.25)}
.product-now .detail-now-word{color:var(--nd-deep)}
.product-now .detail-now-word>span{color:var(--nd)}
.product-now .detail-hero-phone{filter:drop-shadow(0 35px 42px rgba(80,22,0,.32))}
.product-now .detail-intro{background:var(--nd-deep);border-color:var(--nd-deep)}
.product-now .detail-intro h2{color:var(--nd)}
.product-now .feature-section{background:#fff}
body.product-now .features-heading h2{color:var(--nd-strong)!important}
body.product-now .feature-story-track .feature-copy h3,
body.product-now .feature-copy h3,
body.product-now .mobile-feature-description h3{color:var(--nd-deep)!important}
body.product-now .feature-copy p,body.product-now .mobile-feature-description p{color:#6B4A3C}
body.product-now .feature-no,body.product-now .feature-story-track .feature-no{color:var(--nd-strong)}
.product-now .feature-copy.is-current{border-left-color:var(--nd)}
body.product-now .feature-story-track .feature-stage{background:var(--nd);border-color:var(--nd)}
body.product-now .feature-story-track .feature-stage::before{border-color:rgba(43,12,0,.14)}
body.product-now .feature-story-track .feature-preview .phone{box-shadow:0 26px 50px rgba(80,22,0,.32)}
body.product-now .mobile-preview{background:var(--nd);border-color:var(--nd)}
.product-now .feature-story-progress{color:var(--nd-strong)}
.product-now .feature-progress-bars i::before{background:var(--nd)}
.product-now .detail-outro{background:var(--nd);color:var(--nd-deep)}
.product-now .detail-outro h2{color:var(--nd-deep)}
.product-now .detail-outro .section-number{color:rgba(43,12,0,.66)}
.product-now .detail-outro-inner>p{color:rgba(43,12,0,.8)}
.product-now .other-product-link{border-color:rgba(43,12,0,.25);color:rgba(43,12,0,.8)}
.product-now .other-product-link strong{color:var(--nd-deep)}
.product-now .product-extra{background:#fff}
.product-now .product-extra .extra-grid article{border-color:var(--nd)}
.product-now .product-extra .extra-index,.product-now .product-extra .editorial-kicker{color:var(--nd-strong)}
.product-now .product-extra h2,.product-now .product-extra .extra-grid h3{color:var(--nd-deep)}
.product-now .product-banner{background:var(--nd-deep);color:#fff}
.product-now .product-banner h2{color:var(--nd)}
.product-now .product-banner p{color:rgba(255,255,255,.78)}
.product-now .product-banner a{border-color:var(--nd);color:#fff}
.product-now .footer{background:var(--nd-tint)}
.product-now .footer-bottom{border-color:rgba(43,12,0,.12);color:rgba(43,12,0,.62)}
.product-now .footer-top p{color:rgba(43,12,0,.7)}
.product-now .footer-bottom a{color:var(--nd-deep)}

@media(max-width:760px){
 .product-voca .site-header .menu-toggle{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.4)}
 .product-voca .site-header .main-nav{background:var(--sv);border-color:rgba(255,255,255,.18)}
 .product-now .site-header .menu-toggle{background:transparent;border-color:rgba(43,12,0,.3)}
 .product-now .site-header .menu-toggle span{background:var(--nd-deep)}
 .product-now .site-header .main-nav{background:var(--nd);border-color:rgba(43,12,0,.15)}
}