html{ -webkit-text-size-adjust:100%; }
  [hidden]{ display:none !important; }

  :root{
    color-scheme: dark;

    --ink:        #06051A;
    --ink-2:      #0B0927;
    --ink-3:      #120D38;
    --line:       #2A2255;
    --line-soft:  #1C1743;

    --violet:     #4A2FA8;
    --blue:       #3460D2;
    --blue-lift:  #5B86F0;
    --magenta:    #FF00B7;
    --magenta-dim:#B60084;

    --bone:       #F3EFF9;
    --muted:      #A49CC2;
    --muted-dim:  #7C749C;

    --rail: 1140px;
    --display: "Libre Bodoni", "Times New Roman", serif;
    --ui: "Archivo", "Helvetica Neue", Arial, sans-serif;
  }

  *,*::before,*::after{ box-sizing:border-box; }

  body{
    margin:0;
    background: var(--ink);
    color: var(--bone);
    font-family: var(--ui);
    font-size: 16px;
    line-height: 1.65;
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
  }

  img{ max-width:100%; display:block; }
  a{ color: inherit; }

  ::selection{ background: var(--magenta); color:#fff; }

  :focus-visible{
    outline: 2px solid var(--magenta);
    outline-offset: 3px;
    border-radius: 2px;
  }

  /* ---------- primitives ---------- */

  .rail{
    width:100%;
    max-width: var(--rail);
    margin-inline: auto;
    padding-inline: 20px;
  }

  section{ position: relative; }

  .band{ padding-block: clamp(64px, 9vw, 120px); }

  .eyebrow{
    font-family: var(--ui);
    font-size: 11.5px;
    font-weight: 600;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--muted);
    margin:0 0 20px;
  }
  .eyebrow::before{
    content:"";
    display:inline-block;
    width:26px; height:1px;
    background: var(--magenta);
    vertical-align: middle;
    margin: -2px 12px 0 0;
  }

  h1,h2,h3{
    font-family: var(--display);
    font-weight: 500;
    text-wrap: balance;
    margin:0;
  }

  h2{
    font-size: clamp(30px, 4.6vw, 52px);
    line-height: 1.08;
    letter-spacing: -.01em;
  }

  h3{
    font-family: var(--ui);
    font-size: 17px;
    font-weight: 600;
    letter-spacing: -.005em;
    line-height:1.35;
  }

  p{ margin:0 0 1.1em; max-width: 62ch; }
  p:last-child{ margin-bottom:0; }

  .lead{
    font-size: clamp(17px, 1.6vw, 20px);
    line-height:1.6;
    color: #DCD6EC;
  }

  .dim{ color: var(--muted); }

  em.hl{
    font-style: normal;
    color: var(--magenta);
  }

  /* ---------- buttons ---------- */

  .btn{
    -webkit-appearance:none; appearance:none;
    display:inline-flex; align-items:center; justify-content:center; gap:10px;
    font-family: var(--ui);
    font-size: 15px;
    font-weight: 600;
    letter-spacing: .01em;
    padding: 17px 30px;
    border-radius: 999px;
    border: 0;
    cursor: pointer;
    text-decoration: none;
    color:#fff;
    background: linear-gradient(97deg, var(--blue) 0%, var(--violet) 45%, var(--magenta) 100%);
    background-size: 160% 100%;
    background-position: 0% 50%;
    box-shadow: 0 10px 34px -12px rgba(255,0,183,.55), inset 0 1px 0 rgba(255,255,255,.22);
    transition: background-position .5s ease, transform .18s ease, box-shadow .3s ease;
  }
  .btn:hover{
    background-position: 100% 50%;
    transform: translateY(-1px);
    box-shadow: 0 16px 40px -12px rgba(255,0,183,.7), inset 0 1px 0 rgba(255,255,255,.28);
  }
  .btn:active{ transform: translateY(0); }

  .btn-ghost{
    background: transparent;
    box-shadow: none;
    border: 1px solid var(--line);
    color: var(--bone);
    padding: 13px 22px;
    font-size: 14px;
  }
  .btn-ghost:hover{
    background: rgba(255,255,255,.04);
    border-color: var(--magenta);
    transform:none;
    box-shadow:none;
  }

  /* ---------- header ---------- */

  .topbar{
    position: sticky;
    top: env(safe-area-inset-top, 0px);
    z-index: 50;
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    background: rgba(6,5,26,.78);
    border-bottom: 1px solid var(--line-soft);
  }
  .topbar-in{
    display:flex; align-items:center; gap:20px;
    min-height: 78px;
  }
  .topbar img{ height: 32px; width:auto; flex:none; }
  .topbar .spacer{ flex:1; }
  .topbar-tag{
    margin:0;
    padding-left: 20px;
    border-left: 1px solid var(--line);
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: .13em;
    text-transform: uppercase;
    line-height: 1.55;
    color: var(--muted);
    white-space: nowrap;
  }
  .topbar-tag b{ color: #CFC8E4; font-weight:600; }
  @media (max-width: 1000px){ .topbar-tag{ display:none; } }
  .topbar .status{
    font-size: 11.5px; font-weight:600;
    letter-spacing:.14em; text-transform:uppercase;
    color: var(--muted);
    display:flex; align-items:center; gap:8px;
  }
  .dot{
    width:7px;height:7px;border-radius:50%;
    background: var(--magenta);
    box-shadow: 0 0 0 4px rgba(255,0,183,.18);
    flex:none;
  }
  @media (max-width: 1080px){
    .topbar .status{ display:none; }
  }

  /* ---------- hero ---------- */

  .hero{
    background:
      linear-gradient(to bottom, rgba(6,5,26,.35) 0%, rgba(6,5,26,.55) 45%, var(--ink) 100%),
      url("/assets/fundo-hero.jpg") center/cover no-repeat;
    border-bottom: 1px solid var(--line-soft);
    overflow: hidden;
  }
  .hero-in{
    display:grid;
    grid-template-columns: minmax(0,1fr) minmax(0,.76fr);
    gap: clamp(10px, 2.2vw, 30px);
    align-items: end;
    padding-top: clamp(30px, 3.6vw, 54px);
  }
  .hero-copy{ padding-bottom: clamp(56px, 7vw, 96px); }
  .hero-copy .eyebrow{ display:none; }

  .hero-mark{
    height: clamp(58px, 9vw, 104px);
    width: auto;
    margin-bottom: clamp(26px, 3.4vw, 40px);
    filter: drop-shadow(0 8px 30px rgba(255,0,183,.25));
  }

  h1{
    font-size: clamp(34px, 5.4vw, 62px);
    line-height: 1.04;
    letter-spacing: -.015em;
    margin-bottom: 22px;
  }
  h1 i{
    font-style: italic;
    font-weight: 400;
    color: var(--magenta);
  }

  .hero-meta{
    display:flex; flex-wrap:wrap; gap: 10px 22px;
    margin: 28px 0 30px;
    font-size: 12px; font-weight:600;
    letter-spacing:.14em; text-transform:uppercase;
    color: var(--muted);
  }
  .hero-meta span{ display:flex; align-items:center; gap:8px; }
  .hero-meta span::before{
    content:""; width:5px;height:5px;border-radius:50%;
    background: var(--blue-lift);
  }

  .hero-ctas{ display:flex; flex-wrap:wrap; gap:14px; align-items:center; }

  .hero-photo{
    position: relative;
    align-self:end;
    margin-bottom: -1px;
  }
  .hero-photo img{
    width: auto;
    height: clamp(460px, 84vh, 860px);
    max-width: 100%;
    object-fit: contain;
    object-position: bottom left;
    margin-left: clamp(0px, 3vw, 44px);
    margin-right: auto;
    filter: drop-shadow(-26px 20px 64px rgba(0,0,0,.6));
  }
  .hero-photo::after{
    content:"";
    position:absolute;
    left: 2%; bottom: 8%;
    width: 84%; aspect-ratio: 1;
    background: radial-gradient(circle, rgba(255,0,183,.26) 0%, rgba(52,96,210,.14) 44%, transparent 68%);
    filter: blur(24px);
    z-index: -1;
    pointer-events:none;
  }

  @media (max-width: 900px){
    .hero-in{ grid-template-columns:1fr; gap:0; }
    .hero-copy{ padding-bottom: 32px; }
    .hero-copy .eyebrow{ display:block; }
    .hero-photo{ margin-inline:auto; }
    .hero-photo img{
      width: min(74%, 300px);
      height: auto;
      margin-inline: auto;
    }
  }

  /* ---------- problema ---------- */

  .split{
    display:grid;
    grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr);
    gap: clamp(28px, 5vw, 76px);
    align-items:start;
  }
  @media (max-width: 860px){ .split{ grid-template-columns:1fr; } }

  .snag-list{
    list-style:none;
    margin: 0;
    padding: 0;
    display:grid;
    gap: 0;
    border-top: 1px solid var(--line-soft);
  }
  .snag-list li{
    border-bottom: 1px solid var(--line-soft);
    padding: 17px 0;
    display: grid;
    grid-template-columns: 76px minmax(0,1fr);
    gap: 18px;
    font-size: 16.5px;
    color: #D6D0E8;
  }
  .snag-list .code{
    font-size: 10.5px; font-weight:700;
    letter-spacing:.1em;
    line-height: 1.9;
    color: var(--magenta);
  }
  @media (max-width: 560px){
    .snag-list li{ grid-template-columns:1fr; gap:4px; }
    .snag-list .code{ line-height:1.4; }
  }

  /* ---------- cadeiras ---------- */

  .seats-band{
    background:
      radial-gradient(120% 140% at 50% 0%, rgba(74,47,168,.34) 0%, transparent 62%),
      var(--ink-2);
    border-block: 1px solid var(--line-soft);
  }
  .seats-center{ text-align:center; }
  .seats-center h2{ margin-inline:auto; max-width: 20ch; }
  .seats-center p{ margin-inline:auto; text-align:center; }

  .seats{
    display:flex;
    justify-content:center;
    align-items:flex-end;
    gap: clamp(8px, 1.6vw, 18px);
    margin: 44px 0 18px;
    flex-wrap:wrap;
  }
  .seat{
    width: clamp(30px, 4.4vw, 46px);
    height:auto;
    color: var(--line);
    transition: color .25s ease, transform .25s ease;
  }
  .seat.open{
    color: var(--magenta);
    filter: drop-shadow(0 4px 14px rgba(255,0,183,.5));
  }
  .seats-caption{
    font-size: 12px; font-weight:600;
    letter-spacing:.16em; text-transform:uppercase;
    color: var(--muted);
    text-align:center;
  }

  /* ---------- frentes ---------- */

  .frentes{
    display:grid;
    gap: 1px;
    background: var(--line-soft);
    border: 1px solid var(--line-soft);
    border-radius: 4px;
    overflow:hidden;
    margin-top: 48px;
  }
  .frente{
    background: var(--ink);
    padding: clamp(24px, 3vw, 36px);
    display:grid;
    grid-template-columns: 152px minmax(0,1fr);
    gap: clamp(16px, 3vw, 40px);
    align-items:start;
  }
  .frente .when{
    font-size: 11.5px; font-weight:700;
    letter-spacing:.16em; text-transform:uppercase;
    color: var(--blue-lift);
    padding-top: 3px;
  }
  .frente h3{ margin-bottom: 8px; }
  .frente p{ color: var(--muted); font-size: 15.5px; }
  @media (max-width: 720px){
    .frente{ grid-template-columns:1fr; gap:10px; }
  }

  /* ---------- inclusos ---------- */

  .incl-band{
    background: var(--ink-2);
    border-block: 1px solid var(--line-soft);
  }
  .incl-head{
    display:flex; justify-content:space-between; align-items:flex-end;
    gap:24px; flex-wrap:wrap;
    margin-bottom: 48px;
  }
  .incl-count{
    font-family: var(--display);
    font-size: clamp(52px, 8vw, 92px);
    line-height:.85;
    color: transparent;
    -webkit-text-stroke: 1px var(--line);
    letter-spacing: -.02em;
  }

  .incl{
    display:grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 1px;
    background: var(--line-soft);
    border: 1px solid var(--line-soft);
  }
  .item{
    background: var(--ink-2);
    padding: clamp(22px, 2.4vw, 30px);
    display:flex; flex-direction:column; gap:10px;
    transition: background .25s ease;
  }
  .item:hover{ background: var(--ink-3); }
  .item .tag{
    font-size: 10.5px; font-weight:700;
    letter-spacing:.16em; text-transform:uppercase;
    color: var(--magenta);
  }
  .item p{
    margin:0;
    font-size: 15px;
    color: var(--muted);
    line-height:1.55;
  }
  .item ul{
    margin: 2px 0 0; padding:0; list-style:none;
    display:grid; gap:6px;
    font-size: 14.5px; color: var(--muted);
  }
  .item ul li{ padding-left: 16px; position:relative; }
  .item ul li::before{
    content:""; position:absolute; left:0; top:9px;
    width:6px;height:1px; background: var(--magenta-dim);
  }
  @media (max-width: 900px){ .incl{ grid-template-columns: repeat(2, minmax(0,1fr)); } }
  @media (max-width: 600px){ .incl{ grid-template-columns:1fr; } }

  /* ---------- kit ---------- */

  .kit{
    background:
      linear-gradient(to right, rgba(6,5,26,.94) 0%, rgba(6,5,26,.72) 46%, rgba(6,5,26,.5) 100%),
      url("/assets/fundo-vidro.jpg") center/cover no-repeat;
    border-bottom: 1px solid var(--line-soft);
  }
  .kit-in{
    display:grid;
    grid-template-columns: minmax(0,1fr) minmax(0,1fr);
    gap: clamp(28px, 5vw, 70px);
    align-items:center;
  }
  .kit-list{
    list-style:none; margin:24px 0 0; padding:0;
    display:grid; gap:0;
  }
  .kit-list li{
    display:grid;
    grid-template-columns: 26px minmax(0,1fr);
    gap: 14px;
    align-items:baseline;
    padding: 15px 0;
    border-bottom: 1px solid rgba(255,255,255,.1);
    font-size: 16px;
  }
  .kit-list li:first-child{ border-top: 1px solid rgba(255,255,255,.1); }
  .kit-list .n{
    font-family: var(--ui);
    font-size: 11px; font-weight:700;
    letter-spacing:.06em;
    color: var(--magenta);
    font-variant-numeric: tabular-nums;
  }
  .kit-list b{ font-weight:600; }
  .kit-list i{ font-style: italic; color: var(--muted); }
  @media (max-width: 860px){ .kit-in{ grid-template-columns:1fr; } }

  /* ---------- bio ---------- */

  .bio-in{
    display:grid;
    grid-template-columns: minmax(0,1fr) minmax(0,1.02fr);
    gap: clamp(28px, 5vw, 64px);
    align-items:center;
  }
  .bio-photo{
    border: 1px solid var(--line);
    border-radius: 3px;
    overflow:hidden;
    position:relative;
  }
  .bio-photo img{ width:100%; height:auto; }
  .bio-quote{
    font-family: var(--display);
    font-size: clamp(20px, 2.3vw, 27px);
    line-height:1.32;
    font-style: italic;
    color: var(--bone);
    margin: 0 0 26px;
    max-width: 30ch;
  }
  .credentials{
    list-style:none; margin: 26px 0 0; padding:0;
    display:grid; gap:12px;
    font-size: 15.5px; color: var(--muted);
  }
  .credentials li{ padding-left:20px; position:relative; }
  .credentials li::before{
    content:""; position:absolute; left:0; top:11px;
    width:9px;height:1px; background: var(--magenta);
  }
  .bio-note{
    margin-top: 22px;
    font-size: 13px;
    color: var(--muted-dim);
    font-style: italic;
  }
  @media (max-width: 860px){ .bio-in{ grid-template-columns:1fr; } }

  /* ---------- fit ---------- */

  .fit-band{ background: var(--ink-2); border-block:1px solid var(--line-soft); }
  .fit{
    display:grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 1px;
    background: var(--line-soft);
    border:1px solid var(--line-soft);
    margin-top: 44px;
  }
  .fit-col{ background: var(--ink-2); padding: clamp(24px,3vw,34px); }
  .fit-col h3{
    font-size: 13px; letter-spacing:.14em; text-transform:uppercase;
    margin-bottom: 20px;
  }
  .fit-col.yes h3{ color: var(--bone); }
  .fit-col.no h3{ color: var(--muted-dim); }
  .fit-col ul{ list-style:none; margin:0; padding:0; display:grid; gap:14px; }
  .fit-col li{
    padding-left: 30px; position:relative;
    font-size: 15.5px; line-height:1.5;
  }
  .fit-col.yes li{ color:#D6D0E8; }
  .fit-col.no li{ color: var(--muted-dim); }
  .fit-col li svg{ position:absolute; left:0; top:4px; width:16px; height:16px; }
  .fit-col.yes li svg{ color: var(--magenta); }
  .fit-col.no li svg{ color: var(--muted-dim); }
  @media (max-width: 700px){ .fit{ grid-template-columns:1fr; } }

  /* ---------- investimento ---------- */

  .invest-in{
    border:1px solid var(--line);
    border-radius: 4px;
    background:
      radial-gradient(130% 120% at 0% 0%, rgba(74,47,168,.4) 0%, transparent 58%),
      radial-gradient(120% 120% at 100% 100%, rgba(255,0,183,.16) 0%, transparent 55%),
      var(--ink-2);
    padding: clamp(30px, 5vw, 62px);
    display:grid;
    grid-template-columns: minmax(0,1.15fr) minmax(0,.85fr);
    gap: clamp(26px, 4vw, 56px);
    align-items:center;
  }
  .sealed{
    text-align:center;
    border-left: 1px solid var(--line);
    padding-left: clamp(20px, 3vw, 44px);
  }
  .sealed .amount{
    font-family: var(--display);
    font-size: clamp(42px, 6.6vw, 74px);
    line-height: 1;
    letter-spacing: -.01em;
    color: var(--bone);
    white-space: nowrap;
    opacity: .82;
    user-select:none;
    -webkit-user-select:none;
  }
  .sealed .amount .mask{
    display:inline-block;
    transform: translateY(.22em);
    letter-spacing: .1em;
    color: var(--magenta);
  }
  .sealed .amount-label{
    font-size: 11px; font-weight:700;
    letter-spacing:.18em; text-transform:uppercase;
    color: var(--muted);
    margin-top: 20px;
  }
  @media (max-width: 800px){
    .invest-in{ grid-template-columns:1fr; }
    .sealed{ border-left:0; border-top:1px solid var(--line); padding-left:0; padding-top: 30px; }
  }

  /* ---------- etapas ---------- */

  .steps{
    counter-reset: step;
    display:grid;
    grid-template-columns: repeat(4, minmax(0,1fr));
    gap: clamp(18px, 2.4vw, 30px);
    margin-top: 48px;
  }
  .step{
    border-top: 1px solid var(--line);
    padding-top: 22px;
    position:relative;
  }
  .step::before{
    counter-increment: step;
    content: "0" counter(step);
    display:block;
    font-family: var(--ui);
    font-size: 11.5px; font-weight:700;
    letter-spacing:.14em;
    color: var(--magenta);
    margin-bottom: 12px;
    font-variant-numeric: tabular-nums;
  }
  .step h3{ margin-bottom: 8px; }
  .step p{ font-size: 15px; color: var(--muted); margin:0; }
  @media (max-width: 860px){ .steps{ grid-template-columns: repeat(2, minmax(0,1fr)); } }
  @media (max-width: 520px){ .steps{ grid-template-columns:1fr; } }

  /* ---------- formulário ---------- */

  .form-band{
    background:
      radial-gradient(100% 90% at 50% 0%, rgba(74,47,168,.3) 0%, transparent 60%),
      var(--ink-2);
    border-block: 1px solid var(--line-soft);
    scroll-margin-top: 80px;
  }
  .form-shell{
    max-width: 760px;
    margin-inline:auto;
  }
  .form-head{ text-align:center; margin-bottom: 44px; }
  .form-head h2{ margin-inline:auto; max-width: 24ch; }
  .form-head p{ margin-inline:auto; text-align:center; }

  form{
    border:1px solid var(--line);
    border-radius:4px;
    background: var(--ink);
    padding: clamp(22px, 3.4vw, 40px);
  }

  fieldset{
    border:0; margin:0; padding:0;
  }
  fieldset + fieldset{
    margin-top: 34px;
    padding-top: 30px;
    border-top: 1px solid var(--line-soft);
  }
  legend{
    font-size: 11px; font-weight:700;
    letter-spacing:.18em; text-transform:uppercase;
    color: var(--muted);
    padding:0; margin-bottom: 22px;
  }

  .grid-2{
    display:grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 18px;
  }
  @media (max-width: 600px){ .grid-2{ grid-template-columns:1fr; } }

  .field{ display:flex; flex-direction:column; gap:7px; }
  .field label{
    font-size: 13px; font-weight:600;
    color: #CFC8E4;
    letter-spacing:.01em;
  }
  .field input, .field select{
    -webkit-appearance:none; appearance:none;
    font-family: var(--ui);
    font-size: 15.5px;
    color: var(--bone);
    background: var(--ink-2);
    border: 1px solid var(--line);
    border-radius: 3px;
    padding: 13px 14px;
    width:100%;
    transition: border-color .2s ease, background .2s ease;
  }
  .field select{
    background-image: linear-gradient(45deg, transparent 50%, var(--muted) 50%), linear-gradient(135deg, var(--muted) 50%, transparent 50%);
    background-position: calc(100% - 19px) 21px, calc(100% - 14px) 21px;
    background-size: 5px 5px, 5px 5px;
    background-repeat: no-repeat;
    padding-right: 38px;
  }
  .field input::placeholder{ color: var(--muted-dim); }
  .field input:hover, .field select:hover{ border-color: var(--violet); }
  .field input:focus, .field select:focus{
    border-color: var(--magenta);
    background: var(--ink-3);
    outline:none;
  }
  .field input[aria-invalid="true"], .field select[aria-invalid="true"]{
    border-color: #FF4D7E;
  }
  .err{
    font-size: 12.5px;
    color: #FF7D9F;
    min-height: 0;
  }
  .err:empty{ display:none; }

  .chips{ display:flex; flex-wrap:wrap; gap:9px; }
  .chip{
    position:relative;
    display:inline-flex;
  }
  .chip input{
    position:absolute; inset:0;
    opacity:0;
    cursor:pointer;
    margin:0;
  }
  .chip span{
    display:inline-block;
    font-size: 14px;
    line-height:1.3;
    padding: 10px 17px;
    border-radius: 999px;
    border:1px solid var(--line);
    color: var(--muted);
    background: var(--ink-2);
    transition: all .18s ease;
    user-select:none;
  }
  .chip:hover span{ border-color: var(--violet); color: var(--bone); }
  .chip input:checked + span{
    border-color: var(--magenta);
    color:#fff;
    background: rgba(255,0,183,.14);
    box-shadow: inset 0 0 0 1px var(--magenta);
  }
  .chip input:focus-visible + span{
    outline: 2px solid var(--magenta);
    outline-offset: 2px;
  }

  .form-actions{
    margin-top: 34px;
    padding-top: 28px;
    border-top: 1px solid var(--line-soft);
    display:flex; flex-direction:column; gap:16px; align-items:center;
  }
  .form-actions .btn{ width:100%; max-width: 420px; }
  .micro{
    font-size: 13px;
    color: var(--muted-dim);
    text-align:center;
    max-width: 52ch;
    margin:0;
  }
  .form-error{
    font-size: 14px;
    color: #FF7D9F;
    text-align:center;
    margin:0;
  }
  .form-error:empty{ display:none; }

  .done{
    text-align:center;
    padding: clamp(30px, 6vw, 60px) clamp(18px,3vw,30px);
    border:1px solid var(--magenta);
    border-radius:4px;
    background:
      radial-gradient(100% 100% at 50% 0%, rgba(255,0,183,.14) 0%, transparent 70%),
      var(--ink);
  }
  .done h3{
    font-family: var(--display);
    font-size: clamp(24px, 3.4vw, 36px);
    font-weight:500;
    line-height:1.15;
    margin-bottom: 16px;
  }
  .done p{ margin-inline:auto; text-align:center; }
  .done .seal{
    width: 44px; height:44px;
    margin: 0 auto 22px;
    color: var(--magenta);
  }

  /* ---------- faq ---------- */

  .faq{
    max-width: 820px;
    margin: 44px auto 0;
    border-top: 1px solid var(--line-soft);
  }
  details{
    border-bottom: 1px solid var(--line-soft);
  }
  summary{
    cursor:pointer;
    list-style:none;
    padding: 21px 44px 21px 0;
    position:relative;
    font-size: 16.5px;
    font-weight: 500;
    color: var(--bone);
    transition: color .2s ease;
  }
  summary::-webkit-details-marker{ display:none; }
  summary:hover{ color: var(--magenta); }
  summary::after{
    content:"";
    position:absolute; right: 8px; top: 50%;
    width: 11px; height:11px;
    margin-top:-6px;
    border-right: 1.5px solid var(--magenta);
    border-bottom: 1.5px solid var(--magenta);
    transform: rotate(45deg);
    transition: transform .25s ease;
  }
  details[open] summary::after{ transform: rotate(-135deg); }
  details .answer{
    padding: 0 8px 24px 0;
    color: var(--muted);
    font-size: 15.5px;
  }
  details .answer p{ max-width: 70ch; }

  /* ---------- fecho ---------- */

  .close-band{
    background:
      radial-gradient(120% 130% at 50% 100%, rgba(255,0,183,.2) 0%, rgba(74,47,168,.18) 40%, transparent 70%),
      var(--ink);
    text-align:center;
    border-top: 1px solid var(--line-soft);
  }
  .close-band h2{ margin: 0 auto 22px; max-width: 22ch; }
  .close-band p{ margin: 0 auto 34px; text-align:center; }
  .close-mark{
    height: clamp(40px, 6vw, 62px);
    width:auto;
    margin: 0 auto 34px;
    opacity:.95;
  }

  footer{
    border-top: 1px solid var(--line-soft);
    padding-block: 40px;
    background: var(--ink);
  }
  .foot-in{
    display:flex; justify-content:space-between; align-items:center;
    gap: 20px; flex-wrap:wrap;
    font-size: 13px;
    color: var(--muted-dim);
  }
  .foot-in a{ text-decoration:none; }
  .foot-in a:hover{ color: var(--magenta); }
  .foot-links{ display:flex; gap:22px; flex-wrap:wrap; }


  /* ---------- pop-up da enquete ---------- */

  dialog.quiz{
    padding: 0;
    border: 1px solid var(--line);
    border-radius: 6px;
    background: var(--ink-2);
    color: var(--bone);
    width: min(580px, calc(100vw - 28px));
    max-width: none;
    box-shadow: 0 46px 110px -34px rgba(0,0,0,.92);
    overflow: hidden;
  }
  dialog.quiz::backdrop{
    background: rgba(4,3,14,.86);
    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
  }
  dialog.quiz[open]{ animation: quiz-in .24s ease both; }
  @keyframes quiz-in{
    from{ opacity:0; transform: translateY(8px) scale(.99); }
    to{ opacity:1; transform:none; }
  }

  .quiz-top{ border-bottom: 1px solid var(--line-soft); }
  .quiz-track{ height: 2px; background: var(--line-soft); }
  .quiz-bar{
    display:block; height:100%; width:20%;
    background: linear-gradient(90deg, var(--blue) 0%, var(--magenta) 100%);
    transition: width .35s ease;
  }
  .quiz-row{
    display:flex; align-items:center; justify-content:space-between; gap:16px;
    padding: 15px clamp(18px,3vw,28px);
  }
  .quiz-step{
    margin:0; font-size:10.5px; font-weight:700;
    letter-spacing:.16em; text-transform:uppercase; color: var(--muted);
    font-variant-numeric: tabular-nums;
  }
  .quiz-x{
    -webkit-appearance:none; appearance:none;
    background:transparent; border:0; cursor:pointer;
    color: var(--muted);
    width:30px; height:30px; border-radius:50%;
    display:grid; place-items:center;
    transition: color .18s ease, background .18s ease;
  }
  .quiz-x svg{ width:15px; height:15px; }
  .quiz-x:hover{ color: var(--magenta); background: rgba(255,255,255,.05); }

  .quiz-body{ padding: clamp(22px,3.4vw,30px) clamp(18px,3vw,28px); }
  .quiz-legend{
    font-family: var(--display);
    font-size: clamp(20px, 2.6vw, 27px);
    font-weight: 500;
    line-height: 1.18;
    letter-spacing: -.005em;
    margin: 0 0 22px;
    color: var(--bone);
    text-wrap: balance;
    max-width: none;
  }
  #quiz-chips{ flex-direction: column; gap: 9px; }
  #quiz-chips .chip{ display:block; }
  #quiz-chips .chip span{
    display:block;
    padding: 14px 18px;
    border-radius: 4px;
    font-size: 15px;
  }
  .quiz-error{
    margin: 18px 0 0;
    font-size: 13.5px;
    color: #FF7D9F;
  }
  .quiz-error:empty{ display:none; }

  .quiz-foot{
    display:flex; align-items:center; justify-content:space-between; gap:14px;
    padding: 0 clamp(18px,3vw,28px) clamp(20px,3vw,26px);
  }
  .quiz-foot .btn{ padding: 14px 26px; font-size: 14px; }
  .quiz-back{
    -webkit-appearance:none; appearance:none;
    background:transparent; border:0; cursor:pointer;
    font-family: var(--ui);
    font-size: 12px; font-weight:700;
    letter-spacing:.14em; text-transform:uppercase;
    color: var(--muted-dim);
    padding: 10px 0;
    transition: color .18s ease;
  }
  .quiz-back:hover{ color: var(--bone); }
  .quiz-back[hidden], .quiz-foot .btn[hidden]{ display:none !important; }

  @media (prefers-reduced-motion: reduce){
    *{ animation-duration:.001ms !important; transition-duration:.001ms !important; }
  }
