/* Revisão editorial BESKEL — layout mais limpo e formulário simplificado */
:root{
  --bg:#07090c;
  --bg-soft:#0d1116;
  --card:#11161c;
  --text:#f7f7f8;
  --muted:#aeb5bf;
  --orange:#f47a20;
  --line:#252c34;
  --max:1180px;
  --radius:16px;
}

html{background:var(--bg)}
body{background:var(--bg)}
body::before{display:none!important}

.site-header{background:rgba(7,9,12,.96)}
.container{width:min(var(--max),calc(100% - 40px))}

/* Logo BESKEL — recorte circular sem halo, moldura ou fundo branco. */
.brand{isolation:isolate}
.brand img{
  width:44px;
  height:44px;
  display:block;
  object-fit:cover;
  object-position:center;
  border:0!important;
  border-radius:50%;
  background:transparent!important;
  box-shadow:none!important;
  clip-path:circle(46.5% at 50% 50%);
  transform:scale(1.10);
  transform-origin:center;
}

.btn{background:var(--orange);color:#090b0e;border-radius:10px;box-shadow:none}
.btn:hover{background:#ff8a32}
.btn-ghost{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.28);box-shadow:none}

.hero{
  padding:108px 0 48px;
  background:
    radial-gradient(circle at 78% 34%,rgba(244,122,32,.12),transparent 32%),
    linear-gradient(180deg,#07090c 0%,#0b0f14 100%);
}
.hero-grid{grid-template-columns:minmax(0,.94fr) minmax(0,1.06fr);gap:44px}
.hero-copy-panel{padding:34px 0;max-width:600px}
.hero h1{font-size:clamp(3rem,4.7vw,5.1rem);max-width:600px}
.hero-copy{font-size:1.05rem;line-height:1.75}
.hero-visual{aspect-ratio:16/11;min-height:0;border-radius:20px;box-shadow:0 24px 60px rgba(0,0,0,.38)}

.metrics{padding:0 0 34px;background:#0b0f14}
.metrics-grid{border-radius:16px;background:#10151b}
.metrics-grid div{padding:22px 24px}

.section,.section-dark,.section-accent,.cta-band,.atlas,.atlas-page{background:#0c0f13}
.section-dark{background:#07090c}
.section-accent,.cta-band,.atlas,.atlas-page{background:radial-gradient(circle at 82% 20%,rgba(244,122,32,.1),transparent 34%),#0e1217}
.section{padding:86px 0}
.section h2{font-size:clamp(2.1rem,3.5vw,3.5rem);max-width:900px}
.section-heading{margin-bottom:34px}
.split{gap:60px}

.card{min-height:220px;padding:26px;border-radius:16px}
.card .icon{margin-bottom:18px}
.case-grid{gap:18px}
.case-card{border-radius:16px}
.case-card img{height:220px}
.case-card-body{padding:22px}
.case-facts{font-size:.8rem}
.process-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.process-grid li{padding:20px;border-radius:14px}

/* Fallback para navegadores móveis que calculam incorretamente altura percentual em cards com aspect-ratio. */
.portfolio-products .portfolio-card{position:relative;min-height:220px;background:#11161c}
.portfolio-products .portfolio-sprite{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;min-height:100%;display:block}
.portfolio-products .portfolio-card figcaption{z-index:2}

.page-hero{padding:132px 0 72px;background:radial-gradient(circle at 80% 20%,rgba(244,122,32,.12),transparent 34%),linear-gradient(180deg,#080a0d,#0c1015)}
.page-hero .narrow{max-width:900px;margin-inline:auto}
.page-hero h1{font-size:clamp(2.8rem,5vw,4.8rem)}

.quote-layout{grid-template-columns:minmax(0,.9fr) minmax(420px,1.1fr);gap:52px;align-items:center}
.quote-form{gap:16px;padding:26px;border-radius:18px;background:#101419}
.quote-form label{gap:7px}
.quote-form input,.quote-form select,.quote-form textarea{padding:13px 14px;border-radius:9px;background:#090c10}
.quote-form textarea{resize:vertical;min-height:130px}
.form-note,.form-help{font-size:.78rem;color:var(--muted);margin:0}

.site-footer{background:#050607;padding:48px 0 22px}
.whatsapp-float{background:var(--orange);color:#090b0e}

@media(max-width:1040px){
  .hero-grid{grid-template-columns:1fr;gap:28px}
  .hero-copy-panel{max-width:760px;padding-bottom:8px}
  .hero-visual{aspect-ratio:16/9}
  .quote-layout{grid-template-columns:1fr;gap:36px}
  .quote-form{max-width:720px}
  .process-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:720px){
  .container{width:min(100% - 28px,var(--max))}
  .hero{padding-top:94px}
  .hero h1{font-size:clamp(2.45rem,11vw,3.6rem)}
  .hero-actions{flex-direction:column}
  .hero-actions .btn{width:100%}
  .hero-visual{aspect-ratio:4/3}
  .section{padding:66px 0}
  .split{gap:32px}
  .metrics-grid{grid-template-columns:1fr}
  .metrics-grid div{border-right:0;border-bottom:1px solid var(--line)}
  .metrics-grid div:last-child{border-bottom:0}
  .four-cols,.process-grid,.case-grid,.line-grid,.portfolio-grid{grid-template-columns:1fr}
  .portfolio-products .portfolio-card{width:100%;aspect-ratio:4/3;min-height:260px}
  .quote-form{grid-template-columns:1fr;padding:22px}
  .quote-form .full{grid-column:auto}
  .page-hero{padding:112px 0 58px}
  .page-hero h1{font-size:clamp(2.35rem,11vw,3.5rem)}
}

/* Soluções orientadas pela necessidade do cliente */
.solutions-intro{max-width:790px}
.solution-stack{display:grid;gap:28px}
.solution-feature{
  display:grid;
  grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);
  min-height:400px;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:22px;
  background:linear-gradient(145deg,#12171d,#0b0f14);
}
.solution-feature:nth-child(even) .solution-media{order:2}
.solution-media{position:relative;min-height:360px;overflow:hidden;background:#0a0d11}
.solution-media::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 55%,rgba(8,11,15,.34));pointer-events:none}
.solution-feature:nth-child(even) .solution-media::after{background:linear-gradient(270deg,transparent 55%,rgba(8,11,15,.34))}
.solution-media img{width:100%;height:100%;object-fit:cover;transition:transform .7s ease}
.solution-feature:hover .solution-media img{transform:scale(1.035)}
.solution-content{display:flex;flex-direction:column;justify-content:center;padding:clamp(30px,4vw,58px)}
.solution-kicker{margin:0 0 10px;color:var(--orange);font-size:.76rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase}
.solution-content h3{margin:0 0 16px;font-size:clamp(2rem,3.4vw,3.25rem);line-height:1.05;letter-spacing:-.035em}
.solution-content>p{margin:0 0 18px;color:#c1c7d0;font-size:1rem;line-height:1.75}
.solution-audience{margin:0 0 20px;padding:15px 17px;border-left:3px solid var(--orange);background:rgba(255,255,255,.025);color:#d8dce2;font-size:.9rem}
.solution-audience b{color:#fff}
.solution-meta{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 26px;padding:0;list-style:none}
.solution-meta li{padding:7px 10px;border:1px solid rgba(255,255,255,.12);border-radius:999px;color:#bdc4cd;font-size:.76rem}
.solution-content .btn{align-self:flex-start}

.compact-process{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border:1px solid var(--line);border-radius:20px;overflow:hidden;background:#10151b}
.compact-process article{position:relative;padding:32px 30px;min-height:210px;border-right:1px solid var(--line)}
.compact-process article:last-child{border-right:0}
.compact-process article:not(:last-child)::after{content:"→";position:absolute;top:30px;right:-13px;z-index:2;width:26px;height:26px;display:grid;place-items:center;border-radius:50%;background:var(--orange);color:#080a0d;font-weight:900}
.compact-process span{display:block;margin-bottom:24px;color:var(--orange);font-size:.78rem;font-weight:800;letter-spacing:.14em}
.compact-process h3{margin:0 0 10px;font-size:1.25rem}
.compact-process p{margin:0;font-size:.9rem}

.audience-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;overflow:hidden;border:1px solid var(--line);border-radius:18px;background:var(--line)}
.audience-item{padding:26px;background:#0f141a}
.audience-item strong{display:block;margin-bottom:8px;color:#fff;font-size:1rem}
.audience-item p{margin:0;font-size:.85rem;line-height:1.65}
.audience-icon{display:grid;place-items:center;width:40px;height:40px;margin-bottom:20px;border-radius:12px;background:rgba(244,122,32,.12);color:var(--orange);font-weight:800}

@media(max-width:900px){
  .solution-feature{grid-template-columns:1fr;min-height:0}
  .solution-feature:nth-child(even) .solution-media{order:0}
  .solution-media{min-height:320px;aspect-ratio:16/9}
  .solution-media::after,.solution-feature:nth-child(even) .solution-media::after{background:linear-gradient(0deg,rgba(8,11,15,.28),transparent 45%)}
  .compact-process{grid-template-columns:1fr}
  .compact-process article{min-height:0;border-right:0;border-bottom:1px solid var(--line)}
  .compact-process article:last-child{border-bottom:0}
  .compact-process article:not(:last-child)::after{content:"↓";top:auto;right:30px;bottom:-13px}
  .audience-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:620px){
  .solution-stack{gap:18px}
  .solution-feature{border-radius:17px}
  .solution-media{min-height:250px;aspect-ratio:4/3}
  .solution-content{padding:25px 22px 28px}
  .solution-content h3{font-size:2rem}
  .solution-content>p{font-size:.96rem;line-height:1.65}
  .solution-audience{font-size:.84rem}
  .solution-meta{gap:7px;margin-bottom:22px}
  .solution-meta li{font-size:.72rem}
  .solution-content .btn{width:100%;min-height:48px}
  .compact-process article{padding:26px 23px}
  .audience-grid{grid-template-columns:1fr}
  .audience-item{padding:22px}
  .whatsapp-float{left:14px;right:14px;bottom:12px;width:auto;text-align:center;border-radius:12px;padding:14px 18px;z-index:70}
  body{padding-bottom:72px}
}
