/* Oriibrands Flow 2 — estilo Pulso Criativo (2.2.2).
   Agências, marketing, fotógrafos e marcas pessoais criativas: composição de revista,
   letra larga geométrica (Unbounded), secções numeradas, cabeçalho escuro e marcador néon.
   Cor principal: a do negócio. Acento por omissão: lima néon (só sem acento do dono). */
@font-face{font-family:"F2 Unbounded";src:url(../fonts/unbounded.woff2) format("woff2");font-weight:200 900;font-display:swap}
:root{--st-night:color-mix(in srgb,var(--c-deep) 62%,black);--s-7:100px}
html[data-flow-font-heading="system"]{--f-display:"F2 Unbounded",ui-sans-serif,system-ui,sans-serif}
html[data-flow-radius="soft"]{--r-sm:999px;--r-md:22px;--r-lg:32px}
main{counter-reset:f2sec}

/* Tipografia editorial */
.f-h1,.f-h2,.f-h3,.f-wordmark,.f-card__title,.f-foot__h,.f-widget__number{font-family:var(--f-display)}
.f-h1{font-weight:700;letter-spacing:-.045em;line-height:1}
.f-h1:not(.f-h1--discreto):not(.f-h1--impactante){font-size:clamp(2.4rem,6.4vw,5.2rem)}
.f-h1--impactante{font-size:clamp(2.8rem,8vw,6.4rem)}
.f-h2{font-weight:700;letter-spacing:-.04em;font-size:clamp(1.8rem,4vw,3rem);line-height:1.02}
.f-wordmark{font-weight:800;letter-spacing:-.04em}
.f-kicker{display:inline-block;background:var(--c-accent);color:var(--c-accent-ink);border-radius:999px;padding:5px 14px;font-size:.82rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase}

/* Cabeçalho escuro */
.f-head{background:var(--st-night);color:white;border-bottom:0}
.f-head .f-navlink,.f-head .f-iconlink,.f-head .f-themetoggle,.f-head .f-burger,.f-head .f-status,.f-head .f-wordmark{color:white}
.f-head .f-navlink:hover,.f-head .f-navmore[open]>summary{background:rgba(255,255,255,.12)}
.f-mainnav .f-navlink[aria-current="page"]{box-shadow:inset 0 -3px 0 var(--c-accent)}
/* 2.2.2: o cabeçalho escuro mantém a ligação actual legível em todos os estilos de menu. */
.f-head .f-mainnav .f-navlink[aria-current="page"]{color:white}
.flow2-menu-style-pills .f-head .f-mainnav .f-navlink[aria-current="page"]{background:rgba(255,255,255,.16);border-color:var(--c-accent)}
.flow2-menu-style-underline .f-head .f-mainnav .f-navlink[aria-current="page"]{border-bottom-color:var(--c-accent)}
.f-hero .f-kicker,.f-hero--background.has-img .f-kicker{color:var(--c-accent-ink)}
/* 2.2.2: estilos de menu (Pílulas, Sublinhado) sobre o cabeçalho escuro. */
.flow2-menu-style-pills .f-head .f-navlink{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.22)}
.flow2-menu-style-pills .f-head .f-navlink:hover,.flow2-menu-style-pills .f-head .f-navmore[open]>summary{background:rgba(255,255,255,.18);border-color:var(--c-accent);color:white}
.flow2-menu-style-underline .f-head .f-navlink:hover,.flow2-menu-style-underline .f-head .f-navmore[open]>summary{color:white;border-bottom-color:var(--c-accent)}
.f-head .f-navmore__list{color:var(--c-ink)}
.f-head .f-btn--primary{background:var(--c-accent);color:var(--c-accent-ink);border-color:var(--c-accent)}

/* Botões */
.f-btn{border-radius:999px;font-weight:700;border-width:2px;padding-left:22px;padding-right:22px}
.f-btn:not(.f-btn--primary):not(.f-add){background:transparent;border-color:currentColor}
.f-btn--primary:hover{box-shadow:0 0 0 4px color-mix(in srgb,var(--c-accent) 70%,transparent)}

/* Destaque */
.f-hero--background.has-img::before{background:linear-gradient(120deg,rgba(0,0,0,.82),rgba(0,0,0,.35) 60%,color-mix(in srgb,var(--c-primary) 40%,transparent))}
.f-hero--background.has-img .f-btn:not(.f-btn--primary):not(.f-add){color:white}
.f-hero:not(.f-hero--background) .f-hero__pic{position:relative;isolation:isolate}
.f-hero:not(.f-hero--background) .f-hero__pic::before{content:"";position:absolute;z-index:-1;width:70%;aspect-ratio:1;right:-6%;top:-8%;border-radius:42% 58% 63% 37%/45% 41% 59% 55%;background:var(--c-accent)}
.f-hero__pic img{border-radius:var(--r-lg)}

/* Faixa de informações: banda escura */
.f-info__in{background:var(--st-night);color:white;border:0;border-radius:var(--r-lg)}
.f-info__item+.f-info__item{border-left:1px solid rgba(255,255,255,.16)}
.f-info__ico{background:var(--c-accent);color:var(--c-accent-ink)}
.f-info__label,.f-info__more{color:rgba(255,255,255,.72)}
.f-info__exception,.f-info__in a{color:var(--c-accent-on-dark,var(--c-accent))}

/* Secções numeradas e marcador */
.f-sechead{counter-increment:f2sec;align-items:flex-end}
.f-sechead .f-h2::before{content:counter(f2sec,decimal-leading-zero) " /";display:block;margin-bottom:10px;font-size:.36em;letter-spacing:.08em;color:var(--c-muted);font-weight:600}
.f-sechead .f-h2{width:fit-content;background:linear-gradient(transparent 62%,color-mix(in srgb,var(--c-accent) 75%,transparent) 62% 92%,transparent 92%);display:inline;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.f-sec--alt,.f-sec.f-sec--bg-soft{background:color-mix(in srgb,var(--c-primary) 9%,var(--c-bg))}
.f-more{font-weight:800;text-transform:uppercase;letter-spacing:.08em;font-size:13px}
.f-more::after{content:" →"}

/* Cartões: grelha assimétrica de revista */
.f-card{border:0;border-radius:var(--r-md);background:var(--c-surface);box-shadow:none;transition:transform .2s,box-shadow .2s}
.f-card:hover{transform:translateY(-6px) rotate(-.6deg);box-shadow:0 22px 40px color-mix(in srgb,var(--c-ink) 14%,transparent)}
.f-card__pic{border-radius:var(--r-md);margin:8px 8px 0;aspect-ratio:4/5}
.f-card__title{font-weight:600;font-size:1.02rem;letter-spacing:-.02em;line-height:1.2}
.f-card__body{padding:16px 18px 18px}
.f-price{font-family:var(--f-display);font-weight:700;font-size:1rem}
@media (min-width:900px){.f-grid:not(.f-grid--carousel):not(.f-grid--row) > .f-card:nth-child(even){transform:translateY(32px)}.f-grid:not(.f-grid--carousel):not(.f-grid--row){padding-bottom:32px}}
:root[data-flow-surfaces="bordered"] .f-card{border:0}

/* Sobre */
.f-about__pic img{border-radius:var(--r-lg)}
.f-about__txt .f-h2{background:none}
.f-panel,.f-fact,.f-widget__card{border:0;border-radius:var(--r-md);background:var(--c-surface)}

/* Chamada final */
.f-widget__cta{background:var(--c-accent);color:var(--c-accent-ink);border:0;border-radius:var(--r-lg)}
.f-widget__cta .f-h2{color:inherit;background:none}
.f-widget__cta .f-btn--primary{background:var(--st-night);color:white;border-color:var(--st-night)}
.f-widget__faq summary{font-family:var(--f-display);font-weight:600;font-size:1rem;letter-spacing:-.02em}
.f-widget .f-h2{background:none}

/* Rodapé */
.f-foot{background:var(--st-night);color:white}
.f-foot__h{color:var(--c-accent-on-dark,var(--c-accent));font-weight:700;letter-spacing:-.02em}
.f-foot__brand .f-foot__h{font-size:1.9rem;color:white}
.f-foot__base{color:rgba(255,255,255,.62);border-top-color:rgba(255,255,255,.16)}

/* No escuro o marcador fica mais discreto para o título claro continuar legível */
:root[data-theme="dark"] .f-sechead .f-h2{background:linear-gradient(transparent 70%,color-mix(in srgb,var(--c-accent) 42%,transparent) 70% 94%,transparent 94%)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .f-sechead .f-h2{background:linear-gradient(transparent 70%,color-mix(in srgb,var(--c-accent) 42%,transparent) 70% 94%,transparent 94%)}}
@media (max-width:700px){
  .f-sechead .f-h2::before{font-size:.42em}
  .f-card__pic{aspect-ratio:4/3}
}
@media (prefers-reduced-motion:reduce){.f-card:hover{transform:none}}
/* 2.2.4: com gradiente no destaque, o kicker em cápsula mantém a cor própria da cápsula. */
:root[data-flow-gradient-mode="hero"] .f-hero:not(.f-hero--background.has-img) .f-kicker{color:var(--c-accent-ink)}
