/* Encontro 1.1.2 · componentes expressivos opt-in, sem reset global. */
@font-face{font-family:'Instrument Sans';src:url('./assets/fonts/InstrumentSans-400.woff') format('woff');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:'Instrument Sans';src:url('./assets/fonts/InstrumentSans-700.woff') format('woff');font-style:normal;font-weight:700;font-display:swap}

:where(.a1-expressive,.a1-flow-hero,.a1-marked,.a1-floating-header,.a1-marketing-section){
  --a1-expressive-text:var(--a1-color-ink);
  --a1-expressive-muted:var(--a1-color-muted);
  --a1-expressive-page:var(--a1-color-canvas);
  --a1-expressive-solid:var(--a1-color-surface);
  --a1-expressive-accent:var(--a1-color-rose-deep);
  --a1-expressive-marked:var(--a1-material-marked-light);
  --a1-expressive-marked-solid:var(--a1-material-marked-solid-light);
  --a1-expressive-marked-line:var(--a1-material-marked-line-light);
  --scene-particle-rgb:62,58,54;
  --scene-accent-rgb:157,111,94;
  font-family:var(--a1-font-family-body);
  color:var(--a1-expressive-text);
}
:where([data-theme=dark],[data-a1p-theme=dark],.dark) :where(.a1-expressive,.a1-flow-hero,.a1-marked,.a1-floating-header,.a1-marketing-section),
:where(.a1-expressive,.a1-flow-hero,.a1-marked,.a1-floating-header,.a1-marketing-section):where([data-theme=dark],[data-a1p-theme=dark]){
  --a1-expressive-text:var(--a1-color-on-dark);
  --a1-expressive-muted:var(--a1-color-muted-on-dark);
  --a1-expressive-page:var(--a1-color-ink);
  --a1-expressive-solid:var(--a1-color-surface-dark);
  --a1-expressive-accent:var(--a1-color-azalea);
  --a1-expressive-marked:var(--a1-material-marked-dark);
  --a1-expressive-marked-solid:var(--a1-material-marked-solid-dark);
  --a1-expressive-marked-line:var(--a1-material-marked-line-dark);
  --scene-particle-rgb:236,232,225;
  --scene-accent-rgb:191,150,131;
}
.a1-expressive{background:var(--a1-expressive-page)}

/* Contexto visual; dados densos e leitura longa usam uma superfície sólida. */
.a1-marked{
  background:var(--a1-expressive-marked);
  border:1px solid var(--a1-expressive-marked-line);
  border-radius:var(--a1-radius-20);
  box-shadow:var(--a1-shadow-soft);
  -webkit-backdrop-filter:blur(var(--a1-glass-blur));
  backdrop-filter:blur(var(--a1-glass-blur));
  transition:box-shadow var(--a1-motion-standard) var(--a1-ease-standard),border-color var(--a1-motion-standard) var(--a1-ease-standard);
}
.a1-marked[data-a1-surface=solid]{background:var(--a1-expressive-solid);-webkit-backdrop-filter:none;backdrop-filter:none}

/* O header ocupa sua linha; a rolagem fica recortada abaixo dos controles. */
.a1-floating-layout{--a1-floating-height:76px;display:grid;grid-template-rows:var(--a1-floating-height) minmax(0,1fr);height:100svh;overflow:hidden}
.a1-floating-layout:has(>.a1-floating-header[data-compact=true]){--a1-floating-height:64px}
.a1-floating-header{
  box-sizing:border-box;position:relative;z-index:100;justify-self:center;align-self:center;overflow:visible;
  width:calc(100% - 32px);max-width:1440px;height:var(--a1-floating-height,76px);min-width:0;
  padding:14px clamp(24px,4vw,60px);display:flex;align-items:center;justify-content:space-between;gap:24px;
  background:transparent;border:0;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;
  transition:max-width var(--a1-motion-slow) var(--a1-ease-standard),padding var(--a1-motion-slow) var(--a1-ease-standard);
}
.a1-floating-header[data-compact=true]{height:56px;max-width:1000px;padding:6px 24px;margin-top:8px;align-self:start}
.a1-floating-content{min-width:0;min-height:0;overflow-y:auto;overflow-x:clip;overflow-anchor:none;isolation:isolate}
.a1-floating-header :where(a,button,summary){min-height:var(--a1-target-touch)}
.a1-floating-header :where(.a1-language-options,[role=menu]){z-index:110}

.a1-marketing-section{position:relative;isolation:isolate;box-sizing:border-box;max-width:1440px;margin-inline:auto;padding:clamp(48px,7vw,100px) clamp(20px,7vw,104px)}
.a1-marketing-section::before{content:'';position:absolute;inset:-48px 0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 68% 40%,#a85e7012,transparent 65%)}

/* Copy em primeiro plano; assinatura, toroide e fluxo compõem o fundo. */
.a1-flow-hero[data-a1-hero=organize]{
  --scene-mode:organize;--flow-center-x:50%;--flow-center-y:50%;--scene-center-x:50%;--scene-center-y:50%;--scene-ring-opacity:.84;--scene-flow-opacity:.68;--flow-height:360px;--flow-logo-width:400px;--flow-logo-height:184px;
  box-sizing:border-box;position:relative;isolation:isolate;overflow:hidden;
  min-height:680px;height:calc(100svh - var(--a1-floating-height,76px));max-height:980px;
  padding:64px 24px 124px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  background:radial-gradient(ellipse at 50% 50%,#a85e7010,transparent 60%);
}
.a1-flow-hero>.a1-hero-canvas,.a1-flow-hero>canvas{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none;mask-image:none}
.a1-flow-hero .a1-hero-copy{position:relative;z-index:2;text-align:center;width:min(700px,72%);flex-shrink:0}
.a1-flow-hero .a1-hero-copy h1{font-family:var(--a1-font-family-body);font-size:clamp(48px,5.1vw,76px);line-height:1.035;letter-spacing:-.058em;font-weight:var(--a1-font-weight-regular);margin:0 0 25px;text-wrap:balance}
.a1-flow-hero .a1-hero-copy p{font-size:17px;line-height:1.5;margin:0;color:var(--a1-expressive-muted)}
.a1-flow-hero .a1-hero-action{box-sizing:border-box;min-height:50px;display:inline-flex;align-items:center;gap:30px;background:var(--a1-expressive-text);color:var(--a1-expressive-page);border:1px solid transparent;border-radius:var(--a1-radius-full);padding:12px 24px;text-decoration:none;font:inherit;font-size:14px;margin-top:26px;transition:background var(--a1-motion-standard) var(--a1-ease-standard),box-shadow var(--a1-motion-standard) var(--a1-ease-standard)}
.a1-flow-hero .a1-hero-action:hover{box-shadow:var(--a1-shadow-soft)}
.a1-flow-hero .a1-hero-action:focus-visible,.a1-floating-header :where(a,button):focus-visible{outline:var(--a1-focus-width) solid var(--a1-expressive-accent);outline-offset:var(--a1-focus-offset)}
.a1-flow-hero .a1-organizing-visual{position:absolute;inset:0;margin:0;z-index:0;pointer-events:none}
.a1-flow-hero .a1-organizing-emblem{position:absolute;left:var(--flow-center-x,50%);top:var(--flow-center-y);transform:translate(-50%,-50%);width:var(--flow-logo-width);height:var(--flow-logo-height);opacity:.09}
.a1-flow-hero .a1-organizing-emblem img{display:block;width:100%;height:100%;object-fit:contain}
.a1-flow-hero .a1-organizing-caption{position:absolute;left:10%;right:10%;bottom:72px;display:flex;justify-content:space-between;gap:30px;color:var(--a1-expressive-muted);font-size:12px;line-height:1.4;letter-spacing:.01em}

@media(min-width:761px) and (max-width:1100px){
  .a1-flow-hero[data-a1-hero=organize]{--flow-height:320px;--flow-logo-width:340px;--flow-logo-height:156px;min-height:720px;padding-bottom:120px}
  .a1-flow-hero .a1-hero-copy{width:82%}
  .a1-flow-hero .a1-hero-copy h1{font-size:clamp(52px,7.2vw,72px)}
}
@media(max-width:760px){
  .a1-floating-layout{--a1-floating-height:68px}
  .a1-floating-header{height:var(--a1-floating-height,68px);padding:10px 22px;gap:14px}
  .a1-floating-header[data-compact=true]{height:56px;max-width:1000px;padding:6px 12px}
  .a1-flow-hero[data-a1-hero=organize]{--flow-center-y:49%;--scene-center-y:49%;--scene-radius-scale:.82;--flow-height:240px;--flow-logo-width:200px;--flow-logo-height:92px;--scene-ring-opacity:.68;--scene-flow-opacity:.52;min-height:600px;max-height:900px;height:calc(100svh - var(--a1-floating-height,68px));padding:32px 20px 116px}
  .a1-flow-hero .a1-hero-copy{width:100%;max-width:500px}
  .a1-flow-hero .a1-hero-copy h1{font-size:clamp(40px,10.7vw,61px);letter-spacing:-.053em;margin-bottom:20px}
  .a1-flow-hero .a1-hero-copy p{font-size:14px}
  .a1-flow-hero .a1-hero-action{min-height:48px;font-size:13px;margin-top:24px;padding:10px 20px;gap:26px}
  .a1-flow-hero .a1-organizing-caption{left:20px;right:20px;gap:20px;font-size:10px;top:auto;bottom:72px}
}
@media(max-width:380px){.a1-flow-hero[data-a1-hero=organize]{padding-inline:16px;padding-bottom:106px}.a1-flow-hero .a1-hero-copy h1{font-size:39px}.a1-flow-hero .a1-hero-copy p{font-size:13px}}
@media(max-height:700px){.a1-flow-hero[data-a1-hero=organize]{--flow-height:220px}.a1-flow-hero .a1-organizing-caption{top:auto;bottom:64px}}

@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.a1-marked{background:var(--a1-expressive-marked-solid)}}
@media(prefers-reduced-transparency:reduce){.a1-marked{background:var(--a1-expressive-marked-solid);-webkit-backdrop-filter:none;backdrop-filter:none}.a1-marked[data-a1-surface=solid]{background:var(--a1-expressive-solid)}}
@media(prefers-contrast:more){.a1-marked{background:var(--a1-expressive-solid);border-color:var(--a1-expressive-text)}.a1-flow-hero .a1-hero-copy p,.a1-flow-hero .a1-organizing-caption{color:var(--a1-expressive-text)}}
@media(prefers-reduced-motion:reduce){.a1-floating-header,.a1-marked,.a1-flow-hero .a1-hero-action{transition:none;animation:none}}
:where([data-motion=off],[data-motion=reduced]) :where(.a1-floating-header,.a1-marked,.a1-hero-action),:where(.a1-floating-header,.a1-marked)[data-motion=off]{transition:none;animation:none}
@media(forced-colors:active){.a1-flow-hero>canvas{display:none}.a1-marked{background:Canvas;color:CanvasText;border:1px solid CanvasText;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}.a1-flow-hero .a1-hero-action{background:ButtonFace;color:ButtonText;border-color:ButtonText}.a1-flow-hero .a1-hero-copy p,.a1-flow-hero .a1-organizing-caption{color:CanvasText}}

.a1-flow-hero .a1-hero-copy h1{text-shadow:0 2px 28px var(--a1-expressive-page)}
