/* Emberlin theme — main stylesheet
   ============================================================
   A light, typographic studio layout: pale grey paper, near-black
   grotesk type, a 12-column grid, small left-hand labels and large
   two-tone headlines. Emberlin's own navy / ember / gold appear only
   in the hero, the ecosystem cards and a few accents.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=BDO+Grotesk:wght@400;500&family=Instrument+Serif:ital@0;1&family=JetBrains+Mono:wght@400&display=swap');

:root{
  --bg:      #EAEAEA;
  --ink:     #131313;
  --grey:    #8C8C8C;
  --grey-2:  #B4B4B4;
  --line:    rgba(19,19,19,0.14);
  --navy:    #0B1428;
  --ember:   #E4602A;
  --gold:    #CBA24E;
  --pad:     clamp(16px, 2.2vw, 32px);
  --gap:     20px;
  --sans:    'BDO Grotesk', -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --serif:   'Instrument Serif', Georgia, serif;
  --mono:    'JetBrains Mono', ui-monospace, monospace;
  --h-xl:    clamp(2.4rem, 4.6vw, 4.2rem);
  --h-l:     clamp(2rem, 4vw, 3.6rem);
  color-scheme: light;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; overflow-x:clip; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } *{ animation-duration:0.01ms !important; animation-iteration-count:1 !important; transition-duration:0.01ms !important; } }

body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:var(--sans); font-size:16px; line-height:1.5;
  -webkit-font-smoothing:antialiased; overflow-x:clip;
}
img{ max-width:100%; display:block; }
a{ color:inherit; }
p{ margin:0; }
h1,h2,h3,h4{ margin:0; font-weight:400; line-height:1; letter-spacing:-0.02em; text-wrap:balance; }
em{ font-family:var(--serif); font-style:italic; font-weight:400; letter-spacing:0; }
ol,ul{ margin:0; padding:0; list-style:none; }
::selection{ background:var(--ink); color:var(--bg); }

.grid12{ display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); column-gap:var(--gap); padding:0 var(--pad); }
.mono{ font-family:var(--mono); font-size:0.75rem; }
.ghost{ color:var(--grey); }

/* small arrow-in-a-box used on buttons and links */
.ab{
  display:inline-block; width:14px; height:14px; border-radius:2px; flex-shrink:0;
  background:currentColor; position:relative; vertical-align:-2px;
}
.ab::after{
  content:''; position:absolute; inset:0; background:var(--ab-fg, var(--ink));
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M3.5 7h6.5M7.5 4.5 10 7l-2.5 2.5' fill='none' stroke='black' stroke-width='1.4'/%3E%3C/svg%3E") center/100% no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M3.5 7h6.5M7.5 4.5 10 7l-2.5 2.5' fill='none' stroke='black' stroke-width='1.4'/%3E%3C/svg%3E") center/100% no-repeat;
  transition:transform .25s ease;
}
a:hover > .ab::after{ transform:translateX(2px); }

.btn{
  display:inline-flex; align-items:center; gap:10px;
  background:var(--ink); color:var(--bg); --ab-fg:var(--ink);
  padding:11px 14px 11px 16px; border-radius:4px;
  font-size:0.95rem; line-height:1; text-decoration:none; white-space:nowrap;
  transition:background .2s ease;
}
.btn:hover{ background:#000; }
.btn-sm{ padding:9px 10px 9px 13px; font-size:0.9rem; }

/* ---------- preloader: the mark on grey, then the page lifts in ---------- */
.loader{
  position:fixed; inset:0; z-index:100; background:var(--bg); color:var(--ink);
  display:grid; place-items:center; pointer-events:none;
  animation:loaderOut .6s ease 1.1s forwards;
}
.loader svg{ width:72px; height:72px; animation:loaderMark 1.1s ease both; }
@keyframes loaderMark{ from{ opacity:0; transform:scale(.8) rotate(-40deg); } 60%{ opacity:1; transform:none; } }
@keyframes loaderOut{ to{ opacity:0; visibility:hidden; } }

/* ---------- nav ---------- */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:70;
  display:flex; align-items:center; justify-content:space-between;
  padding:22px var(--pad); pointer-events:none;
}
.nav > *{ pointer-events:auto; }
.brand svg{ width:32px; height:32px; display:block; }
.nav-right{ display:flex; align-items:center; gap:22px; }
.nav-toggle{
  all:unset; cursor:pointer; width:26px; height:20px;
  display:flex; flex-direction:column; justify-content:center; gap:6px;
}
.nav-toggle span{ display:block; height:1.5px; background:currentColor; transition:transform .35s ease; }
.nav-toggle.is-open span:first-child{ transform:translateY(3.75px) rotate(45deg); }
.nav-toggle.is-open span:last-child{ transform:translateY(-3.75px) rotate(-45deg); }
.brand, .nav-toggle{ color:#fff; transition:color .3s ease; }
.nav.on-light .brand, .nav.on-light .nav-toggle, body.nav-open .brand, body.nav-open .nav-toggle{ color:var(--ink); }

.nav-overlay{
  position:fixed; inset:0; z-index:60; background:var(--bg);
  clip-path:inset(0 0 100% 0); visibility:hidden; overflow-y:auto;
  transition:clip-path .6s cubic-bezier(.7,0,.2,1), visibility 0s .6s;
}
.nav-overlay.open{ clip-path:inset(0); visibility:visible; transition:clip-path .6s cubic-bezier(.7,0,.2,1); }
.nav-overlay-inner{ min-height:100%; display:flex; flex-direction:column; justify-content:flex-end; padding:120px 0 var(--pad); }
.nav-overlay-list{ padding:0 var(--pad); }
.nav-overlay-list a{
  display:flex; align-items:baseline; gap:18px; text-decoration:none;
  font-size:clamp(2.6rem,7.4vw,6.4rem); line-height:1.02; letter-spacing:-0.03em; color:var(--grey-2);
  transition:color .25s ease;
}
.nav-overlay-list a i{ font-style:normal; font-size:0.85rem; letter-spacing:0; color:var(--grey); width:3.4em; flex-shrink:0; }
.nav-overlay-list a:hover, .nav-overlay-list a.active{ color:var(--ink); }
.nav-overlay-foot{ margin-top:56px; font-size:0.9rem; row-gap:6px; }
.nav-overlay-foot > *{ grid-column:span 4; }
.nav-overlay-foot a{ text-decoration:none; }
body.nav-open{ overflow:hidden; }

/* ============================================================
   Elementor sections
   The homepage is built from native Elementor widgets. These rules
   style them through the em- classes set under Advanced → CSS Classes.
   Colours/fonts set in Elementor's panel override these defaults,
   because Elementor's per-element CSS is more specific.
   ============================================================ */

/* ---------- neutralise Elementor's defaults ---------- */
body{
  --e-global-color-primary:var(--ink) !important; --e-global-color-secondary:var(--ink) !important;
  --e-global-color-text:var(--ink) !important;    --e-global-color-accent:var(--ink) !important;
  --e-global-typography-primary-font-family:'BDO Grotesk' !important;   --e-global-typography-primary-font-weight:400 !important;
  --e-global-typography-secondary-font-family:'BDO Grotesk' !important; --e-global-typography-secondary-font-weight:400 !important;
  --e-global-typography-text-font-family:'BDO Grotesk' !important;      --e-global-typography-text-font-weight:400 !important;
  --e-global-typography-accent-font-family:'BDO Grotesk' !important;    --e-global-typography-accent-font-weight:400 !important;
  --kit-widget-spacing:0px;
  --arrow-box:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath fill-rule='evenodd' d='M2 0h10a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V2a2 2 0 0 1 2-2zm1.5 6.3v1.4h5.3L7 9.5l1 1L11.5 7 8 3.5l-1 1 1.8 1.8z'/%3E%3C/svg%3E");
}
body .elementor-section.elementor-section-full_width > .elementor-container{ max-width:none; }
body .elementor-top-section{ padding-left:calc(var(--pad) - 10px); padding-right:calc(var(--pad) - 10px); }
body .elementor-top-section > .elementor-column-gap-no > .elementor-column > .elementor-element-populated{ padding:0 10px; }
body .elementor-widget:not(:last-child){ margin-bottom:0; margin-block-end:0; }
body .elementor-widget-heading .elementor-heading-title{ font-family:inherit; font-size:inherit; font-weight:400; line-height:inherit; letter-spacing:inherit; color:inherit; }
body .elementor-widget-text-editor{ font-family:inherit; font-weight:inherit; color:inherit; }
body .elementor-widget-text-editor p{ margin:0; }
body .elementor-widget-text-editor p + p{ margin-top:0.9em; }

/* arrow-in-a-box after links/buttons, drawn with a mask so it takes the text colour */
.em-slide-meta a::after, body .em-btn .elementor-button-text::after{
  content:''; display:inline-block; width:14px; height:14px; margin-left:8px; vertical-align:-2px;
  background:currentColor; -webkit-mask:var(--arrow-box) center/100% no-repeat; mask:var(--arrow-box) center/100% no-repeat;
  transition:transform .25s ease;
}
.em-slide-meta a:hover::after, body .em-btn .elementor-button:hover .elementor-button-text::after{ transform:translateX(2px); }

body .elementor-widget-button.em-btn .elementor-button{
  background:var(--ink); color:var(--bg); border-radius:4px; padding:11px 14px 11px 16px;
  font-family:inherit; font-size:0.95rem; font-weight:400; line-height:1;
}
body .elementor-widget-button.em-btn .elementor-button:hover{ background:#000; color:var(--bg); }

/* ---------- hero: stacked slides that crossfade ---------- */
body .elementor-top-section.em-hero{ position:relative; height:100vh; height:100svh; min-height:560px; overflow:hidden; background:var(--navy); color:#fff; padding:0; }
.em-hero > .elementor-container, .em-hero > .elementor-container > .elementor-column{ position:static; height:100%; }
body .em-hero > .elementor-container > .elementor-column > .elementor-widget-wrap{ position:static; padding:0; }
body .elementor-section.em-slide{ position:absolute; inset:0; opacity:0; transition:opacity 1s ease, transform 6s ease-out; transform:scale(1.04); }
body .elementor-section.em-slide.is-active, .em-hero:not(.is-ready) .em-slide:first-child{ opacity:1; transform:none; }
.em-slide > .elementor-container, .em-slide > .elementor-container > .elementor-column{ height:100%; position:static; }
body .em-slide .elementor-widget-wrap{ position:static; align-content:center; justify-content:center; }
.em-slide-type{
  font-size:clamp(3.6rem,13vw,13rem); line-height:.86; letter-spacing:-0.05em; text-align:center;
  transform:translateY(24px); transition:transform 1.2s cubic-bezier(.2,.7,.2,1);
}
.em-slide.is-active .em-slide-type{ transform:none; }
body .elementor-widget.em-slide-meta{
  position:absolute; left:var(--pad); right:var(--pad); top:69%; width:auto;
  display:grid; grid-template-columns:repeat(4,1fr); column-gap:var(--gap); align-items:center;
  font-size:0.8rem; text-transform:uppercase; letter-spacing:0.02em;
}
body .em-slide-meta p + p{ margin:0; }
.em-slide-meta p:nth-child(2), .em-slide-meta p:nth-child(3){ text-align:center; }
.em-slide-meta p:nth-child(4){ justify-self:end; }
.em-slide-meta a{ text-decoration:none; color:inherit; }
body .elementor-widget.em-hero-intro{
  position:absolute; left:var(--pad); bottom:var(--pad); z-index:2; width:min(560px, calc(100% - 2 * var(--pad)));
  font-size:clamp(1.4rem,2.2vw,1.9rem); line-height:1.08; letter-spacing:-0.02em;
  color:var(--hero-fg,#fff); transition:color .8s ease;
}
.em-hero-count{
  position:absolute; right:var(--pad); bottom:var(--pad); z-index:2; display:flex; align-items:center; gap:10px;
  font-family:var(--mono); font-size:0.75rem; color:var(--hero-fg,#fff); transition:color .8s ease;
}
.em-hero-bar{ display:block; width:80px; height:1px; background:color-mix(in srgb, currentColor 30%, transparent); position:relative; overflow:hidden; }
.em-hero-bar i{ position:absolute; inset:0; background:currentColor; transform-origin:left; transform:scaleX(0); }

/* ---------- label | body rows and chapter heads ---------- */
.em-xl{ font-size:var(--h-xl); line-height:1; letter-spacing:-0.035em; }
.em-l{ font-size:var(--h-l); line-height:1.02; letter-spacing:-0.035em; }
.em-ghost{ color:var(--grey); }
.em-h3{ font-size:clamp(1.4rem,2vw,1.8rem); line-height:1.1; letter-spacing:-0.02em; }

body .elementor-top-section.em-statement, body .elementor-top-section.em-chead, body .elementor-top-section.em-center,
body .elementor-top-section.em-kicker, body .elementor-top-section.em-voices{ padding-top:clamp(90px,13vw,190px); }
.em-chead .em-xl{ max-width:17ch; }
.em-cno{ font-size:0.9rem; color:var(--grey); padding-top:calc(var(--h-xl) * 0.3); }

body .elementor-top-section.em-row{ padding-top:56px; }
body .em-chead + .em-row, body .em-statement + .em-row, body .em-marquee-row + .em-row, body .em-kicker + .em-row{ padding-top:clamp(60px,8vw,110px); }
.em-label{ font-size:0.95rem; }
.em-label p{ padding-top:4px; }
.em-body{ font-size:clamp(1.05rem,1.3vw,1.2rem); line-height:1.32; letter-spacing:-0.005em; }
body .em-body > .elementor-widget-wrap{ max-width:calc(38em + 20px); }
body .em-body .elementor-widget + .elementor-widget{ margin-top:18px; }
.em-body a{ text-underline-offset:3px; text-decoration-thickness:1px; }
.em-small{ font-size:0.95rem; color:var(--grey); line-height:1.45; }
.em-upper{ text-transform:uppercase; font-size:0.8rem; letter-spacing:0.02em; }
.em-formula{ font-size:clamp(1.3rem,2.1vw,1.8rem); letter-spacing:-0.02em; line-height:1.15; }

.em-dot p{ display:inline-flex; align-items:center; gap:10px; font-size:0.9rem; }
.em-dot p::before{ content:''; width:5px; height:5px; border-radius:50%; background:var(--grey); }

/* hairline list: "<strong>Term</strong> description" per item */
.em-hairlist ul{ border-top:1px solid var(--line); }
.em-hairlist li{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.6fr); gap:20px; padding:14px 0 15px; border-bottom:1px solid var(--line); color:var(--grey); font-size:0.95em; }
.em-hairlist li strong{ font-weight:400; color:var(--ink); font-size:1.05em; }
.em-hairlist--big li{ align-items:baseline; }
.em-hairlist--big li strong{ font-size:clamp(1.6rem,2.6vw,2.4rem); letter-spacing:-0.03em; line-height:1; }

body .em-body .elementor-widget.em-pull{ margin-top:48px; }
.em-pull{ font-size:clamp(1.25rem,1.8vw,1.55rem); line-height:1.2; letter-spacing:-0.015em; }
body .em-pull p + p{ margin-top:14px; font-size:0.85rem; color:var(--grey); letter-spacing:0; }

.em-tags ul{ display:flex; flex-wrap:wrap; gap:6px; }
.em-tags li{ font-size:0.9rem; line-height:1; padding:8px 11px; border:1px solid var(--line); border-radius:4px; color:#4a4a4a; transition:background .2s ease, color .2s ease, border-color .2s ease; }
.em-tags li:hover{ background:var(--ink); color:var(--bg); border-color:var(--ink); }

.em-steps ol{ counter-reset:st; display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); border-top:1px solid var(--line); }
.em-steps li{ counter-increment:st; padding:14px 14px 18px 0; border-bottom:1px solid var(--line); font-size:0.98rem; line-height:1.2; }
.em-steps li::before{ content:counter(st, decimal-leading-zero); display:block; font-family:var(--mono); font-size:0.7rem; color:var(--grey); margin-bottom:22px; }

.em-numlist ol{ counter-reset:n; border-top:1px solid var(--line); }
.em-numlist li{ counter-increment:n; display:flex; gap:18px; padding:11px 0; border-bottom:1px solid var(--line); }
.em-numlist li::before{ content:"(" counter(n, decimal-leading-zero) ")"; color:var(--grey); font-size:0.85rem; padding-top:3px; flex-shrink:0; width:3em; }

.em-shelf ol{ counter-reset:b; columns:2; column-gap:var(--gap); border-top:1px solid var(--line); }
.em-shelf li{ counter-increment:b; break-inside:avoid; display:flex; justify-content:space-between; gap:12px; padding:11px 0; border-bottom:1px solid var(--line); font-size:0.95rem; }
.em-shelf li::after{ content:counter(b, decimal-leading-zero); font-family:var(--mono); font-size:0.7rem; color:var(--grey); padding-top:3px; }

/* ---------- ecosystem: tilted card stage + generated name list ---------- */
.em-center-head{ text-align:center; font-size:clamp(3rem,7vw,6.4rem); letter-spacing:-0.045em; line-height:1; }
body .elementor-top-section.em-eco{ padding-top:clamp(40px,6vw,80px); }
body .em-eco-stage > .elementor-widget-wrap{ position:relative; width:min(100% - 20px, 440px); margin-left:8.333%; aspect-ratio:3/4; max-height:620px; }
body .elementor-widget.em-card{
  position:absolute; inset:0; border-radius:10px; box-shadow:0 30px 60px -30px rgba(0,0,0,.35);
  opacity:0; transform:translate(40px,30px) rotate(6deg) scale(.94); filter:blur(6px);
  transition:opacity .5s ease, transform .6s cubic-bezier(.2,.7,.2,1), filter .5s ease;
}
body .elementor-widget.em-card.is-active, .em-eco-stage:not(.is-ready) .em-card:first-child{ opacity:1; transform:rotate(-3deg); filter:none; z-index:2; }
body .elementor-widget.em-card.was-active{ opacity:.5; transform:translate(-30px,40px) rotate(-8deg) scale(.9); filter:blur(4px); z-index:1; }
body .elementor-widget-icon-box.em-card .elementor-icon-box-wrapper{ height:100%; display:flex; flex-direction:column; align-items:flex-start; text-align:left; padding:28px; }
body .elementor-widget-icon-box.em-card .elementor-icon-box-icon{ margin:0; display:block; }
body .em-card .elementor-icon{ font-size:44px; }
body .em-card .elementor-icon svg{ width:44px; height:44px; }
body .elementor-widget-icon-box.em-card .elementor-icon-box-content{ flex-grow:1; width:100%; display:flex; flex-direction:column; justify-content:flex-end; }
body .elementor-widget-icon-box.em-card .elementor-icon-box-title{ font-family:inherit; font-weight:400; font-size:clamp(2.2rem,3.6vw,3.4rem); letter-spacing:-0.035em; line-height:.95; margin:0; }
.em-card .elementor-icon-box-title a{ color:inherit; text-decoration:none; }
body .elementor-widget-icon-box.em-card .elementor-icon-box-description{ margin:16px 0 0; font-size:0.98rem; line-height:1.35; opacity:.85; max-width:30ch; }
.em-pill{
  position:absolute; left:-14px; bottom:-18px; transform:rotate(-3deg);
  background:var(--ink); color:#fff; text-decoration:none; font-size:0.95rem;
  padding:12px 16px; border-radius:8px; box-shadow:0 10px 24px -8px rgba(0,0,0,.4);
}
body .em-eco-side > .elementor-widget-wrap{ position:sticky; top:110px; align-self:flex-start; }
.em-eco-list{ border-top:1px solid var(--line); width:100%; }
.em-eco-list li{ border-bottom:1px solid var(--line); }
.em-eco-list button{
  all:unset; box-sizing:border-box; display:block; width:100%; cursor:pointer;
  padding:11px 0; font-size:1rem; color:var(--grey); transition:color .2s ease, padding-left .25s ease;
}
.em-eco-list button:hover, .em-eco-list li.is-active button{ color:var(--ink); padding-left:10px; }
.em-eco-list button:focus-visible{ outline:1px solid var(--ink); outline-offset:2px; }
body .em-eco-side .elementor-widget.em-eco-note{ margin-top:32px; font-size:0.95rem; line-height:1.45; }
body .em-eco-note a{ text-decoration:underline; text-underline-offset:3px; }

/* ---------- Brave Four marquee ---------- */
body .elementor-top-section.em-marquee-row{ padding:14px 0 18px; margin-top:clamp(50px,6vw,80px); border-top:1px solid var(--line); border-bottom:1px solid var(--line); overflow:hidden; }
body .em-marquee-row > .elementor-column-gap-no > .elementor-column > .elementor-element-populated{ padding:0; }
.em-marquee{ font-size:clamp(4rem,11vw,10rem); letter-spacing:-0.05em; line-height:1; white-space:nowrap; word-spacing:.3em; }
.em-marquee em{ color:var(--ember); }
.em-track{ display:flex; width:max-content; animation:marquee 26s linear infinite; }
.em-track > span{ padding-right:.35em; }
@keyframes marquee{ to{ transform:translateX(-50%); } }

/* ---------- Academy guilds ---------- */
body .elementor-top-section.em-guilds{ padding-top:56px; }
body .em-guilds > .elementor-column-gap-no > .elementor-column > .elementor-element-populated{ margin:0 10px; padding:16px 0 0; border-top:2px solid var(--gc, var(--ink)); }
.em-guilds .elementor-column:nth-child(1){ --gc:#D9A441; }
.em-guilds .elementor-column:nth-child(2){ --gc:#3E8A82; }
.em-guilds .elementor-column:nth-child(3){ --gc:#9163C9; }
.em-guild-label{ font-size:0.85rem; color:var(--grey); }
body .elementor-widget.em-guild-name{ font-size:clamp(2.4rem,4.4vw,4rem); letter-spacing:-0.04em; margin-top:40px; }
body .em-guild .elementor-widget-text-editor:last-child{ margin-top:10px; color:#4a4a4a; font-size:0.98rem; }

/* ---------- Experiences feature panel ---------- */
body .elementor-top-section.em-feature{ margin:56px var(--pad) 0; padding:clamp(28px,4vw,48px); border-radius:10px; color:#fff; }
body .em-feature .elementor-widget-wrap{ min-height:min(64vh,560px); align-content:space-between; }
.em-feature-label{ font-size:0.85rem; text-transform:uppercase; letter-spacing:0.02em; opacity:.7; }
.em-feature-title{ font-size:clamp(3rem,9vw,8.4rem); letter-spacing:-0.05em; line-height:.9; }
.em-feature-title em{ color:var(--gold); }
.em-feature-text{ max-width:40ch; font-size:1.05rem; line-height:1.35; opacity:.85; }

/* ---------- Roadmap: accordion restyled as giant numbered rows ---------- */
body .elementor-top-section.em-roadmap{ padding-top:40px; }
.em-phases .elementor-accordion{ counter-reset:ph; }
body .em-phases .elementor-accordion .elementor-accordion-item{ border:0; counter-increment:ph; }
body .em-phases .elementor-accordion .elementor-tab-title{
  display:flex; align-items:baseline; gap:clamp(16px,2.6vw,40px); padding:0; border:0; cursor:pointer;
}
.em-phases .elementor-tab-title::before{ content:"(" counter(ph, upper-roman) ")"; font-size:0.85rem; width:3.2em; flex-shrink:0; color:var(--grey); }
body .em-phases .elementor-accordion .elementor-tab-title .elementor-accordion-icon{ display:none; }
body .em-phases .elementor-accordion .elementor-accordion-title{
  font-family:inherit; font-weight:400; font-size:clamp(2.6rem,6.2vw,5.6rem); letter-spacing:-0.045em; line-height:1.05;
  color:var(--grey-2); transition:color .3s ease;
}
body .em-phases .elementor-accordion-item.is-active .elementor-accordion-title,
body .em-phases .elementor-accordion .elementor-tab-title.elementor-active .elementor-accordion-title{ color:var(--ink); }
body .em-phases .elementor-accordion .elementor-tab-content{ border:0; padding:10px 0 26px calc(3.2em + clamp(16px,2.6vw,40px)); font-size:1rem; line-height:1.4; }
body .em-phase-detail > .elementor-widget-wrap{ position:sticky; top:120px; align-self:flex-start; padding-top:22px; }
.em-phase-panel{ font-size:1rem; line-height:1.4; animation:fadeUp .4s ease; }
.em-phase-panel p + p{ margin-top:0.6em; }
.em-phase-panel strong, .em-phases .elementor-tab-content strong{ display:block; font-weight:400; font-family:var(--mono); font-size:0.75rem; color:var(--grey); }
@keyframes fadeUp{ from{ opacity:0; transform:translateY(8px); } }
@media (min-width:768px){
  /* on wider screens the open phase is shown in the column beside the list */
  body .em-phases .elementor-accordion .elementor-tab-content{ display:none !important; }
}

/* ---------- Voices slider ---------- */
body .em-voices-main > .elementor-widget-wrap{ margin-left:8.333%; width:auto; max-width:540px; flex:1; }
.em-voices-top{ display:flex; justify-content:space-between; align-items:center; width:100%; margin-bottom:48px; }
.em-voices-nav{ display:flex; gap:14px; }
.em-voices-nav button{ all:unset; cursor:pointer; font-size:1.1rem; line-height:1; padding:2px; }
.em-voices-nav button:focus-visible{ outline:1px solid var(--ink); }
.em-quotes{ display:grid; width:100%; }
.em-quotes > .em-quote{
  grid-area:1/1; font-size:clamp(1.05rem,1.3vw,1.2rem); line-height:1.35; max-width:30ch;
  opacity:0; transform:translateY(10px); transition:opacity .45s ease, transform .45s ease; pointer-events:none;
}
.em-quotes > .em-quote.is-active{ opacity:1; transform:none; pointer-events:auto; }
.em-voices-bar{ display:block; width:100%; margin-top:60px; height:1px; background:var(--line); position:relative; }
.em-voices-bar i{ position:absolute; left:0; top:-0.5px; height:2px; background:var(--ink); transition:transform .5s cubic-bezier(.2,.7,.2,1); }
body .elementor-widget-image.em-avatar{ text-align:left; }
body .em-avatar img{ width:76px; height:76px; border-radius:50%; object-fit:cover; filter:grayscale(1); }
body .elementor-widget.em-person{ margin-top:22px; }
.em-role{ color:var(--grey); }

/* ---------- Vision ---------- */
body .elementor-top-section.em-vision-row{ padding-top:40px; }
body .em-vision p{ font-size:clamp(2rem,5.2vw,4.8rem); line-height:1.02; letter-spacing:-0.04em; color:var(--grey-2); margin:0; }
.em-vision strong{ font-weight:400; color:var(--ink); }

/* ---------- CTA ---------- */
body .elementor-top-section.em-cta{ padding-top:clamp(90px,13vw,190px); padding-bottom:clamp(90px,12vw,160px); }
.em-cta > .elementor-container{ align-items:center; }
body .em-cta-copy > .elementor-widget-wrap{ margin-left:8.333%; width:auto; max-width:560px; flex:1; }
body .elementor-widget.em-cta-text{ margin-top:22px; color:#4a4a4a; max-width:40ch; line-height:1.45; }
body .em-cta-copy .elementor-widget.em-btn{ margin-top:30px; }
.em-ascii{ margin:0 auto; width:max-content; font-family:var(--mono); font-size:clamp(4px,0.62vw,9px); line-height:1.12; color:var(--ink); user-select:none; }

/* ---------- inner pages (Emberlin Studios) ---------- */
body .elementor-top-section.em-page-hero{ padding-top:clamp(140px,18vw,240px); }
body .em-page-hero .elementor-widget.em-dot{ margin-bottom:28px; }
.em-xxl{ font-size:clamp(3rem,8.4vw,8rem); line-height:.95; letter-spacing:-0.045em; }
.em-xxl em{ letter-spacing:-0.02em; }

/* original-IP panels: one coloured section per title */
body .elementor-top-section.em-ip{ margin:20px var(--pad) 0; padding:clamp(28px,4vw,56px) calc(clamp(28px,4vw,56px) - 10px); border-radius:10px; }
body .em-center + .em-ip{ margin-top:clamp(40px,6vw,80px); }
body .em-ip-head > .elementor-widget-wrap{ min-height:min(62vh,540px); flex-direction:column; flex-wrap:nowrap; }
.em-ip-kind{ font-size:0.85rem; text-transform:uppercase; letter-spacing:0.02em; opacity:.75; }
.em-ip-title{ font-size:clamp(2.8rem,6vw,5.6rem); line-height:.92; letter-spacing:-0.045em; }
.em-ip-tag{ font-family:var(--serif); font-style:italic; font-size:clamp(1.5rem,2.6vw,2.4rem); line-height:1.05; letter-spacing:0; }
body .em-ip-head .elementor-widget.em-ip-title{ margin-top:auto; }
body .em-ip-head .elementor-widget.em-ip-tag{ margin-top:18px; }
body .em-ip-body > .elementor-widget-wrap{ flex-direction:column; flex-wrap:nowrap; justify-content:flex-end; }
body .em-ip-body .elementor-widget.em-btn{ width:auto; align-self:flex-start; }
.em-ip-text{ font-size:clamp(1.05rem,1.3vw,1.2rem); line-height:1.38; max-width:34em; }
body .em-ip-body .elementor-widget.em-btn{ margin-top:30px; }
body .em-ip-body .elementor-widget.em-ip-note{ margin-top:22px; font-size:0.9rem; line-height:1.45; opacity:.75; max-width:40ch; }
body .elementor-widget-button.em-btn--light .elementor-button, body .elementor-widget-button.em-btn--light .elementor-button:hover{ background:#fff; color:var(--ink); }
/* a section's link colour (Style → Typography) also hits buttons, so the
   label colour is set on the text itself */
body .em-btn .elementor-button-content-wrapper{ color:var(--bg); }
body .em-btn--light .elementor-button-content-wrapper{ color:var(--ink); }

@media (max-width:767px){
  body .em-ip-head > .elementor-widget-wrap{ min-height:0; }
  body .em-ip-head .elementor-widget.em-ip-title{ margin-top:48px; }
  body .em-ip-body{ margin-top:32px; }
}

/* coloured tiles (two per row; each tile is a column with its own colour) */
body .elementor-top-section.em-tiles{ padding-top:20px; }
body .em-center + .em-tiles{ padding-top:clamp(40px,6vw,80px); }
body .em-tiles > .elementor-column-gap-no > .elementor-column > .elementor-element-populated{
  margin:0 10px; padding:clamp(24px,3vw,40px); border-radius:10px; min-height:min(52vh,440px);
  flex-direction:column; flex-wrap:nowrap;
}
.em-tile-no{ font-size:0.85rem; opacity:.75; }
body .em-tiles .elementor-widget.em-tile-title{ margin-top:auto; padding-top:40px; font-size:clamp(2rem,3.6vw,3.4rem); line-height:.95; letter-spacing:-0.04em; }
body .em-tiles .elementor-widget.em-tile-text{ margin-top:16px; font-size:1rem; line-height:1.4; max-width:40ch; opacity:.9; }

/* stacked hairline sentences, bold ending in ink */
.em-hairlines{ border-top:1px solid var(--line); }
body .em-hairlines p, body .em-hairlines p + p{ margin:0; padding:14px 0 15px; border-bottom:1px solid var(--line); color:var(--grey); }
.em-hairlines strong{ font-weight:400; color:var(--ink); }

@media (max-width:767px){
  body .em-tiles > .elementor-column-gap-no > .elementor-column + .elementor-column{ margin-top:20px; }
  body .em-tiles > .elementor-column-gap-no > .elementor-column > .elementor-element-populated{ min-height:320px; }
}

/* ---------- series sub-pages ---------- */
/* stacked questions / litanies on hairlines */
body .elementor-top-section.em-questions-row{ padding-top:clamp(40px,5vw,64px); }
.em-questions{ border-top:1px solid var(--line); }
body .em-questions p, body .em-questions p + p{
  margin:0; padding:14px 0 16px; border-bottom:1px solid var(--line);
  font-size:clamp(1.8rem,4.2vw,3.8rem); line-height:1.02; letter-spacing:-0.04em; color:var(--grey-2);
  transition:color .3s ease, padding-left .3s ease;
}
body .em-questions p:hover{ color:var(--ink); padding-left:12px; }

/* image slots */
body .elementor-top-section.em-media{ padding-top:56px; }
body .em-media-img img{ width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:10px; }
body .elementor-widget-image.em-media-img{ text-align:left; }
body .em-media .elementor-widget.em-media-cap{ margin-top:10px; font-size:0.85rem; color:var(--grey); }

/* rows of buttons (watch / listen / follow) */
body .elementor-widget.em-btn--inline{ width:auto; margin-right:10px; }
body .em-cta-copy .elementor-widget.em-btn--inline{ margin-top:14px; }
body .em-cta-copy .elementor-widget.em-l + .em-btn--inline{ margin-top:30px; }
body .elementor-widget.em-signoff{ margin-top:28px; font-family:var(--serif); font-style:italic; font-size:clamp(1.3rem,2vw,1.7rem); color:#4a4a4a; }
body .em-body .elementor-widget.em-btn{ width:auto; }

/* SDG list: tighter terms */
.em-sdgs li strong{ font-size:1em; }

@media (max-width:767px){
  body .em-media > .elementor-column-gap-no > .elementor-column + .elementor-column{ margin-top:20px; }
}

/* ---------- founder page ---------- */
body .em-founder-hero > .elementor-container{ align-items:flex-end; }
body .em-founder-copy > .elementor-widget-wrap{ padding-bottom:12px; }
body .elementor-widget-image.em-portrait{ text-align:left; }
body .em-portrait img{ width:100%; aspect-ratio:4/5; object-fit:cover; object-position:center 22%; border-radius:10px; }
body .elementor-top-section.em-signature-row{ padding-top:28px; }
.em-signature p:first-child{ font-size:0.95rem; color:var(--grey); }
body .em-signature p + p{ margin-top:6px; font-family:var(--serif); font-style:italic; font-size:clamp(2rem,4vw,3.4rem); line-height:1; color:var(--ember); }
body .em-voices-person .elementor-widget.em-btn{ width:auto; margin-top:22px; }

@media (max-width:767px){
  body .em-founder-photo{ margin-top:40px; }
}

/* ---------- word-by-word ink reveal (JS adds .w spans) ---------- */
.em-words .w{ color:var(--grey-2); transition:color .35s ease; }
.em-words .w.on{ color:var(--ink); }

/* ---------- entrance ---------- */
.reveal{ opacity:0; transform:translateY(24px); transition:opacity .8s ease, transform .8s cubic-bezier(.2,.7,.2,1); }
.reveal.in{ opacity:1; transform:none; }

/* ---------- inside the Elementor editor: lay everything out flat so
   every slide, card and quote can be clicked and edited ---------- */
body.elementor-editor-active .elementor-top-section.em-hero{ height:auto; min-height:0; }
body.elementor-editor-active .elementor-section.em-slide{ position:relative; opacity:1; transform:none; min-height:70vh; }
body.elementor-editor-active .elementor-widget.em-hero-intro{ position:relative; left:auto; bottom:auto; padding:40px var(--pad); width:auto; }
body.elementor-editor-active .em-eco-stage > .elementor-widget-wrap{ aspect-ratio:auto; max-height:none; }
body.elementor-editor-active .elementor-widget.em-card{ position:relative; opacity:1; transform:none; filter:none; min-height:380px; margin-top:24px; }
body.elementor-editor-active .em-phases .elementor-accordion .elementor-tab-content{ display:block !important; }
body.elementor-editor-active .reveal{ opacity:1; transform:none; }

/* ---------- plain-HTML fallback when Elementor is inactive ---------- */
.em-fallback .elementor-section{ position:relative; }
.em-fallback .elementor-container{ display:flex; flex-wrap:wrap; }
.em-fallback .elementor-column{ width:var(--w); display:flex; position:relative; }
.em-fallback .elementor-widget-wrap{ width:100%; display:flex; flex-wrap:wrap; align-content:flex-start; position:relative; }
.em-fallback .elementor-widget{ width:100%; position:relative; }
.em-fallback .elementor-accordion-title{ display:block; }
@media (max-width:767px){ .em-fallback .elementor-column{ width:100%; } }

/* ---------- footer ---------- */
.footer{ padding-top:clamp(60px,8vw,120px); overflow:hidden; }
.f-cols{ row-gap:40px; }
.f-col{ grid-column:span 3; display:flex; flex-direction:column; font-size:0.9rem; line-height:1.35; }
.f-col h4{ font-size:0.8rem; text-transform:uppercase; letter-spacing:0.02em; color:var(--grey); margin-bottom:40px; }
.f-col a{ text-decoration:none; width:fit-content; background:linear-gradient(currentColor,currentColor) left bottom/0 1px no-repeat; transition:background-size .3s ease; }
.f-col a:hover{ background-size:100% 1px; }
.f-giant{
  margin-top:clamp(60px,8vw,110px); padding:0 var(--pad);
  font-size:22.4vw; line-height:.74; letter-spacing:-0.06em; white-space:nowrap; font-weight:500;
  transform:translateY(0.06em);
}
.f-giant em{ font-weight:400; color:var(--ember); letter-spacing:-0.02em; padding:0 .01em; }

/* ---------- responsive (Elementor stacks columns below 768px) ---------- */
@media (max-width:767px){
  .em-label{ color:var(--grey); }
  body .em-label p{ padding:0 0 12px; }
  .em-cno{ padding:0 0 10px; }
  body .em-eco-stage > .elementor-widget-wrap{ margin:0 auto 70px; width:min(100% - 40px, 380px); }
  body .em-eco-side > .elementor-widget-wrap{ position:static; }
  body .em-phase-detail{ display:none; }
  body .em-voices-main > .elementor-widget-wrap, body .em-cta-copy > .elementor-widget-wrap{ margin-left:0; }
  body .em-voices-person{ margin-top:40px; }
  .em-ascii{ margin-top:50px; font-size:5px; }
  body .em-guilds > .elementor-column-gap-no > .elementor-column{ margin-top:24px; }
  body .elementor-widget.em-guild-name{ margin-top:18px; }
  .em-shelf ol{ columns:1; }
  .em-hairlist li{ grid-template-columns:1fr; gap:4px; }
  body .elementor-widget.em-slide-meta{ grid-template-columns:1fr 1fr; top:auto; bottom:calc(var(--pad) + 190px); }
  .em-slide-meta p:nth-child(2), .em-slide-meta p:nth-child(3){ display:none; }
  .em-hero-count{ display:none; }
  body .em-slide--logo{ background-size:contain !important; }
  .f-col{ grid-column:span 6; }
  .nav-overlay-foot > *{ grid-column:1 / -1; }
  .btn-sm{ font-size:0.82rem; }
}