/* Anankelis palette from the supplied October 2026 brief. Shared static styles. */
html:root[data-brand="anankelis"] {
  color-scheme:light;
  --brand-ink:#1d1c23; --brand-green:#27443d; --brand-gold:#c08542;
  --brand-blue:#1b5b96; --brand-sage:#e4ede9; --brand-sand:#fbf4ea;
  --ground:#fff; --surface:#fff; --surface-2:#eef3f0; --ink:var(--brand-ink);
  --ink-soft:#53615b; --ink-faint:#626f69; --line:#dce2df; --line-strong:#b8c8bf;
  --accent:var(--brand-green); --accent-2:#355c50; --accent-ghost:#e4ede9;
  --warn:#98551d; --warn-ghost:#fbf0e3; --crit:#af342b; --crit-ghost:#fbeeea;
  --shadow:0 2px 8px #1d1c2308,0 16px 40px -24px #27443d30;
  --sans:"Aptos Narrow","Segoe UI",Arial,sans-serif;
  --mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  --bg:var(--ground); --card:var(--surface); --soft:var(--ink-soft); --ghost:var(--accent-ghost);
}
html[data-brand] body { font-family:var(--sans); background:var(--ground); color:var(--ink); }
html[data-brand] .wrap { max-width:1240px; padding-inline:28px; }
html[data-brand] a { text-underline-offset:4px; }
html[data-brand] :is(a,button,summary):focus-visible { outline:2px solid var(--brand-blue); outline-offset:4px; }
html[data-brand] h1 { font-weight:650; letter-spacing:-.035em; }
html[data-brand] h2 { font-weight:650; letter-spacing:-.025em; }
html[data-brand] .eyebrow { font-family:var(--sans); font-size:11px; letter-spacing:.16em; font-weight:700; }
html[data-brand] .brand-section h2 { color:var(--brand-green); }
html[data-brand] .brand-section { --section-ground:#fff; background:var(--section-ground); box-shadow:0 0 0 100vmax var(--section-ground); clip-path:inset(0 -100vmax); }
html[data-brand] .brand-section[data-tone="sand"] { --section-ground:var(--brand-sand); }
html[data-brand] .brand-section[data-tone="sage"] { --section-ground:var(--brand-sage); }
html[data-brand] .eyebrow[data-section]::before { content:attr(data-section) " /"; width:auto; height:auto; background:none; opacity:1; color:var(--brand-ink); }
html[data-brand] :is(.grid,.steps,.surfaces,.grid2,.versus,.ba,.demo,.console,.agent,.note,.card,.callout) { border-radius:12px; }
html[data-brand] :is(.btn-primary,.btn-add,.mailbtn,.download) { color:#fff; background:var(--brand-green); }
html[data-brand] .install-cta { background:var(--brand-green); color:#fff; font-family:var(--sans); font-size:14px; border-radius:999px; padding:12px 20px; }
html[data-brand] .install-cta:hover { background:var(--accent-2); }
html[data-brand] .install-cta[aria-disabled="true"] { color:var(--ink-soft); background:var(--surface-2); }
/* Every navigation and language destination works without JavaScript. */
html[data-brand] .site-header { background:#fff; position:relative; z-index:2; }
html[data-brand] .site-nav { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:28px; max-width:1240px; min-height:72px; margin:0 auto; padding:12px 28px; border:0; font:14px/1.4 var(--sans); }
html[data-brand] .site-brand { display:inline-flex; align-items:center; gap:10px; color:var(--brand-ink); text-decoration:none; white-space:nowrap; }
.site-brand img { display:block; width:40px; height:40px; object-fit:contain; }
.site-wordmark { font-size:17px; font-weight:750; letter-spacing:.22em; }
.site-wordmark small { display:block; margin-top:3px; color:var(--ink-soft); font-size:9px; font-weight:600; letter-spacing:.12em; }
.site-nav-links { display:flex; align-items:center; justify-content:center; gap:4px; min-width:0; }
html[data-brand] .site-nav-links a { padding:9px 10px; color:var(--ink-soft); text-decoration:none; white-space:nowrap; border-radius:6px; }
html[data-brand] .site-nav-links a:hover { color:var(--brand-green); background:var(--brand-sage); }
html[data-brand] .site-nav-links a[aria-current="page"] { color:var(--brand-green); font-weight:700; background:var(--brand-sage); }
html[data-brand] .site-nav-links .site-nav-cta { margin-left:8px; border:1px solid var(--line-strong); border-radius:999px; color:var(--brand-ink); }
.site-languages { display:flex; gap:2px; align-items:center; }
html[data-brand] .site-languages a { padding:8px 5px; color:var(--ink-soft); font-size:11px; font-weight:600; text-decoration:none; }
html[data-brand] .site-languages a[aria-current] { color:var(--brand-green); text-decoration:underline; text-decoration-color:var(--brand-gold); text-decoration-thickness:2px; }
.site-header-line { height:1px; background:var(--brand-blue); position:relative; }
.site-header-line::after { content:""; position:absolute; left:max(28px,calc((100% - 1184px)/2)); top:-4px; width:9px; height:9px; box-sizing:border-box; border:2px solid var(--brand-gold); border-radius:50%; background:#fff; }
html[data-brand] .template-languages { margin:20px 0; width:fit-content; }
html[data-brand] .site-breadcrumb { display:flex; flex-wrap:wrap; justify-content:flex-start; gap:8px; margin:0; padding:22px 0 0; color:var(--ink-soft); font:12px/1.5 var(--sans); border:0; }
.site-breadcrumb a { color:var(--brand-green); }
.brand-banner { display:flex; justify-content:center; background:#031b18; border-bottom:1px solid #6c542c; }
.brand-banner img { display:block; width:100%; height:clamp(88px,10vw,144px); object-fit:cover; object-position:center 20%; }
/* The original checkpoint keeps its own light surfaces and interactions. */
html[data-site-page="index"] .hero { padding:72px 0 80px; background:var(--brand-green); box-shadow:0 0 0 100vmax var(--brand-green); clip-path:inset(0 -100vmax); }
html[data-site-page="index"] .hero-grid { grid-template-columns:minmax(0,1.08fr) minmax(0,1fr); gap:64px; align-items:center; }
html[data-site-page="index"] .hero-copy { --ink:#fff; --ink-soft:#dce2df; --ink-faint:#bdcac3; gap:22px; }
html[data-site-page="index"] .hero h1 { color:#fff; font-size:clamp(2.6rem,4.4vw,4rem); line-height:1.04; }
.brand-heading-accent { display:block; color:var(--brand-gold); }
html[data-site-page="index"] .hero-copy .lead { font-size:18px; line-height:1.65; }
html[data-site-page="index"] .hero-copy .eyebrow { color:#c9d4ce; }
html[data-site-page="index"] .hero-copy .eyebrow::before { width:6px; height:6px; border-radius:50%; background:var(--brand-gold); opacity:1; }
.hero-actions { display:flex; flex-wrap:wrap; align-items:center; gap:12px; }
html[data-brand] .hero-actions .install-cta { color:var(--brand-ink); background:var(--brand-gold); border:1px solid var(--brand-gold); padding:13px 22px; }
html[data-brand] .hero-actions .install-cta:hover { background:#d69b58; }
html[data-brand] .hero-secondary { color:#fff; text-decoration:none; border:1px solid #75777c; border-radius:999px; padding:13px 22px; font-size:14px; font-weight:600; }
html[data-brand] .hero-secondary:hover { border-color:var(--brand-gold); }
.browser-links { display:flex; flex-wrap:wrap; gap:10px; }
html[data-brand] .browser-links a { color:#e4ede9; border:1px solid #63656a; border-radius:999px; padding:6px 14px; font-size:12px; text-decoration:none; }
html[data-brand] .browser-links a:hover { border-color:var(--brand-gold); }
html[data-brand] .hero-copy :is(a,button):focus-visible { outline-color:var(--brand-gold); }
html[data-brand] .hero .demo { box-shadow:none; border:10px solid #eef3f0; border-radius:16px; }
html[data-site-page="pricing"] .hero { padding-block:64px; }
html[data-brand] .plans { gap:18px; background:none; border:0; overflow:visible; }
html[data-brand] .plans .surf { border:1px solid var(--line); border-radius:12px; padding:26px 22px; }
html[data-brand] .plans #pro { border-color:var(--brand-gold); background:var(--brand-sand); }
html[data-brand] .plans .price { font-family:var(--sans); font-weight:700; }
html[data-brand] .plans .install-cta { padding:10px 15px; font-size:13px; }
html[data-brand] .plan-target { color:var(--ink-soft); }
/* Cases are readable HTML; original French illustrations expand on demand. */
.use-case-intro { max-width:760px; }
.use-case-intro h1 { margin:18px 0; }
.use-case-intro .lead { font-size:19px; }
.workflow-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; margin-top:32px; }
html[data-brand] .workflow-card { display:flex; flex-direction:column; gap:14px; padding:26px 22px; border:1px solid var(--line-strong); border-radius:12px; background:#fff; color:var(--ink); text-decoration:none; transition:border-color .15s,transform .15s; }
html[data-brand] .workflow-card:hover { border-color:var(--brand-green); transform:translateY(-3px); }
.workflow-number { color:var(--brand-green); font-size:12px; letter-spacing:.1em; font-weight:700; }
.workflow-card h3 { font-size:21px; }
.workflow-card p { color:var(--ink-soft); font-size:15px; line-height:1.6; }
.workflow-card .workflow-link { margin-top:auto; padding-top:10px; color:var(--brand-green); font-size:13px; font-weight:700; }
.workflow-card .workflow-link::after { content:" ↗"; }
.case-page-intro { padding:64px 0 48px; }
.case-notice { font-size:14px; max-width:85ch; margin-top:24px; color:var(--ink-soft); }
.case-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin-top:28px; }
html[data-brand] .case-card { margin:0; border:1px solid var(--line-strong); border-radius:12px; background:#fff; overflow:hidden; }
html[data-brand] .case-card summary { display:block; padding:24px 54px 24px 24px; position:relative; cursor:pointer; list-style:none; }
.case-card summary::-webkit-details-marker { display:none; }
html[data-brand] .case-card summary::after { content:"+"; position:absolute; right:22px; top:24px; color:var(--brand-green); font-size:23px; }
html[data-brand] .case-card[open] summary::after { content:"−"; }
.case-card[open] { grid-column:1/-1; }
.case-role { display:block; color:var(--ink-soft); font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; margin-bottom:10px; }
.case-title { display:block; color:var(--ink); font-size:21px; font-weight:650; line-height:1.25; }
.case-summary { display:block; margin-top:12px; color:var(--ink-soft); font-size:15px; line-height:1.6; }
.case-illustration { margin:0; border-top:1px solid var(--line); }
.case-illustration img { display:block; width:100%; height:auto; }
.case-illustration figcaption { display:flex; flex-wrap:wrap; gap:12px; justify-content:space-between; padding:14px 22px; color:var(--ink-soft); font-size:13px; }
.case-plan { display:inline-block; margin-top:14px; font-size:12px; color:var(--brand-green); font-weight:700; }
.case-section { scroll-margin-top:24px; padding:64px 0; }
.case-section .lead { max-width:75ch; margin-top:18px; }
.case-section .case-scope { margin-top:16px; font-size:14px; color:var(--ink-soft); }
/* Full supplied logo is kept intact on white. */
html[data-brand] .site-footer { display:block; max-width:none; margin:0; padding:56px max(28px,calc((100% - 1184px)/2)) 28px; border:0; background:var(--brand-green); color:#e4ede9; font:14px/1.65 var(--sans); }
.site-footer-grid { display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr; gap:48px; }
.site-footer-identity img { display:block; width:96px; height:auto; background:#fff; border-radius:4px; }
html[data-brand] .site-footer-identity p { color:#cfddd6; max-width:28ch; margin:16px 0 0; }
.site-footer-group { display:flex; flex-direction:column; align-items:flex-start; gap:9px; }
html[data-brand] .site-footer-group h2 { color:#fff; font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.13em; margin:0 0 12px; }
html[data-brand] .site-footer a { color:#cfddd6; text-decoration:none; }
html[data-brand] .site-footer a:hover,html[data-brand] .site-footer a[aria-current="page"] { color:#fff; text-decoration:underline; }
html[data-brand] .site-footer a:focus-visible { outline-color:var(--brand-gold); }
html[data-brand] .site-footer .site-motto { color:#e8b679; font-size:17px; margin-top:20px; }
.site-footer-bottom { border-top:1px solid #60776e; margin-top:36px; padding-top:20px; color:#cfddd6; font-size:12px; }
html[data-brand] .site-demo-note { color:#cfddd6; font-size:12px; margin:12px 0 0; }
.plan-badge { display:inline-block; padding:5px 10px; border:1px solid var(--accent); border-radius:6px; color:var(--accent); background:var(--accent-ghost); font:700 13px/1.5 var(--sans); }
.paid-bundle { margin-top:32px; padding-top:24px; border-top:1px solid var(--line); }
.plan-notice { margin:20px 0; }
#chrome-store,#firefox-store,#edge-store { white-space:nowrap; }
@media(max-width:1120px) {
  html[data-brand] .site-nav { grid-template-columns:1fr auto; gap:12px; }
  .site-nav-links { grid-column:1/-1; grid-row:2; justify-content:flex-start; overflow-x:auto; padding-bottom:4px; }
  .site-languages { grid-column:2; grid-row:1; }
  html[data-site-page="index"] .hero-grid { gap:36px; }
  .workflow-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:900px) {
  html[data-site-page="index"] .hero-grid { grid-template-columns:minmax(0,1fr); gap:40px; }
  html[data-site-page="index"] .hero-copy { max-width:680px; }
  html[data-site-page="index"] .hero .demo { max-width:680px; width:100%; }
  .site-footer-grid { grid-template-columns:1.2fr 1fr 1fr; gap:30px; }
  .site-footer-group:last-child { grid-column:2/-1; }
}
@media(max-width:600px) {
  html[data-brand] .wrap { padding-inline:20px; }
  html[data-brand] .site-nav { padding:12px 20px 6px; }
  html[data-brand] .site-nav-links a { padding:9px 10px; font-size:13px; }
  html[data-site-page="index"] .hero { padding:44px 0 48px; }
  html[data-site-page="index"] .hero h1 { font-size:clamp(2.25rem,9.5vw,3rem); }
  html[data-site-page="index"] .hero-copy .lead { font-size:17px; }
  html[data-brand] .hero .demo { border-width:5px; }
  .workflow-grid,.case-grid { grid-template-columns:minmax(0,1fr); }
  .workflow-grid { gap:12px; }
  .case-card[open] { grid-column:auto; }
  .case-page-intro { padding-top:40px; }
  .site-footer-grid { grid-template-columns:1fr 1fr; gap:30px; }
  .site-footer-identity { grid-column:1/-1; display:flex; align-items:center; gap:24px; }
  .site-footer-group:last-child { grid-column:auto; }
  html[data-brand] .site-footer { padding-inline:20px; }
}
@media(prefers-reduced-motion:reduce) {
  html[data-brand] .workflow-card { transition:none; }
  html[data-brand] .workflow-card:hover { transform:none; }
}
@media print {
  html[data-brand] .site-header,html[data-brand] .site-footer { display:none; }
  html[data-brand] .brand-section,html[data-site-page="index"] .hero { box-shadow:none; clip-path:none; }
}
