/* LAB 01 / 02 — Premium editorial direction. Incremental layer over site.css.
   Does not change pricing, integrations, video URLs or original components. */
:root { --premium-paper: #f3f4ef; --premium-quiet: #b3bac0; --premium-line: rgba(255,255,255,.12); }
html { scroll-padding-top: 78px; }
#top { isolation: isolate; }
#top .hero-orb { opacity: .24 !important; }
#top .hero-meta-row { margin-bottom: 25px !important; }
#top .hero-status { background: transparent !important; border-color: rgba(255,255,255,.15) !important; border-radius: 4px !important; letter-spacing: .14em !important; }
#top .hero-eyebrow { font-size: 11px !important; letter-spacing: .205em !important; color: #c6ccd0 !important; }
#top .hero-lockup-pro { margin: 0 !important; }
#top .hero-lockup-title { letter-spacing: -.065em !important; }
#top .hero-lockup-main,
#top .hero-lockup-product { font-weight: 650 !important; letter-spacing: -.063em !important; text-wrap: balance; }
#top .hero-lockup-main { color: var(--premium-paper) !important; }
#top .hero-lockup-product { color: #aeb5ac !important; }
#top .hero-summary-minimal { max-width: 480px !important; margin-top: 29px !important; }
#top .hero-summary-minimal-kicker { color: var(--brand-lime,#CFE65A) !important; }
#top .hero-summary-minimal-copy { color: #bcc1c5 !important; max-width: 450px !important; font-size: clamp(1rem,1.3vw,1.1rem) !important; line-height: 1.7 !important; }
#top .hero-summary-minimal-copy strong { color: #f0f2ef !important; }
#top .hero-actions { margin-top: 29px !important; gap: 10px !important; }
#top .hero-cta { border-radius: 10px; min-height: 52px; padding-inline: 24px; letter-spacing: .005em; font-weight: 700; }
#top .hero-cta-primary { box-shadow: none !important; }
#top .hero-cta-secondary { border-color: rgba(255,255,255,.18) !important; }
#projects { padding-top: clamp(60px,6vw,96px) !important; }
#projects > .site-shell > .max-w-4xl h2 { font-size: clamp(2.7rem,5.9vw,5.6rem) !important; line-height: 1 !important; }
#projects .project-category-row { margin-top: 16px; }
#projects .project-info-card { border-radius: 12px !important; }
#projects .mockup-stage { border-radius: 14px !important; }
.editorial-intro { max-width: 1000px; margin: 0 auto; padding-top: 45px; }
.editorial-overline { font-size: 11px; font-weight: 750; letter-spacing: .22em; text-transform: uppercase; color: #CFE65A; margin-bottom: 14px; }
.editorial-intro h3 { font-size: clamp(1.6rem,3vw,2.65rem); font-weight: 650; letter-spacing: -.045em; line-height: 1.13; color: var(--premium-paper); max-width: 700px; }
.editorial-intro p { font-size: 15px; line-height: 1.7; color: #b4bec0; max-width: 630px; margin-top: 17px; }
.editorial-showcase { display: grid; gap: clamp(25px,3.4vw,48px); margin-top: clamp(27px,3.5vw,47px); }
.editorial-case { position: relative; display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); align-items: stretch; min-height: 485px; border-top: 1px solid rgba(255,255,255,.14); padding-top: 24px; gap: clamp(24px,5vw,70px); }
.editorial-case:nth-child(even) { grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); }
.editorial-case:nth-child(even) .editorial-media-stack { order: 2; }
.editorial-case:nth-child(even) .editorial-content { order: 1; }
.editorial-media { position: relative; overflow: hidden; display: flex; align-items: center; justify-content: center; min-width: 0; height: 100%; min-height: 460px; max-height: 630px; isolation: isolate; background: radial-gradient(ellipse at 50% 44%, rgba(207,230,90,.07), transparent 57%),#0a0d0e; border: 1px solid rgba(255,255,255,.085); border-radius: 9px; }
.editorial-media video { display: block; width: 100%; height: 100%; max-height: 630px; min-height: 460px; object-fit: contain; background: #080a0b; }
.editorial-media video,#projects .project-video,#top .hero-video,#caseMyWay .club-workflow-video { cursor:pointer; }
.editorial-media video:focus-visible,#projects .project-video:focus-visible,#top .hero-video:focus-visible,#caseMyWay .club-workflow-video:focus-visible { outline:2px solid #CFE65A;outline-offset:-4px; }
.editorial-media::after { content:""; position:absolute; pointer-events:none; inset:0; border:1px solid rgba(255,255,255,.08); border-radius:inherit; }
.editorial-media-stack { display:flex; flex-direction:column; align-items:center; align-self:center; min-width:0; width:100%; }
.portfolio-audio-prompt { display:flex; align-items:center; justify-content:center; gap:7px; width:max-content; min-height:34px; margin:10px auto 0; padding:6px 11px; border:1px solid rgba(255,255,255,.13); border-radius:999px; background:rgba(9,13,14,.62); color:#cfe65a; font:600 11px/1.2 system-ui,sans-serif; cursor:pointer; transition:background .18s ease,border-color .18s ease,color .18s ease,transform .18s ease; }
.portfolio-audio-prompt:hover,.portfolio-audio-prompt[aria-pressed="true"] { transform:translateY(-1px); border-color:rgba(207,230,90,.6); background:rgba(207,230,90,.1); color:#e7f5ad; }
.portfolio-audio-prompt:focus-visible { outline:2px solid #cfe65a; outline-offset:3px; }
.portfolio-audio-prompt .audio-prompt-icon { width:15px; height:15px; flex:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.portfolio-audio-prompt .audio-prompt-icon path:not(:first-child) { stroke-dasharray:15 20; stroke-dashoffset:0; transition:opacity .18s ease; }
.portfolio-audio-prompt[aria-pressed="true"] .audio-prompt-icon path:not(:first-child) { animation:portfolio-audio-wave 1s ease-in-out infinite alternate; }
@keyframes portfolio-audio-wave { to { opacity:.38; stroke-dashoffset:4; } }
.project-audio-prompt { margin:10px auto 0; }
.editorial-content { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; padding: 36px 0; min-width: 0; }
.editorial-content h4 { color: #f3f4f2; font-size:clamp(2.05rem,3.6vw,4.1rem); font-weight:700; letter-spacing:-.06em; line-height:1.05; margin:18px 0 22px; text-align:left; }
.editorial-content > p { color:#c2c9c8; font-size:clamp(15px,1.35vw,17px); line-height:1.7; margin:0 0 24px; max-width:480px; text-align:left; }
.editorial-decisions { margin:0; padding:18px 0 0; list-style:none; width:100%; max-width:480px; border-top:1px solid rgba(255,255,255,.12); }
.editorial-decisions li { display:grid; grid-template-columns: 128px minmax(0,1fr); gap:15px; padding:9px 0; line-height:1.5; text-align:left; }
.editorial-decisions b { color:#e6e9e5; text-transform:uppercase; letter-spacing:.11em; font-size:10px; font-weight:750; padding-top:4px; }
.editorial-decisions span { color:#9ea9ac; font-size:13px; }
.editorial-project-link { display:inline-flex; align-items:center; gap:9px; margin-top:25px; text-decoration:none; color:#CFE65A; font-size:13px; font-weight:650; min-height:42px; border-bottom:1px solid rgba(207,230,90,.4); }
.editorial-project-link:hover { color:#f1fdaf; }
.editorial-gallery-divider { display:flex; justify-content:space-between; align-items:center; gap:20px; border-top:1px solid rgba(255,255,255,.13); margin-top:58px; padding-top:21px; }
.editorial-gallery-divider span { color:#f1f3f0; font-size:11px; text-transform:uppercase; font-weight:750; letter-spacing:.17em; }
.editorial-gallery-divider small { color:#828d90; font-size:12px; }
#caseMyWay { border-top:1px solid rgba(255,255,255,.10); }
#caseMyWay .case-study-kicker { letter-spacing:.22em; }
#caseMyWay .case-study-title { font-size:clamp(2.55rem,4.8vw,5.35rem); }
#caseMyWay .case-study-media { border-radius:9px !important; border:1px solid rgba(255,255,255,.11); box-shadow:none; }
#caseMyWay .case-study-steps li { border-radius:7px !important; background:transparent; border-color:rgba(255,255,255,.11); }
#caseMyWay .case-study-title span { color:#aeb5ac; }
#caseMyWay .case-study-disclaimer { max-width:510px; }
@media(min-width: 1024px) {
  #top > .site-shell { grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr) !important; gap:clamp(42px,6vw,102px) !important; }
  #top .hero-device-stage { filter:none !important; }
  #top .hero-phone-shell { border-radius:12px !important; box-shadow:0 35px 96px rgba(0,0,0,.44) !important; }
  #top .hero-phone-buttons,#top .hero-phone-island { display:none !important; }
  #top .hero-phone-screen { border-radius:10px !important; overflow:hidden; }
  #top .hero-stage-caption { justify-content:flex-end; }
  #top .hero-device-glow { opacity:.3; }
}
@media(max-width: 1023px) {
  .editorial-case { min-height:0; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:25px; }
  .editorial-case:nth-child(even) { grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
  .editorial-media,.editorial-media video { min-height:370px; }
}
@media(max-width: 719px) {
  #top .hero-meta-row { justify-content:center; margin-bottom:18px !important; }
  #top .hero-lockup-main,#top .hero-lockup-product { font-size:clamp(2.65rem,10.8vw,3.6rem) !important; }
  #top .hero-summary-minimal { margin-inline:auto; }
  #top .hero-summary-minimal-copy { max-width:345px; margin-inline:auto !important; }
  #projects { padding-top:55px !important; }
  #projects > .site-shell > .max-w-4xl h2 { font-size:clamp(2.5rem,9.9vw,3.4rem) !important; }
  .editorial-intro { padding-top:20px; text-align:center; }
  .editorial-intro h3 { font-size:clamp(1.65rem,7.2vw,2.15rem); margin-inline:auto; }
  .editorial-intro p { font-size:14px; margin-inline:auto; }
  .editorial-case,.editorial-case:nth-child(even) { display:flex; flex-direction:column; gap:0; padding-top:15px; }
  .editorial-case:nth-child(even) .editorial-media-stack { order:0; }
  .editorial-case:nth-child(even) .editorial-content { order:1; }
  .editorial-media { width:100%; height:auto; min-height:0; aspect-ratio: 4/5; max-height:610px; }
  .editorial-media video { width:100%; height:100%; min-height:0; max-height:none; aspect-ratio:4/5; }
  .editorial-content { align-items:flex-start; text-align:left; padding:24px 3px 16px; }
  .editorial-content h4 { font-size:clamp(2.15rem,9.8vw,3.2rem); margin:10px 0 15px; text-align:left !important; }
  .editorial-content > p { font-size:15px; line-height:1.65; margin-bottom:18px; text-align:left !important; }
  .editorial-decisions li { grid-template-columns:115px minmax(0,1fr); gap:10px; }
  .editorial-decisions li b { font-size:9px; }
  .editorial-decisions li span { font-size:12px; }
  .editorial-decisions li,.editorial-decisions li b,.editorial-decisions li span { text-align:left !important; }
  .editorial-project-link { margin-top:13px; }
  .editorial-gallery-divider { flex-direction:column; gap:8px; margin-top:38px; text-align:center; }
  #caseMyWay { padding-top:70px; padding-bottom:70px; }
}
@media(prefers-reduced-motion:reduce) {
  .editorial-project-link,.portfolio-audio-prompt { transition:none; }
  .portfolio-audio-prompt[aria-pressed="true"] .audio-prompt-icon path:not(:first-child) { animation:none; }
}

/* Perfume process board: shared visual case layout. */
#caseMyWay .case-study-reference {
  display: inline-flex; align-items: center; gap: 11px;
  width: fit-content; min-height: 44px; margin-top: 13px;
  font-size: 12px; font-weight: 700; letter-spacing: .02em;
  text-decoration: none; color: #CFE65A;
  border-bottom: 1px solid rgba(207,230,90,.42);
  transition: border-color .18s ease, color .18s ease;
}
#caseMyWay .case-study-reference:hover { border-color: #CFE65A; color: #f3ffc4; }
#caseMyWay .case-study-reference:focus-visible { outline: 2px solid #CFE65A; outline-offset: 4px; }
@media (max-width:719px) {
  #caseMyWay .case-study-reference { justify-content: center; margin-left: auto; margin-right: auto; }
}
@media (prefers-reduced-motion:reduce) { #caseMyWay .case-study-reference { transition:none; } }

/* LAB03 / Systems presentation — standalone, lightweight, accessible, no extra JS. */
#system {scroll-margin-top:86px}
.studio-system {position:relative;isolation:isolate;overflow:hidden;padding:clamp(86px,9.5vw,145px) 0;background:linear-gradient(180deg,#0f1315,#0b0f10 60%,#101416);border-block:1px solid rgba(255,255,255,.075)}
.studio-system::before {content:"";position:absolute;inset:0;pointer-events:none;opacity:.17;background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);background-size:75px 75px;mask-image:linear-gradient(180deg,transparent,#000 30%,transparent)}
.studio-system > .site-shell {position:relative;z-index:1}
.studio-system-head {display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.72fr);align-items:end;gap:clamp(24px,6vw,100px);margin-bottom:clamp(38px,5vw,69px)}
.studio-system-kicker {color:#CFE65A;font-size:11px;font-weight:700;letter-spacing:.20em;text-transform:uppercase;margin-bottom:23px}
.studio-system-title {max-width:860px;color:#f1f3ef;font-size:clamp(2.85rem,5.55vw,6.25rem);font-weight:700;letter-spacing:-.062em;line-height:.99;text-wrap:balance;margin:0}
.studio-system-title span {display:block;color:#aeb6b0}
.studio-system-head-copy {padding-bottom:8px}
.studio-system-head-copy p {color:#d3d8d5;font-size:clamp(16px,1.4vw,19px);line-height:1.62;letter-spacing:-.015em;text-align:left;margin:0}
.studio-system-head-copy small {display:block;color:#a5b1ae;font-size:12px;line-height:1.55;margin-top:19px;padding-top:17px;border-top:1px solid rgba(255,255,255,.15)}
.studio-system-board {border:1px solid rgba(207,230,90,.19);border-radius:13px;background:linear-gradient(140deg,rgba(27,37,35,.92),rgba(13,17,19,.99));box-shadow:0 25px 80px rgba(0,0,0,.16);overflow:hidden}
.studio-system-boardbar {display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:53px;padding:13px 24px;background:rgba(255,255,255,.02);border-bottom:1px solid rgba(255,255,255,.09)}
.studio-system-boardbar strong {display:flex;align-items:center;gap:9px;color:#ebf0ea;letter-spacing:.125em;font-size:11px;font-weight:750}
.studio-system-boardbar > span {color:#a8b3b0;font-size:11px;letter-spacing:.035em}
.studio-system-dot {width:7px;height:7px;flex:0 0 7px;border-radius:50%;background:#CFE65A;box-shadow:0 0 10px rgba(207,230,90,.35)}
.studio-system-map {display:grid;grid-template-columns:minmax(0,.86fr) 22px minmax(0,1.33fr) 22px minmax(0,.86fr);gap:clamp(11px,1.7vw,28px);padding:clamp(19px,3vw,42px);align-items:stretch}
.studio-system-panel {display:flex;flex-direction:column;min-width:0;min-height:325px;padding:clamp(18px,2vw,28px);background:rgba(255,255,255,.022);border:1px solid rgba(255,255,255,.115);border-radius:9px;text-align:left}
.studio-system-panel h3 {margin:16px 0 12px;color:#f2f4ef;font-size:clamp(1.18rem,1.8vw,1.65rem);font-weight:700;letter-spacing:-.044em;line-height:1.13;text-align:left}
.studio-system-panel p {margin:0;color:#b3c0ba;font-size:13px;line-height:1.6;text-align:left}
.studio-system-number {color:#CFE65A;text-transform:uppercase;letter-spacing:.15em;font-size:10px;font-weight:700;line-height:1.5}
.studio-system-arrow {display:flex;align-items:center;justify-content:center;color:#CFE65A;font-size:24px;opacity:.8}
.studio-system-tags,.studio-system-outputs {display:flex;flex-wrap:wrap;gap:7px;margin-top:auto;padding-top:22px}
.studio-system-tags span {padding:7px 9px;border:1px solid rgba(255,255,255,.15);border-radius:5px;color:#dee3dc;font-size:10px;line-height:1.3}
.studio-system-engine {border-color:rgba(207,230,90,.34);background:linear-gradient(145deg,rgba(207,230,90,.055),rgba(255,255,255,.016))}
.studio-system-engine h3 {margin-bottom:16px}
.studio-system-sequence {list-style:none;display:flex;flex-direction:column;width:100%;padding:0;margin:0;border-top:1px solid rgba(255,255,255,.105)}
.studio-system-sequence li {display:grid;grid-template-columns:23px minmax(0,1fr);gap:11px;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.075)}
.studio-system-sequence li b {color:#CFE65A;font-size:11px;font-weight:750;line-height:1.5}
.studio-system-sequence li > span {color:#eef0e9;font-size:12px;font-weight:650;line-height:1.35;text-align:left}
.studio-system-sequence li small {display:block;color:#99a7a3;font-size:11px;font-weight:400;line-height:1.4;margin-top:3px}
.studio-system-outputs {flex-direction:column;align-items:stretch;width:100%}
.studio-system-outputs span {padding:8px 11px;background:rgba(0,0,0,.15);border:1px solid rgba(255,255,255,.135);border-radius:5px;color:#dce4dc;font-size:12px;line-height:1.35}
.studio-system-boardnote {margin:0;padding:15px 25px;border-top:1px solid rgba(255,255,255,.085);color:#acb8b3;font-size:12px;line-height:1.5;text-align:left}
.studio-system-tools {margin-top:clamp(52px,6vw,84px)}
.studio-system-tools-head {display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:25px}
.studio-system-tools-head h3 {color:#f0f2eb;font-size:clamp(1.6rem,2.5vw,2.7rem);font-weight:680;letter-spacing:-.049em;line-height:1.1;margin:0}
.studio-system-tools-head p {color:#aeb9b5;font-size:13px;line-height:1.5;margin:0}
.studio-system-toolgrid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-top:1px solid rgba(255,255,255,.17)}
.studio-system-toolgrid > div {min-width:0;padding:23px 25px 10px 0;text-align:left}
.studio-system-toolgrid > div + div {border-left:1px solid rgba(255,255,255,.12);padding-left:25px}
.studio-system-toolgrid span {display:block;color:#CFE65A;font-size:10px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;margin-bottom:19px}
.studio-system-toolgrid strong {display:block;color:#edf0e8;font-size:16px;font-weight:700;line-height:1.3}
.studio-system-toolgrid p {color:#a8b4b0;font-size:13px;line-height:1.6;margin-top:9px;overflow-wrap:anywhere;text-align:left}
.studio-system-conversion {display:flex;align-items:center;justify-content:space-between;gap:30px;margin-top:clamp(48px,5vw,79px);padding:clamp(26px,3.5vw,45px);border:1px solid rgba(207,230,90,.19);border-radius:11px;background:linear-gradient(110deg,rgba(207,230,90,.065),rgba(255,255,255,.01))}
.studio-system-conversion > div {max-width:660px;text-align:left}
.studio-system-conversion > div > span {color:#CFE65A;font-size:10px;font-weight:700;letter-spacing:.17em;text-transform:uppercase}
.studio-system-conversion h3 {color:#f0f2eb;font-size:clamp(1.75rem,2.55vw,2.6rem);font-weight:700;letter-spacing:-.04em;line-height:1.07;margin:10px 0}
.studio-system-conversion p {color:#bcc7c0;font-size:14px;line-height:1.55;margin:0;text-align:left}
.studio-system-cta {min-width:198px;min-height:51px;display:inline-flex;align-items:center;justify-content:center;gap:14px;padding:14px 20px;flex:0 0 auto;border-radius:9px;background:#CFE65A;border:1px solid #CFE65A;color:#101411;font-size:13px;font-weight:750;white-space:nowrap;text-decoration:none;transition:background .2s ease,transform .2s ease}
.studio-system-cta:hover {background:#e2f390;transform:translateY(-2px)}
.studio-system-cta:focus-visible {outline:2px solid #CFE65A;outline-offset:4px}
@media(max-width:1100px) {
.studio-system-head {grid-template-columns:minmax(0,1fr);gap:24px}
.studio-system-title span {display:inline}
.studio-system-head-copy {max-width:730px}
.studio-system-map {gap:10px;padding:18px;grid-template-columns:minmax(0,1fr) 15px minmax(0,1.2fr) 15px minmax(0,1fr)}
.studio-system-panel {min-height:325px;padding:17px}
.studio-system-panel h3 {font-size:1.3rem}
}
@media(max-width:749px) {
.studio-system {padding:70px 0 84px}
.studio-system-head {text-align:center;gap:19px;margin-bottom:29px}
.studio-system-kicker {margin-bottom:18px}
.studio-system-title {font-size:clamp(2.55rem,10.6vw,3.8rem)}
.studio-system-title span {display:block}
.studio-system-head-copy {max-width:480px;margin:0 auto}
.studio-system-head-copy p {text-align:center;font-size:15px}
.studio-system-head-copy small {text-align:center}
.studio-system-boardbar {padding:13px 15px}
.studio-system-boardbar strong {font-size:10px}
.studio-system-boardbar > span {font-size:10px;text-align:right}
.studio-system-map {display:flex;flex-direction:column;gap:0;padding:16px}
.studio-system-panel {min-height:0;padding:21px 20px}
.studio-system-panel h3 {font-size:1.55rem;margin:11px 0}
.studio-system-tags,.studio-system-outputs {margin-top:8px;padding-top:13px}
.studio-system-arrow {height:35px;min-height:35px;transform:rotate(90deg)}
.studio-system-boardnote {padding:13px 15px;text-align:center}
.studio-system-tools {margin-top:41px}
.studio-system-tools-head {flex-direction:column;align-items:flex-start;gap:11px;margin-bottom:17px}
.studio-system-tools-head h3 {font-size:clamp(1.6rem,7vw,2.15rem)}
.studio-system-toolgrid {grid-template-columns:minmax(0,1fr)}
.studio-system-toolgrid > div,.studio-system-toolgrid > div + div {padding:20px 2px !important;border-left:0 !important;border-bottom:1px solid rgba(255,255,255,.10)}
.studio-system-toolgrid span {margin-bottom:9px}
.studio-system-conversion {margin-top:41px;padding:25px 20px;flex-direction:column;align-items:stretch;gap:22px}
.studio-system-conversion h3 {font-size:1.9rem}
.studio-system-cta {width:100%;white-space:normal}
}
@media(prefers-reduced-motion:reduce) {.studio-system-cta {transition:none}.studio-system-cta:hover {transform:none}}

/* Final mobile editorial alignment review: avoid inherited centered card headings. */
@media(max-width:749px) {
  #system .studio-system-toolgrid strong,
  #system .studio-system-toolgrid p,
  #system .studio-system-toolgrid span,
  #system .studio-system-conversion h3,
  #system .studio-system-conversion p,
  #system .studio-system-conversion > div > span {
    text-align:left !important;
  }
  #system .studio-system-tools-head h3,
  #system .studio-system-tools-head p {text-align:left !important}
}

/* LAB04 — Compact collaboration, not another production-system explanation. */
#method.method-brief { position:relative; isolation:isolate; overflow:hidden; padding:clamp(72px,8vw,112px) 0; background:#0e1214; border-top:1px solid rgba(255,255,255,.08); }
#method .method-brief-head { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,.65fr); align-items:end; gap:clamp(22px,4vw,70px); margin-bottom:35px; }
#method .method-brief-kicker { font-size:11px; text-transform:uppercase; letter-spacing:.20em; color:#CFE65A; font-weight:700; margin:0 0 18px; }
#method .method-brief-head h2 { font-size:clamp(2.75rem,4.85vw,5.2rem); line-height:1.01; letter-spacing:-.057em; font-weight:700; color:#f0f3ed; margin:0; text-wrap:balance; }
#method .method-brief-head h2 span { color:#afb8af; }
#method .method-brief-head > p { color:#bbc6c3; font-size:16px; line-height:1.68; max-width:410px; margin:0; }
#method .method-brief-stage { isolation:isolate; position:relative; overflow:hidden; padding:clamp(20px,3vw,40px); border:1px solid rgba(255,255,255,.13); border-radius:12px; background:radial-gradient(ellipse at 55% 0%,rgba(207,230,90,.065),transparent 68%),#0e1315; }
#method .method-brief-stage::before { position:absolute; content:""; inset:0; z-index:0; background:linear-gradient(95deg,rgba(10,15,15,.90),rgba(10,15,15,.74)); pointer-events:none; }
#method video.method-brief-ambient { position:absolute; z-index:-1; inset:0; width:100%; height:100%; object-fit:cover; opacity:.24; pointer-events:none; }
#method .method-brief-grid { position:relative; z-index:1; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(17px,3vw,38px); }
#method .method-brief-grid article { min-width:0; padding:12px 7px; text-align:left; }
#method .method-brief-grid article + article { border-left:1px solid rgba(255,255,255,.14); padding-left:clamp(18px,2.5vw,32px); }
#method .method-brief-grid article > span { color:#CFE65A; display:block; font-size:10px; letter-spacing:.16em; text-transform:uppercase; font-weight:750; margin-bottom:24px; text-align:left; }
#method .method-brief-grid h3 { color:#f1f2ed; margin:0 0 14px; font-size:clamp(1.3rem,2.15vw,2.1rem); letter-spacing:-.04em; font-weight:700; line-height:1.16; text-align:left; }
#method .method-brief-grid p { margin:0; font-size:14px; color:#b8c3bf; line-height:1.68; text-align:left; }
#method .method-brief-scope { margin:17px 0 0; color:#a7b4b0; font-size:12px; line-height:1.6; text-align:left; }
@media(max-width:767px) {
  #method.method-brief { padding:65px 0 80px; }
  #method .method-brief-head { display:flex; flex-direction:column; align-items:center; gap:18px; margin-bottom:25px; text-align:center; }
  #method .method-brief-head h2 { font-size:clamp(2.55rem,10vw,3.8rem); text-align:center; }
  #method .method-brief-head h2 span { display:block; }
  #method .method-brief-head > p { text-align:center; font-size:15px; }
  #method .method-brief-stage { padding:17px 20px; }
  #method .method-brief-grid { grid-template-columns:minmax(0,1fr); gap:0; }
  #method .method-brief-grid article { padding:19px 0; }
  #method .method-brief-grid article + article { padding-left:0; border-left:0; border-top:1px solid rgba(255,255,255,.14); }
  #method .method-brief-grid article > span { margin-bottom:12px; }
  #method .method-brief-grid h3 { font-size:1.55rem; margin-bottom:8px; }
  #method .method-brief-grid p { font-size:14px; }
  #method .method-brief-scope { text-align:center; max-width:360px; margin:18px auto 0; }
}
@media(prefers-reduced-motion:reduce) { #method video.method-brief-ambient { display:none; } }


/* Premium system treatment: low-contrast moving texture over a reliable static background. */
#system .studio-system-board { position:relative; isolation:isolate; }
#system .studio-system-ambient {
  position:absolute; inset:0; z-index:0;
  display:block; width:100%; height:100%; object-fit:cover;
  object-position:50% 42%; opacity:.25; pointer-events:none;
  filter:saturate(.64) contrast(1.11) brightness(.83);
}
#system .studio-system-board::before {
  content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:linear-gradient(112deg,rgba(10,16,18,.79),rgba(9,14,16,.69) 47%,rgba(7,11,13,.83));
}
#system .studio-system-boardbar,
#system .studio-system-map,
#system .studio-system-boardnote { position:relative; z-index:2; }
#system .studio-system-boardbar { background:rgba(10,16,17,.22); }
#system .studio-system-panel { background:rgba(16,24,24,.38); border-color:rgba(255,255,255,.17); }
#system .studio-system-engine { background:linear-gradient(135deg,rgba(207,230,90,.095),rgba(10,17,19,.44)); border-color:rgba(207,230,90,.40); }
@media(max-width:749px){
  #system .studio-system-ambient { opacity:.18; object-position:58% center; }
  #system .studio-system-board::before {background:linear-gradient(180deg,rgba(8,13,15,.79),rgba(8,13,15,.84));}
  #system .studio-system-panel {background:rgba(11,18,19,.53);}
}
@media(prefers-reduced-motion:reduce){
  #system .studio-system-ambient {display:none;}
}


/* Production System: visible cinematography, readable cards, and a real static fallback.
   Earlier .25 alpha behind ~.7 scrim yielded <8% perceived source visibility. */
#system .studio-system-board {
  background:
    radial-gradient(ellipse at 79% 23%,rgba(122,161,142,.22),transparent 46%),
    radial-gradient(ellipse at 10% 90%,rgba(207,230,90,.12),transparent 51%),
    linear-gradient(140deg,#1a2729,#10191c 48%,#101513);
  border:1px solid rgba(207,230,90,.36);
  box-shadow:0 26px 94px rgba(0,0,0,.36),inset 0 1px 0 rgba(238,250,220,.18);
}
#system .studio-system-ambient {
  opacity:.78;
  object-position:center 43%;
  filter:saturate(.85) contrast(1.18) brightness(1.06);
}
#system .studio-system-board::before {
  background:linear-gradient(112deg,rgba(7,13,15,.31),rgba(8,14,16,.22) 45%,rgba(6,11,14,.41));
}
#system .studio-system-board::after {
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:
    radial-gradient(ellipse at 75% 4%,rgba(207,230,90,.14),transparent 42%),
    radial-gradient(ellipse at 6% 87%,rgba(63,124,139,.16),transparent 52%);
  mix-blend-mode:screen;
  opacity:.93;
  animation:studio-system-atmosphere 12s ease-in-out infinite alternate;
}
#system .studio-system-boardbar {
  background:rgba(7,13,14,.69);
  border-bottom-color:rgba(207,230,90,.25);
  backdrop-filter:blur(7px);
  -webkit-backdrop-filter:blur(7px);
}
#system .studio-system-panel {
  background:rgba(8,14,16,.80);
  border-color:rgba(229,243,234,.24);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.075),0 12px 28px rgba(0,0,0,.16);
}
#system .studio-system-engine {
  background:linear-gradient(144deg,rgba(31,43,38,.89),rgba(8,14,16,.86));
  border-color:rgba(207,230,90,.44);
  box-shadow:inset 0 1px 0 rgba(207,230,90,.13),0 12px 35px rgba(0,0,0,.18);
}
#system .studio-system-boardnote {
  background:rgba(7,13,15,.56);
  color:#d1dcd6;
  border-top:1px solid rgba(255,255,255,.12);
}
@keyframes studio-system-atmosphere {
  from {opacity:.72;transform:translate3d(0,0,0) scale(1);}
  to {opacity:1;transform:translate3d(0,-1.2%,0) scale(1.04);}
}
@media(max-width:749px) {
  #system .studio-system-ambient {opacity:.65;object-position:58% center;}
  #system .studio-system-board::before {
    background:linear-gradient(180deg,rgba(7,13,15,.40),rgba(7,13,15,.48));
  }
  #system .studio-system-panel {background:rgba(7,13,15,.87);}
  #system .studio-system-boardbar {backdrop-filter:none;-webkit-backdrop-filter:none;}
  #system .studio-system-board::after {
    background:radial-gradient(ellipse at 68% 8%,rgba(207,230,90,.13),transparent 52%),
               radial-gradient(ellipse at 6% 90%,rgba(63,124,139,.14),transparent 53%);
  }
}
@media(prefers-reduced-motion:reduce) {
  #system .studio-system-board::after {animation:none;transform:none;opacity:.95;}
}


/* TOOL STACK V1 — editorial cards with a restrained, staggered RGB-light wave. */
#system .studio-system-tools-head { align-items:end; gap:clamp(20px,5vw,75px); margin-bottom:27px; }
#system .studio-system-tools-head > div { min-width:0; max-width:680px; }
#system .studio-system-tools-head > p { max-width:330px; font-size:14px; line-height:1.68; color:#bac5c2; }
#system .tool-pipeline-overline { display:block; margin:0 0 14px; font-size:10px; font-weight:800; letter-spacing:.20em; color:#CFE65A; }
#system .studio-system-toolgrid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:13px; border:0; }
#system .studio-system-toolgrid > .tool-pipeline-card {
  position:relative; isolation:isolate; display:flex; flex-direction:column;
  min-width:0; min-height:352px; overflow:hidden;
  padding:clamp(22px,2.35vw,31px);
  border:1px solid rgba(235,247,242,.14); border-radius:13px;
  background:radial-gradient(ellipse at 90% -20%,rgba(122,147,140,.10),transparent 55%),linear-gradient(147deg,#171e20 0%,#101517 65%,#111717 100%);
  box-shadow:0 19px 54px rgba(0,0,0,.13), inset 0 1px 0 rgba(255,255,255,.045);
  transition:border-color .35s ease, transform .4s cubic-bezier(.2,.75,.2,1), box-shadow .4s ease;
}
#system .studio-system-toolgrid > .tool-pipeline-card + .tool-pipeline-card {padding-left:clamp(22px,2.35vw,31px); border-left:1px solid rgba(235,247,242,.14);}
#system .tool-pipeline-card > * {position:relative;z-index:2;}
#system .tool-pipeline-card::before {
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;opacity:.74;
  padding:1px;border-radius:inherit;
  background:linear-gradient(115deg,rgba(207,230,90,.17),rgba(92,200,214,.70),rgba(179,120,218,.57),rgba(207,230,90,.62),rgba(92,200,214,.22));
  background-size:280% 100%;
  -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;
  mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  mask-composite:exclude;
  animation:tool-pipeline-border-wave 16s linear infinite;
  animation-delay:var(--wave-stagger,0s);
}
#system .tool-pipeline-card::after {
  content:"";position:absolute;top:-22%;bottom:-22%;left:0;width:63%;z-index:0;
  pointer-events:none;opacity:.40;filter:blur(20px);
  background:linear-gradient(90deg,transparent,rgba(207,230,90,.055),rgba(81,180,212,.085),rgba(186,122,229,.06),transparent);
  transform:translateX(-180%);
  animation:tool-pipeline-sweep 16s ease-in-out infinite;
  animation-delay:var(--wave-stagger,0s);
}
#system .tool-pipeline-card-heading { display:flex;align-items:center;justify-content:space-between;gap:12px; }
#system .studio-system-toolgrid .tool-pipeline-number {
  color:#CFE65A;font-size:10px;font-weight:800;letter-spacing:.17em;text-transform:uppercase;margin:0;line-height:1.4;
}
#system .studio-system-toolgrid .tool-pipeline-corner {font-size:21px;font-weight:300;color:#71827d;line-height:1; margin:0;}
#system .studio-system-toolgrid .tool-pipeline-card h4 {font-size:clamp(1.52rem,2.08vw,2.04rem);font-weight:700;letter-spacing:-.052em;line-height:1.08;color:#f1f3ec;text-wrap:balance;margin:23px 0 11px;text-align:left;}
#system .studio-system-toolgrid .tool-pipeline-description {
  color:#b3c1bc; font-size:13px;line-height:1.63;max-width:320px;
  min-height:62px;margin:0 0 27px;overflow-wrap:normal;text-align:left;
}
#system .tool-apps {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:auto;}
#system .tool-apps--four {grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;}
#system .tool-app {display:flex;align-items:center;flex-direction:column;gap:9px;min-width:0;padding:12px 4px 9px;
  border-radius:8px;border:1px solid rgba(255,255,255,.075);background:rgba(6,11,13,.42);
  transition:background .35s ease,border-color .35s ease,box-shadow .35s ease;}
#system .tool-app-logo {display:grid;place-items:center;width:43px;height:43px;min-width:43px;margin:0;border-radius:11px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.09);}
#system .tool-app-logo img {display:block;width:31px;height:31px;max-width:none;object-fit:contain;}
#system .tool-app-logo--mono img {filter:brightness(0) invert(1);opacity:.91;}
#system .tool-app-logo--color {background:rgba(255,255,255,.045);}
#system .tool-app-logo--color img[src$="higgsfield.svg"] {border-radius:7px;}
#system .studio-system-toolgrid .tool-app-name {display:block;min-width:0;max-width:100%;margin:0;
  color:#d5dfda;font-size:clamp(10px,.83vw,12px);font-weight:600;letter-spacing:-.01em;text-align:center;
  line-height:1.35;overflow-wrap:normal;hyphens:none;text-transform:none;}
#system .tool-pipeline-caption {margin:17px 0 0;color:#93a4a0;font-size:12px;text-align:right;letter-spacing:.01em;}
@media(hover:hover) and (pointer:fine){
  #system .tool-pipeline-card:hover {transform:translateY(-4px);border-color:rgba(207,230,90,.32);box-shadow:0 27px 72px rgba(0,0,0,.24),0 0 30px rgba(96,201,210,.04);}
  #system .tool-pipeline-card:hover::before {opacity:1;}
  #system .tool-app:hover {background:rgba(207,230,90,.07);border-color:rgba(207,230,90,.22);box-shadow:inset 0 0 19px rgba(207,230,90,.035);}
}
@keyframes tool-pipeline-border-wave {0%{background-position:0% 50%}100%{background-position:280% 50%}}
@keyframes tool-pipeline-sweep {0%,8%{transform:translateX(-190%);opacity:0}35%{opacity:.42}59%,100%{transform:translateX(245%);opacity:0}}
@media(max-width:1050px) and (min-width:750px){
  #system .studio-system-toolgrid {gap:10px;}
  #system .studio-system-toolgrid > .tool-pipeline-card,
  #system .studio-system-toolgrid > .tool-pipeline-card + .tool-pipeline-card {padding:19px;}
  #system .studio-system-toolgrid .tool-pipeline-card h4 {font-size:1.49rem;}
  #system .studio-system-toolgrid .tool-app-name {font-size:10px;}
  #system .tool-app {padding-inline:1px;}
  #system .tool-app-logo {width:39px;height:39px;min-width:39px;}
  #system .tool-app-logo img {width:29px;height:29px;}
}
@media(max-width:749px) {
  #system .studio-system-tools-head {gap:12px;margin-bottom:19px;}
  #system .studio-system-tools-head > p {max-width:510px;font-size:14px;}
  #system .studio-system-toolgrid {grid-template-columns:minmax(0,1fr);gap:13px;}
  #system .studio-system-toolgrid > .tool-pipeline-card,
  #system .studio-system-toolgrid > .tool-pipeline-card + .tool-pipeline-card {
    padding:23px 20px 22px !important;min-height:unset;
    border:1px solid rgba(235,247,242,.15) !important;
  }
  #system .studio-system-toolgrid .tool-pipeline-card h4 {font-size:clamp(1.5rem,6vw,1.9rem);margin:17px 0 9px;}
  #system .studio-system-toolgrid .tool-pipeline-description {margin:0 0 18px;min-height:0;}
  #system .tool-app {padding:12px 3px 10px;}
  #system .studio-system-toolgrid .tool-app-name {font-size:11px;}
  #system .tool-pipeline-caption {text-align:left;margin-top:16px;}
}
@media(prefers-reduced-motion:reduce) {
  #system .tool-pipeline-card::before,#system .tool-pipeline-card::after {animation:none !important;}
  #system .tool-pipeline-card::before {background-position:35% 50%;opacity:.33;}
  #system .tool-pipeline-card::after {opacity:0;transform:none;}
  #system .tool-pipeline-card,#system .tool-app {transition:none;}
}

/* Stack composition after moving to two direction tools and three finishing tools. */
#system .tool-apps--two {grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;}
@media(max-width:749px) {
  #system .tool-apps--two {grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;}
}

/* Curated identity layout: recognizable icons, balanced three/two/three rhythm. */
#system .tool-pipeline-direction .tool-apps,
#system .tool-pipeline-finishing .tool-apps { grid-template-columns:repeat(3,minmax(0,1fr));justify-content:center; }
#system .tool-pipeline-generation .tool-apps--two {
  grid-template-columns:repeat(2,minmax(0,104px));
  justify-content:center;
  align-content:end;
  gap:12px;
}
#system .tool-pipeline-card .tool-app {justify-content:center;min-height:103px;}
#system .tool-pipeline-card .tool-app-logo {margin-inline:auto;background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.115);}
#system .tool-pipeline-card .tool-app-logo img {object-fit:contain;}
@media(max-width:1050px) and (min-width:750px) {
  #system .tool-pipeline-generation .tool-apps--two {grid-template-columns:repeat(2,minmax(0,96px));gap:8px;}
}
@media(max-width:749px) {
  #system .tool-pipeline-generation .tool-apps--two {grid-template-columns:repeat(2,minmax(0,120px));justify-content:center;gap:12px;}
  #system .tool-pipeline-card .tool-app {min-height:100px;}
}


/* Unified navigation / 2026-10-09
   Desktop sections are mathematically centered; mobile brand stays centered.
   The legacy independently fixed Inicio chip is now part of the same header. */
#portfolioHeader {
  background:rgba(12,17,18,.82);
  border-bottom:1px solid rgba(224,241,232,.085);
  -webkit-backdrop-filter:blur(18px) saturate(132%);
  backdrop-filter:blur(18px) saturate(132%);
  box-shadow:0 7px 32px rgba(0,0,0,.12);
}
#portfolioHeader .portfolio-nav-layout {
  display:grid;
  grid-template-columns:minmax(250px,1fr) auto minmax(130px,1fr);
  align-items:center;
  column-gap:clamp(12px,2.4vw,25px);
  height:72px;
  min-height:72px;
}
#portfolioHeader .portfolio-nav-left {
  display:flex;align-items:center;gap:clamp(11px,1.2vw,17px);
  min-width:0;white-space:nowrap;
}
#portfolioHeader .portfolio-nav-home {
  display:inline-flex;align-items:center;justify-content:center;gap:7px;
  flex:none;min-height:36px;padding:0 13px;
  border:1px solid rgba(232,247,239,.12);border-radius:999px;
  background:rgba(255,255,255,.035);color:#adbab4;
  font:600 11px/1 Inter,ui-sans-serif,system-ui,sans-serif;
  letter-spacing:.015em;text-decoration:none;
  transition:background .22s ease,border-color .22s ease,color .22s ease;
}
#portfolioHeader .portfolio-nav-home span:first-child {font-size:16px;line-height:1;transform:translateY(-1px);}
#portfolioHeader .portfolio-nav-home-extra {display:inline;}
#portfolioHeader .portfolio-nav-brand {
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  min-width:0;color:#f0f3ec;font-size:15px;font-weight:740;
  letter-spacing:-.035em;line-height:1.1;white-space:nowrap;text-decoration:none;
  transition:color .22s ease;
}
#portfolioHeader .portfolio-nav-brand-dot {
  width:9px;height:9px;flex:none;border-radius:50%;
  background:#CFE65A;box-shadow:0 0 17px rgba(207,230,90,.32);
}
#portfolioHeader .portfolio-nav-links {
  display:flex;align-items:center;justify-content:center;gap:3px;
  padding:4px;border:1px solid rgba(244,251,247,.09);
  border-radius:999px;background:rgba(255,255,255,.035);
  min-width:0;white-space:nowrap;
}
#portfolioHeader .portfolio-nav-links a {
  display:inline-flex;align-items:center;justify-content:center;min-height:36px;
  padding:0 15px;border-radius:999px;text-decoration:none;
  font:600 12px/1.1 Inter,ui-sans-serif,system-ui,sans-serif;
  color:#b6c3be;letter-spacing:.005em;
  transition:color .22s ease,background .22s ease;
}
#portfolioHeader .portfolio-nav-contact {
  justify-self:end;display:inline-flex;align-items:center;justify-content:center;gap:9px;
  min-height:40px;padding:0 19px;border-radius:999px;
  background:#f0f3ed;color:#121816;text-decoration:none;white-space:nowrap;
  font:750 12px/1 Inter,ui-sans-serif,system-ui,sans-serif;
  box-shadow:0 7px 24px rgba(0,0,0,.15);
  transition:background .22s ease,box-shadow .22s ease,transform .22s ease;
}
#portfolioHeader .portfolio-nav-contact span {font-size:15px;line-height:1;}
#portfolioHeader .portfolio-nav-mobile {display:none;}
#portfolioHeader .portfolio-mobile-menu {display:none;}
@media(hover:hover) and (pointer:fine) {
  #portfolioHeader .portfolio-nav-home:hover {color:#edf3e7;background:rgba(255,255,255,.08);border-color:rgba(207,230,90,.23);}
  #portfolioHeader .portfolio-nav-brand:hover {color:#CFE65A;}
  #portfolioHeader .portfolio-nav-links a:hover {color:#f5f9f3;background:rgba(207,230,90,.085);}
  #portfolioHeader .portfolio-nav-contact:hover {background:#CFE65A;box-shadow:0 8px 29px rgba(207,230,90,.12);transform:translateY(-1px);}
}
#portfolioHeader :is(.portfolio-nav-home,.portfolio-nav-brand,.portfolio-nav-links a,.portfolio-nav-contact,.portfolio-nav-menu-button,.portfolio-mobile-menu a):focus-visible {
  outline:2px solid #CFE65A;outline-offset:3px;
}
@media(max-width:1099px) {
  #portfolioHeader .portfolio-nav-layout {
    grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
    gap:8px;
    height:68px;min-height:68px;
  }
  #portfolioHeader .portfolio-nav-left {display:contents;}
  #portfolioHeader .portfolio-nav-home {
    grid-column:1;justify-self:start;min-height:36px;padding-inline:12px;
  }
  #portfolioHeader .portfolio-nav-brand {
    grid-column:2;justify-self:center;font-size:15px;gap:8px;
  }
  #portfolioHeader .portfolio-nav-brand-dot {width:8px;height:8px;}
  #portfolioHeader .portfolio-nav-links,#portfolioHeader .portfolio-nav-contact {display:none;}
  #portfolioHeader .portfolio-nav-mobile {
    grid-column:3;justify-self:end;display:flex;align-items:center;
  }
  #portfolioHeader .portfolio-nav-menu-button {
    width:42px;height:42px;display:grid;place-items:center;
    border-radius:12px;border:1px solid rgba(238,245,240,.13);
    background:rgba(255,255,255,.045);color:#f4f7f3;
  }
  #portfolioHeader .portfolio-mobile-menu {
    display:block;position:absolute;top:100%;left:50%;right:auto;
    width:min(450px,calc(100vw - 24px));
    padding:8px;border:1px solid rgba(236,248,239,.13);
    border-radius:0 0 16px 16px;
    background:rgba(13,19,20,.97);
    box-shadow:0 27px 70px rgba(0,0,0,.36);
    -webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);
    visibility:hidden;
    transform:translate(-50%,-8px);
    z-index:2;
  }
  #portfolioHeader .portfolio-mobile-menu.is-open {visibility:visible;transform:translate(-50%,0);}
  #portfolioHeader .portfolio-mobile-menu-links {
    display:grid;grid-template-columns:1fr;gap:4px;
    padding:8px;
  }
  #portfolioHeader .portfolio-mobile-menu-links a {
    display:flex;align-items:center;justify-content:center;min-height:48px;
    border:1px solid transparent;border-radius:9px;
    color:#cbd4d0;font-size:14px;font-weight:650;letter-spacing:.005em;
    text-align:center;text-decoration:none;
  }
  #portfolioHeader .portfolio-mobile-menu-links a:hover,
  #portfolioHeader .portfolio-mobile-menu-links a:focus-visible {
    color:#f0f4ed;background:rgba(207,230,90,.075);
  }
  #portfolioHeader .portfolio-mobile-menu-links .portfolio-mobile-menu-contact {
    margin-top:6px;background:#f0f3ed;color:#121816;gap:8px;font-weight:750;
  }
}
@media(max-width:639px) {
  #portfolioHeader .portfolio-nav-layout {height:64px;min-height:64px;}
  #portfolioHeader .portfolio-nav-home {font-size:10px;min-height:34px;padding-inline:10px;gap:5px;}
  #portfolioHeader .portfolio-nav-home-extra {display:none;}
  #portfolioHeader .portfolio-nav-brand {font-size:14px;}
  #portfolioHeader .portfolio-nav-menu-button {width:40px;height:40px;}
}
@media(max-width:359px) {
  #portfolioHeader .portfolio-nav-brand {font-size:12px;gap:6px;}
  #portfolioHeader .portfolio-nav-home {font-size:9px;padding-inline:8px;}
}
@media(prefers-reduced-motion:reduce) {
  #portfolioHeader :is(.portfolio-nav-home,.portfolio-nav-brand,.portfolio-nav-links a,.portfolio-nav-contact) {transition:none;}
}
#top,#projects,#system,#services,#launchOffer,#contact {scroll-margin-top:88px;}
@media(max-width:1099px) {
  #top,#projects,#system,#services,#launchOffer,#contact {scroll-margin-top:78px;}
}

/* Bare vertical previews: no phone frame, category tag, or floating label over footage. */
#projects .mockup-stage,#projects .project-item.project-clean-media .mockup-stage {
  min-height:0!important;height:auto!important;padding:0!important;border:0!important;border-radius:0!important;
  background:transparent!important;box-shadow:none!important;
}
#projects .mockup-stage::before,#projects .project-item.project-clean-media .mockup-stage::before {display:none!important;}
#projects .phone-shell,#projects .clean-media-frame,#projects .desktop-frame {
  width:min(100%,340px)!important;aspect-ratio:9/16!important;margin:0 auto!important;padding:0!important;overflow:hidden!important;
  border:0!important;border-radius:4px!important;background:transparent!important;box-shadow:none!important;
}
#projects .phone-screen,#projects .clean-media-frame::after {border:0!important;border-radius:4px!important;background:transparent!important;box-shadow:none!important;}
#projects .phone-screen video,#projects .clean-media-frame video,#projects .desktop-frame video {
  display:block!important;width:100%!important;height:100%!important;object-fit:cover!important;border:0!important;border-radius:4px!important;background:transparent!important;box-shadow:none!important;
}
#projects .editorial-media-stack { gap:0; }
#projects .editorial-media {
  width:min(100%,340px);height:auto;min-height:0;max-height:none;aspect-ratio:9/16;margin:0 auto;align-self:center;
  overflow:hidden;border:0;border-radius:4px;background:transparent;
}
#projects .editorial-media video {width:100%;height:100%;min-height:0;max-height:none;object-fit:cover;background:transparent;}
#projects .editorial-media::after {display:none;}

/* Avatar value banner */
#system .avatar-brand-banner{position:relative;isolation:isolate;overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:36px;padding:clamp(26px,4.5vw,60px);border-radius:24px;border:1px solid rgba(207,230,90,.25);background:radial-gradient(ellipse at 100% 0%,rgba(207,230,90,.12),transparent 58%),linear-gradient(125deg,#192121,#101617);box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 24px 65px rgba(0,0,0,.17)}
#system .avatar-brand-banner::before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:linear-gradient(180deg,transparent,#cfe65a,transparent);pointer-events:none}
#system .avatar-brand-banner>div{position:relative;max-width:710px}
#system .avatar-brand-banner .avatar-brand-kicker{display:flex;align-items:center;gap:9px;font-size:10px;letter-spacing:.16em;color:#cfe65a;text-transform:uppercase;font-weight:700}
#system .avatar-brand-kicker::before{content:"";width:6px;height:6px;border-radius:50%;background:#cfe65a;box-shadow:0 0 15px rgba(207,230,90,.45)}
#system .avatar-brand-banner h3{font-size:clamp(2rem,4.1vw,3.7rem);line-height:1.04;letter-spacing:-.055em;margin:22px 0 19px;text-wrap:balance}
#system .avatar-brand-banner h3 em{display:block;font-style:normal;color:#cfe65a}
#system .avatar-brand-banner p{max-width:570px;font-size:14px;line-height:1.75;color:#b8c6bf}
#system .avatar-brand-badges{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}
#system .avatar-brand-badges span{padding:8px 12px;border:1px solid rgba(207,230,90,.17);border-radius:999px;background:rgba(207,230,90,.045);font-size:11px;font-weight:500;color:#dce6d7;letter-spacing:.01em}
#system .avatar-brand-banner .studio-system-cta{align-self:end;position:relative;border-radius:999px;min-height:55px;padding-inline:23px}
@media(max-width:900px){#system .avatar-brand-banner{grid-template-columns:minmax(0,1fr);gap:28px}#system .avatar-brand-banner .studio-system-cta{justify-self:start;width:auto}}
@media(max-width:480px){#system .avatar-brand-banner{border-radius:19px;padding:28px 22px}#system .avatar-brand-banner .studio-system-cta{width:100%}#system .avatar-brand-banner h3{font-size:2.15rem}}

/* Brand atmosphere: soft lime orbs across the landing. */
main > section {position:relative;isolation:isolate}
main > section > .landing-atmosphere{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:-1;contain:paint}
.landing-atmosphere::before,.landing-atmosphere::after{content:"";position:absolute;width:clamp(340px,49vw,740px);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(207,230,90,.20) 0%,rgba(175,198,63,.10) 28%,rgba(175,198,63,.035) 48%,transparent 69%);animation:landing-orb-drift 24s ease-in-out infinite alternate}
.landing-atmosphere::before{left:-24%;top:5%}
.landing-atmosphere::after{right:-25%;bottom:0;opacity:.8;animation-delay:-12s;animation-direction:alternate-reverse}
main > section:nth-of-type(even) > .landing-atmosphere::before{left:auto;right:-20%;top:12%}
main > section:nth-of-type(even) > .landing-atmosphere::after{right:auto;left:-26%;bottom:8%}
#top .hero-orb{opacity:.8!important}
#top > .landing-atmosphere::before{top:0;left:-25%;opacity:.75}
#top > .landing-atmosphere::after{bottom:-10%}
@keyframes landing-orb-drift{from{transform:translate3d(0,-14px,0) scale(.95)}to{transform:translate3d(32px,30px,0) scale(1.08)}}
@media(max-width:749px){.landing-atmosphere::before,.landing-atmosphere::after{width:390px;opacity:.7;animation:none}.landing-atmosphere::before{left:-260px}.landing-atmosphere::after{right:-260px}main > section:nth-of-type(even) > .landing-atmosphere::before{right:-250px}main > section:nth-of-type(even) > .landing-atmosphere::after{left:-260px}}
@media(prefers-reduced-motion:reduce){.landing-atmosphere::before,.landing-atmosphere::after{animation:none}}

/* CONTINUUM 01 — One visual atmosphere from hero to contact (29/10/2026).
   Shared, seam-free canvas replaces per-section opaque banners and local orbs.
   Only two small transform-animated radial fields on desktop; no filter blur or JS. */
main#main-content {
  position: relative;
  isolation: isolate;
  background:
    radial-gradient(ellipse 41vw 470px at 2% 15%, rgba(207,230,90,.042), transparent 76%),
    radial-gradient(ellipse 34vw 570px at 98% 48%, rgba(120,160,135,.037), transparent 77%),
    radial-gradient(ellipse 45vw 510px at 8% 83%, rgba(207,230,90,.028), transparent 78%),
    linear-gradient(180deg, #101316 0%, #0e1214 49%, #101316 100%) !important;
}

/* The background is continuous; cards, editorial media and internal panels keep
   their own surfaces, depth, borders and existing interactive behavior. */
main#main-content > section,
main#main-content #launchOffer.pricing-packs {
  position: relative;
  background: transparent !important;
  background-image: none !important;
  background-color: transparent !important;
  border-top: 0 !important;
  border-bottom: 0 !important;
}
main#main-content > section { z-index: 1; }

/* Old glows were restarted and clipped independently at every chapter boundary.
   Keep the signature hero oval (#top::after), remove only redundant chapter art. */
main#main-content > section > .landing-atmosphere,
main#main-content #launchOffer > .landing-atmosphere,
main#main-content > #services > .services-orb,
main#main-content > #caseMyWay.club-case::before,
main#main-content > #caseMyWay.club-case::after,
main#main-content > #system.studio-system::before,
main#main-content > #method.method-brief::before {
  display: none !important;
}

/* Soft echoes of the hero ellipse: no separate banner backgrounds or costly blur.
   Transforms are compositor-friendly; no scroll handlers or new assets. */
main#main-content::before,
main#main-content::after {
  content: "";
  position: fixed;
  z-index: 0;
  width: clamp(310px, 41vw, 570px);
  height: clamp(230px, 30vw, 420px);
  border-radius: 50%;
  pointer-events: none;
  background: radial-gradient(ellipse at 48% 50%,
    rgba(207,230,90,.105) 0%,
    rgba(175,198,63,.048) 38%,
    rgba(117,130,55,.016) 57%,
    transparent 74%);
  opacity: .8;
  will-change: transform;
  animation: continuum-ellipse-drift 32s ease-in-out infinite alternate;
}
main#main-content::before {
  top: 14vh;
  left: max(-260px, -15vw);
}
main#main-content::after {
  right: max(-270px, -16vw);
  bottom: 12vh;
  opacity: .52;
  animation-delay: -17s;
  animation-direction: alternate-reverse;
}
@keyframes continuum-ellipse-drift {
  from { transform: translate3d(-10px, -8px, 0) rotate(-4deg); }
  to   { transform: translate3d(18px, 15px, 0) rotate(4deg); }
}

/* Phones and reduced-motion visitors get the same identity without continuous
   compositor work. No mobile layout or video interaction is affected. */
@media (max-width: 749px) {
  main#main-content::before {
    width: 335px;
    height: 285px;
    left: -226px;
    top: 12vh;
    opacity: .52;
  }
  main#main-content::after { display: none; }
  main#main-content::before { animation: none; transform: none; will-change: auto; }
}
@media (prefers-reduced-motion: reduce) {
  main#main-content::before,
  main#main-content::after {
    animation: none;
    transform: none;
    will-change: auto;
  }
}