/* ==========================================================================
   EUROWARE — Signal colour system
   Loaded after styles.css + site.css. Every value is a token so it maps
   1:1 to Elementor Site Settings → Global Colours (names in brackets).
   ========================================================================== */
:root{
  /* Primitives */
  --ink:#20211e;            /* [Ink]        text, primary buttons, marquee   */
  --paper:#f7f6f2;          /* [Paper]      page                             */
  --eucalypt:#2f4a3f;       /* [Eucalypt]   Berlin band, trade panel         */
  --eucalypt-deep:#233830;  /* [Eucalypt Deep] footer                        */
  --sage:#dde3d6;           /* [Sage]       quiet sections, notes, summaries */
  --signal:#e0531f;         /* [Signal]     small accents on light surfaces  */
  --signal-text:#c2410c;    /* [Signal Text] signal when used as small text  */
  --signal-on-dark:#ff8a57; /* [Signal Light] signal on eucalypt / ink       */

  /* Semantic roles */
  --stone:var(--sage);      /* every legacy "stone" surface becomes sage     */
  --muted:#545c50;          /* 5.3:1 on sage, 6.3:1 on paper                 */
  --line:#cfd4c6;
  --on-dark:#f7f6f2;
  --on-dark-muted:#c3d1c6;  /* 6.1:1 on eucalypt                             */
  --on-dark-line:#4f675c;
  --focus:#2f4a3f;
  --focus-on-dark:#dde3d6;
  --control-boundary:#6d7568; /* 4.6:1 on paper */
  --rule-strong:#b9c1b1;
  --tint-light:#ffffff1f;
}

/* Browser surfaces */
::selection{background:var(--eucalypt);color:var(--paper)}
::-webkit-scrollbar-thumb{background:var(--eucalypt);border-color:var(--paper)}
html{scrollbar-color:var(--eucalypt) var(--paper)}
input,select,textarea{caret-color:var(--signal-text);border-color:var(--control-boundary)}
input:focus,select:focus,textarea:focus{outline-color:var(--focus)}
a:focus-visible,button:focus-visible,summary:focus-visible{outline-color:var(--focus)}

/* Header + navigation */
.header nav a:after{height:2px;background:var(--signal)}
.header nav a[aria-current=page]{text-decoration:none}
.header nav a[aria-current=page]:after{transform:scaleX(1)}
.shop-category-links a strong{transition:color .18s}
.header .shop-category-links a:hover strong{color:var(--eucalypt)}
.shop-dropdown-head>p .dot{color:var(--signal)}

/* Buttons + links */
.button:hover{background:var(--eucalypt);border-color:var(--eucalypt)}
.button.pale:hover{background:var(--sage);border-color:var(--sage)}
.button.light:hover{background:var(--tint-light);border-color:var(--paper)}
.button:disabled:hover{background:var(--ink);border-color:var(--ink)}
.text-link{background:linear-gradient(var(--signal),var(--signal)) 0 100%/0 2px no-repeat;transition:background-size .35s var(--ease)}
.text-link:hover{background-size:100% 2px}
.text-link:hover svg{color:var(--signal-text)}

/* Headline full stops: the one repeated signal mark */
.dot{color:var(--signal)}

/* ---------- Homepage bands ---------- */
.marquee i{border-color:var(--signal);border-top-color:transparent;border-bottom-color:transparent}
.marquee button{border-color:#5d6057}

/* Categories: row floods sage on hover, arrow turns signal */
.category-feature,.category-more>a{position:relative;isolation:isolate}
.category-feature:before,.category-more>a:before{content:'';position:absolute;inset:-4px -14px;z-index:-1;background:var(--sage);transform:scaleY(0);transform-origin:bottom;transition:transform .45s var(--ease)}
.category-feature:hover:before,.category-more>a:hover:before{transform:scaleY(1)}
.category-feature:hover svg,.category-more>a:hover svg{color:var(--signal-text)}
.category-label{border-top:2px solid var(--ink);padding-top:18px}

.intro{background:var(--sage)}

.collection{background:var(--eucalypt);color:var(--on-dark)}
.collection h2 .ew-line-inner,.collection h2 span:not([class]){color:var(--paper)}
.collection h2 .accent{color:var(--sage)}
.collection p{color:var(--on-dark-muted)}
.collection .button{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.collection .button:hover{background:var(--sage);border-color:var(--sage)}
.collection-detail{border-top-color:var(--on-dark-line)}
.collection-detail svg{color:var(--signal-on-dark)}
.collection a:focus-visible,.collection button:focus-visible{outline-color:var(--focus-on-dark)}

.material{background:var(--paper)}

.trade{background:var(--eucalypt);color:var(--on-dark)}
.trade em{color:var(--signal-on-dark)}
.trade-head p+p{color:var(--on-dark-muted)}
.trade-steps{border-top-color:var(--on-dark-line);counter-reset:step}
.trade-steps>div{counter-increment:step}
.trade-steps span:before{content:counter(step,decimal-leading-zero);display:block;font-size:13px;font-weight:600;color:var(--signal-on-dark);margin-bottom:14px;letter-spacing:.02em}
.trade-steps p{color:var(--on-dark-muted)}
.trade a:focus-visible,.trade button:focus-visible{outline-color:var(--focus-on-dark)}
.trade .text-link{color:var(--on-dark)}

details[open] summary svg{color:var(--signal-text)}
summary:hover{color:var(--eucalypt)}

.contact{background:var(--sage)}

/* ---------- Footer (reversed) ---------- */
.full-footer{background:var(--eucalypt-deep);color:var(--on-dark);border-top:0}
.full-footer .footer-top,.footer-social,.full-footer .footer-bottom{border-color:var(--on-dark-line)}
.full-footer .footer-column h2,.full-footer .footer-bottom,.full-footer .footer-social small,.full-footer .footer-social [aria-disabled]{color:var(--on-dark-muted)}
.full-footer .footer-column a:hover{text-decoration-color:var(--signal-on-dark)}
.full-footer .text-link{background-image:linear-gradient(var(--signal-on-dark),var(--signal-on-dark))}
.full-footer .text-link:hover svg{color:var(--signal-on-dark)}
.full-footer a:focus-visible{outline-color:var(--focus-on-dark)}

/* ---------- Internal pages ---------- */
/* Title band runs full bleed without extra markup (Elementor: section bg = Sage) */
.page-title{background:var(--sage);box-shadow:0 0 0 100vmax var(--sage);clip-path:inset(0 -100vmax);margin-bottom:70px}
.page-title>p{color:var(--muted)}
.category-page .page-title,.policy-title{margin-bottom:60px}
.trade.section+.editorial-feature{padding-top:110px}
.steps{counter-reset:step}
.steps article{counter-increment:step;border-top:2px solid var(--ink)}
.steps article:before{content:counter(step,decimal-leading-zero);display:block;font-size:13px;font-weight:600;color:var(--signal-text);margin-bottom:16px}
.category-types a{transition:color .18s}
.category-types a:hover{color:var(--eucalypt)}
.category-types a svg{transition:translate .3s var(--ease)}
.category-types a:hover svg{translate:4px 0}
.category-types a:hover svg{color:var(--signal-text)}
.collection-directory>section{border-top:2px solid var(--ink)}
.collection-directory h2{transition:color .2s}
.collection-directory>section:hover h2{color:var(--eucalypt)}
.support-links>a:hover h2{color:var(--eucalypt)}
.support-links>a:hover svg{color:var(--signal-text)}
.tabs button[aria-selected=true]{border-color:var(--signal)}
.finish-options button[aria-pressed=true]{border-color:var(--eucalypt)}
.policy-toc a:hover{color:var(--eucalypt)}
.policy-preview{border-left-width:1px}
.summary-line{border-bottom-color:var(--rule-strong)}
.toast{background:var(--eucalypt)}
.breadcrumbs a:hover{color:var(--eucalypt)}

@media(max-width:800px){
  .page-title{margin-bottom:45px}
  .trade.section+.editorial-feature{padding-top:65px}
  .category-feature:before,.category-more>a:before{inset:-4px -8px}
}
@media(prefers-reduced-motion:reduce){
  .category-feature:before,.category-more>a:before,.text-link{transition:none}
}
.collection h2{align-self:stretch}
