/* =====================================================
   abcRede Telecom - Landing Page CRO
   Arquivo principal de estilos
===================================================== */
:root {
	--blue-dark: #061B4F;
	--blue-deep: #041236;
	--blue-main: #0B4FCF;
	--blue-strong: #073A98;
	--blue-cyan: #08C6FF;
	--yellow: #FFC928;
	--yellow-dark: #E0A900;
	--green: #12D679;
	--text: #162033;
	--muted: #5F6B7A;
	--surface: #FFFFFF;
	--surface-2: #F4F8FC;
	--border: #DFE8F3;
	--shadow: 0 18px 48px rgba(5, 34, 92, .10);
	--shadow-strong: 0 28px 90px rgba(3, 18, 54, .28);
	--radius: 28px;
	--container: 1180px;
}

* {
	box-sizing: border-box
}

html {
	scroll-behavior: smooth
}

body {
	margin: 0;
	font-family: Arial, Helvetica, sans-serif;
	background: #fff;
	color: var(--text);
	line-height: 1.5;
	-webkit-font-smoothing: antialiased
}

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

a {
	text-decoration: none;
	color: inherit
}

button,
input,
textarea,
select {
	font: inherit
}

.container {
	width: min(100% - 32px, var(--container));
	margin: 0 auto
}

.skip-link {
	position: absolute;
	left: -999px;
	top: 12px;
	background: #fff;
	color: #000;
	padding: 12px;
	border-radius: 10px;
	z-index: 999
}

.skip-link:focus {
	left: 12px
}

.section {
	padding: 84px 0
}

.section-head h2,
.use-content h2,
.chip-content h2,
.support-copy h2,
.business-card h2,
.final-box h2,
.product-card h2,
.app-grid h2,
.atendimento-box h2 {
	font-size: clamp(30px, 4vw, 48px);
	line-height: 1.06;
	letter-spacing: -.04em;
	margin: 0 0 14px;
	color: var(--blue-dark);
	font-weight: 950
}

.section-head p,
.use-content p,
.chip-content p,
.support-copy p,
.business-card p,
.product-card p,
.app-grid p,
.atendimento-box p {
	font-size: 17px;
	color: var(--muted);
	margin: 0
}

.centered {
	text-align: center;
	max-width: 760px;
	margin: 0 auto
}

.eyebrow,
.section-kicker {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	border-radius: 999px;
	padding: 9px 14px;
	font-size: 12px;
	font-weight: 950;
	text-transform: uppercase;
	text-align: center;
	letter-spacing: .06em;
	background: rgba(255, 255, 255, .14);
	color: #fff;
	border: 1px solid rgba(255, 255, 255, .18);
	margin: 0 0 16px
}

.eyebrow.dark,
.section-kicker {
	background: rgba(11, 79, 207, .08);
	color: var(--blue-main);
	border-color: rgba(11, 79, 207, .12)
}

.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 14px 20px;
	border-radius: 999px;
	font-weight: 950;
	border: 0;
	cursor: pointer;
	transition: transform .22s ease, box-shadow .22s ease, background .22s ease, color .22s ease;
	white-space: nowrap
}

.btn:hover {
	transform: translateY(-2px)
}

.btn-primary {
	background: linear-gradient(135deg, var(--yellow), #FFE16B);
	color: var(--blue-dark);
	box-shadow: 0 14px 34px rgba(255, 201, 40, .27)
}

.btn-secondary {
	background: rgba(255, 255, 255, .14);
	color: #fff;
	border: 1px solid rgba(255, 255, 255, .24)
}

.btn-outline {
	background: #fff;
	color: var(--blue-main);
	border: 1px solid var(--border)
}

.btn-light {
	background: #fff;
	color: var(--blue-main);
	box-shadow: 0 14px 34px rgba(0, 0, 0, .12)
}

.btn-header {
	padding: 12px 16px;
	background: var(--blue-main);
	color: #fff;
	box-shadow: 0 10px 24px rgba(11, 79, 207, .20)
}

.btn-lg {
	padding: 17px 26px
}

.full {
	width: 100%
}

.site-header {
	position: sticky;
	top: 0;
	z-index: 100;
	background: rgba(255, 255, 255, .94);
	backdrop-filter: blur(14px);
	border-bottom: 1px solid rgba(223, 232, 243, .88)
}

.header-inner {
	min-height: 76px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 18px
}

.brand {
	display: flex;
	align-items: center;
	flex: 0 0 auto
}

.brand img {
	width: 138px;
	height: auto;
	object-fit: contain
}

.footer-brand img {
	width: 130px
}

.main-nav {
	display: flex;
	align-items: center;
	gap: 22px;
	font-size: 14px;
	font-weight: 850;
	color: #22324A
}

.main-nav a {
	transition: color .18s ease
}

.main-nav a:hover {
	color: var(--blue-main)
}

.menu-toggle {
	display: none;
	flex-direction: column;
	gap: 5px;
	background: none;
	border: 0;
	padding: 8px
}

.menu-toggle span {
	display: block;
	width: 25px;
	height: 2px;
	background: var(--blue-dark);
	border-radius: 99px
}

.hero-offer {
	position: relative;
	overflow: hidden;
	color: #fff;
	padding: 74px 0 64px;
	background: var(--blue-deep)
}

.hero-bg {
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, rgba(4, 18, 54, .98) 0%, rgba(6, 27, 79, .92) 40%, rgba(6, 27, 79, .46) 100%), url('../img/hero-familia.webp') center right/cover no-repeat
}

.fiber-lines {
	position: absolute;
	inset: -20% -10%;
	background: radial-gradient(circle at 70% 25%, rgba(8, 198, 255, .23), transparent 22%), linear-gradient(115deg, transparent 0%, transparent 34%, rgba(8, 198, 255, .50) 35%, transparent 36%, transparent 54%, rgba(8, 198, 255, .28) 55%, transparent 56%);
	opacity: .65;
	filter: blur(.3px)
}

.hero-grid {
	position: relative;
	z-index: 1;
	display: grid;
	grid-template-columns: minmax(0, 1fr) 420px;
	gap: 42px;
	align-items: center;
	min-height: 560px
}

.hero-copy h1 {
	font-size: clamp(40px, 6vw, 72px);
	line-height: .98;
	letter-spacing: -.06em;
	margin: 0 0 18px;
	font-weight: 950;
	max-width: 720px
}

.hero-copy h1 strong {
	color: #fff
}

.hero-copy h1 span {
	display: block;
	color: var(--yellow);
	text-shadow: 0 10px 38px rgba(255, 201, 40, .16)
}

.hero-subtitle {
	font-size: 20px;
	max-width: 650px;
	color: rgba(255, 255, 255, .86);
	margin: 0 0 28px
}

.hero-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
	margin-bottom: 22px
}

.proof-strip {
	display: flex;
	flex-wrap: wrap;
	gap: 10px
}

.proof-strip span {
	padding: 10px 14px;
	border-radius: 999px;
	background: rgba(255, 255, 255, .12);
	border: 1px solid rgba(255, 255, 255, .18);
	font-size: 14px;
	font-weight: 850
}

.offer-card {
	position: relative;
	background: rgba(255, 255, 255, .97);
	color: var(--text);
	border-radius: 32px;
	padding: 28px;
	box-shadow: var(--shadow-strong);
	border: 1px solid rgba(255, 255, 255, .8);
	overflow: hidden
}

.offer-card:before {
	content: "";
	position: absolute;
	inset: 0 0 auto 0;
	height: 8px;
	background: linear-gradient(90deg, var(--blue-main), var(--blue-cyan), var(--yellow))
}

.offer-top {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 18px;
	margin-bottom: 20px
}

.offer-badge,
.plan-badge {
	display: inline-flex;
	padding: 8px 12px;
	border-radius: 999px;
	background: rgba(255, 201, 40, .18);
	color: #8A6600;
	font-size: 12px;
	font-weight: 950
}

.plan-badge.muted {
	background: rgba(11, 79, 207, .10);
	color: var(--blue-main)
}

.offer-speed {
	font-size: 100px;
	font-weight: 950;
	letter-spacing: -.05em;
	line-height: .9;
	color: var(--blue-main)
}

.offer-speed small {
	display: block;
	font-size: 18px;
	letter-spacing: 0
}

.offer-price {
	font-size: 55px;
	font-weight: 950;
	color: var(--blue-dark);
	letter-spacing: -.02em;
	margin-bottom: 18px
}

.offer-price small,
.offer-price em {
	font-size: 15px;
	font-style: normal;
	color: var(--muted);
	font-weight: 850
}

.check-list {
	list-style: none;
	display: grid;
	gap: 10px;
	margin: 16px 0 22px;
	padding: 0
}

.check-list li {
	position: relative;
	padding-left: 28px;
	color: #32435A;
	font-weight: 750;
	font-size: 15px
}

.check-list li:before {
	content: "✓";
	position: absolute;
	left: 0;
	top: -1px;
	width: 20px;
	height: 20px;
	border-radius: 999px;
	background: rgba(18, 214, 121, .16);
	color: #078B51;
	display: grid;
	place-items: center;
	font-weight: 950;
	font-size: 13px
}

.check-list.compact li {
	font-size: 14px
}

.check-list.large li {
	font-size: 17px;
	color: #22324A
}

.solutions-section {
	position: relative;
	padding: 88px 0;
	background: radial-gradient(circle at top left, rgba(8, 198, 255, .16), transparent 34%), linear-gradient(180deg, #fff 0%, #F4F8FC 100%);
	overflow: hidden
}

.solutions-section::before {
	content: "";
	position: absolute;
	right: -180px;
	top: 60px;
	width: 420px;
	height: 420px;
	border-radius: 50%;
	background: rgba(8, 198, 255, .10);
	filter: blur(8px);
	pointer-events: none
}

.solutions-section::after {
	content: "";
	position: absolute;
	left: -140px;
	bottom: -180px;
	width: 460px;
	height: 460px;
	border-radius: 50%;
	background: rgba(11, 79, 207, .09);
	filter: blur(10px);
	pointer-events: none
}

.solutions-header {
	position: relative;
	z-index: 1;
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: end;
	gap: 28px;
	margin-bottom: 34px
}

.solutions-header h2 {
	max-width: 760px;
	margin: 0 0 12px;
	color: var(--blue-dark);
	font-size: clamp(30px, 4vw, 48px);
	line-height: 1.05;
	font-weight: 950;
	letter-spacing: -.04em
}

.solutions-header p {
	max-width: 720px;
	margin: 0;
	color: var(--muted);
	font-size: 17px;
	line-height: 1.6
}

.solutions-grid {
	position: relative;
	z-index: 1;
	display: grid;
	grid-template-columns: 1.15fr .85fr;
	gap: 20px
}

.solution-card {
	position: relative;
	display: grid;
	grid-template-columns: 58px minmax(0, 1fr);
	gap: 18px;
	min-height: 230px;
	padding: 26px;
	border: 1px solid rgba(11, 79, 207, .10);
	border-radius: 26px;
	background: rgba(255, 255, 255, .92);
	box-shadow: 0 18px 48px rgba(6, 27, 79, .08);
	overflow: hidden;
	transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease
}

.solution-card:hover {
	transform: translateY(-4px);
	border-color: rgba(8, 198, 255, .34);
	box-shadow: 0 26px 60px rgba(6, 27, 79, .13)
}

.solution-card::before {
	content: "";
	position: absolute;
	inset: auto -80px -120px auto;
	width: 230px;
	height: 230px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(8, 198, 255, .16), transparent 65%);
	pointer-events: none
}

.solution-card-featured {
	grid-row: span 2;
	min-height: 480px;
	align-content: end;
	color: #fff;
	background: linear-gradient(145deg, rgba(6, 27, 79, .0), rgba(11, 79, 207, .88)), url('../img/hero-familia.webp') center/cover no-repeat;
	border-color: rgba(255, 255, 255, .14);
	box-shadow: 0 26px 70px rgba(6, 27, 79, .24)
}

.solution-card-featured::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(140deg, rgba(6, 27, 79, .88) 0%, rgba(6, 27, 79, .58) 48%, rgba(8, 198, 255, .16) 100%);
	pointer-events: none
}

.solution-card-featured .solution-icon,
.solution-card-featured .solution-content {
	position: relative;
	z-index: 1
}

.solution-card-service {
	background: linear-gradient(145deg, rgba(255, 201, 40, .15), rgba(255, 255, 255, .96));
	border-color: rgba(255, 201, 40, .34)
}

.solution-icon {
	width: 58px;
	height: 58px;
	display: grid;
	place-items: center;
	border-radius: 18px;
	background: linear-gradient(135deg, var(--blue-main), var(--blue-cyan));
	color: #fff;
	box-shadow: 0 14px 30px rgba(11, 79, 207, .22);
	flex-shrink: 0
}

.solution-icon span {
	font-size: 15px;
	font-weight: 950
}

.solution-label {
	display: inline-flex;
	margin-bottom: 10px;
	padding: 7px 11px;
	border-radius: 999px;
	background: rgba(8, 198, 255, .12);
	color: var(--blue-main);
	font-size: 12px;
	font-weight: 950
}

.solution-card-featured .solution-label {
	background: rgba(255, 201, 40, .18);
	color: var(--yellow)
}

.solution-content h3 {
	margin: 0 0 10px;
	color: var(--blue-dark);
	font-size: 25px;
	line-height: 1.1;
	font-weight: 950;
	letter-spacing: -.025em
}

.solution-card-featured .solution-content h3 {
	color: #fff;
	font-size: clamp(34px, 4vw, 50px)
}

.solution-content p {
	margin: 0 0 18px;
	color: var(--muted);
	font-size: 15px;
	line-height: 1.55
}

.solution-card-featured .solution-content p {
	color: rgba(255, 255, 255, .88);
	max-width: 520px;
	font-size: 17px
}

.solution-link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: var(--blue-main);
	font-size: 14px;
	font-weight: 950
}

.solution-link::after {
	content: "→";
	transition: transform .2s ease
}

.solution-link:hover::after {
	transform: translateX(4px)
}

.solution-card-featured .solution-link {
	padding: 14px 18px;
	border-radius: 999px;
	background: var(--yellow);
	color: var(--blue-dark);
	box-shadow: 0 14px 32px rgba(255, 201, 40, .24)
}

.section-plans {
	background: #fff
}

.plans-grid {
	display: grid;
	grid-template-columns: 1.05fr 1fr 1fr;
	gap: 22px;
	margin-top: 36px;
	align-items: stretch
}

.plan-card {
	background: #fff;
	border: 1px solid var(--border);
	border-radius: var(--radius);
	padding: 28px;
	box-shadow: var(--shadow);
	display: flex;
	flex-direction: column;
	min-height: 100%
}

.plan-card.featured {
	background: linear-gradient(180deg, #0D63FF 0%, #073A9E 100%);
	color: #fff;
	transform: translateY(-10px);
	box-shadow: 0 26px 80px rgba(11, 79, 207, .30)
}

.plan-card h3 {
	font-size: 48px;
	line-height: .95;
	letter-spacing: -.05em;
	margin: 18px 0 8px
}

.plan-card h3 small {
	font-size: 20px
}

.plan-price {
	font-size: 38px;
	font-weight: 950;
	letter-spacing: -.045em;
	color: var(--blue-dark);
	margin: 0 0 10px
}

.plan-price span {
	font-size: 15px;
	color: var(--muted);
	letter-spacing: 0
}

.plan-desc {
	color: var(--muted);
	margin-bottom: auto
}

.plan-card.featured .plan-price,
.plan-card.featured .plan-desc,
.plan-card.featured .check-list li {
	color: #fff
}

.plan-card.featured .check-list li:before {
	background: rgba(255, 255, 255, .18);
	color: #fff
}

.use-section {
	background: linear-gradient(180deg, #F4F8FC, #fff)
}

.use-grid,
.chip-grid,
.support-grid,
.benefits-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 46px;
	align-items: center
}

.use-content p {
	margin-bottom: 24px
}

.use-cards {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 14px
}

.use-cards article {
	background: #fff;
	border: 1px solid var(--border);
	border-radius: 20px;
	padding: 18px;
	box-shadow: 0 12px 32px rgba(5, 34, 92, .08)
}

.use-cards strong {
	display: block;
	font-size: 18px;
	margin-bottom: 6px
}

.use-cards span {
	display: block;
	color: var(--muted);
	font-size: 14px
}

.media-card {
	display: block;
	overflow: hidden;
	border-radius: 30px;
	box-shadow: var(--shadow);
	border: 1px solid rgba(255, 255, 255, .7);
	background: #DBE9F7
}

.media-card img {
	width: 100%;
	height: 100%;
	object-fit: cover
}

.use-image {
	height: 420px
}

.benefits-section {
	background: #fff
}

.benefits-grid {
	grid-template-columns: .82fr 1.18fr
}

.benefit-list {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 18px
}

.benefit-card {
	background: var(--surface-2);
	border: 1px solid var(--border);
	border-radius: 24px;
	padding: 22px
}

.benefit-card span {
	display: inline-flex;
	width: 34px;
	height: 34px;
	border-radius: 999px;
	background: var(--blue-main);
	color: #fff;
	align-items: center;
	justify-content: center;
	font-weight: 950;
	margin-bottom: 16px
}

.benefit-card h3 {
	font-size: 20px;
	line-height: 1.15;
	margin: 0 0 8px
}

.benefit-card p {
	color: var(--muted);
	font-size: 15px;
	margin: 0
}

.visual-band {
	background: var(--blue-dark);
	color: #fff;
	padding: 64px 0
}

.band-grid {
	display: grid;
	grid-template-columns: 1.05fr .95fr;
	gap: 34px;
	align-items: center
}

.band-grid .media-card {
	height: 360px;
	border-color: rgba(255, 255, 255, .10)
}

.band-copy h2 {
	font-size: clamp(28px, 4vw, 44px);
	line-height: 1.08;
	letter-spacing: -.035em;
	margin: 0 0 16px;
	color: #fff
}

.band-copy p {
	color: rgba(255, 255, 255, .80);
	font-size: 18px;
	margin: 0 0 22px
}

.chip-section {
	background: #fff
}

.chip-image {
	height: 430px
}

.mini-plans {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 12px;
	margin: 24px 0
}

.mini-plans article {
	border: 1px solid var(--border);
	border-radius: 20px;
	padding: 16px;
	background: #fff;
	box-shadow: 0 12px 30px rgba(5, 34, 92, .08)
}

.mini-plans article.active {
	background: linear-gradient(135deg, var(--blue-main), var(--blue-cyan));
	color: #fff
}

.mini-plans strong {
	display: block;
	font-size: 28px;
	letter-spacing: -.035em
}

.mini-plans span {
	display: block;
	color: inherit;
	opacity: .78;
	font-size: 13px;
	font-weight: 850
}

.product-card {
	display: grid;
	grid-template-columns: .9fr 1.1fr;
	gap: 32px;
	align-items: center;
	border-radius: 34px;
	padding: 38px;
	color: #fff;
	background: linear-gradient(135deg, #041236, #0B4FCF 60%, #08C6FF);
	box-shadow: var(--shadow-strong);
	overflow: hidden
}

.product-card p {
	color: rgba(255, 255, 255, .85);
	margin-bottom: 22px
}

.product-card h2 {
	color: #fff
}

.product-image {
	height: 320px;
	overflow: hidden;
	border-radius: 26px;
	border: 1px solid rgba(255, 255, 255, .18)
}

.product-image img {
	width: 100%;
	height: 100%;
	object-fit: cover
}

.app-section {
	background: linear-gradient(180deg, #fff, #F4F8FC)
}

.app-grid {
	display: grid;
	grid-template-columns: 420px minmax(0, 1fr);
	gap: 52px;
	align-items: center
}

.app-mockup {
	display: flex;
	justify-content: center
}

.phone-frame {
	width: 240px;
	min-height: 440px;
	background: linear-gradient(180deg, var(--blue-dark), var(--blue-main));
	border-radius: 36px;
	padding: 34px 24px;
	box-shadow: var(--shadow-strong);
	border: 8px solid #fff;
	display: grid;
	align-content: start;
	gap: 20px
}

.phone-frame img {
	width: 150px;
	margin: 10px auto 20px
}

.mock-line {
	display: block;
	height: 18px;
	border-radius: 99px;
	background: rgba(255, 255, 255, .25)
}

.mock-line.short {
	width: 70%
}

.mock-icons {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 10px
}

.mock-icons i {
	display: block;
	height: 54px;
	border-radius: 16px;
	background: rgba(255, 255, 255, .18)
}

.atendimento-section {
	background: var(--blue-dark);
	color: #fff
}

.atendimento-box {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 28px;
	align-items: center;
	border-radius: 34px;
	padding: 40px;
	background: linear-gradient(135deg, rgba(11, 79, 207, .58), rgba(8, 198, 255, .16));
	border: 1px solid rgba(255, 255, 255, .14)
}

.atendimento-box h2 {
	color: #fff
}

.atendimento-box p {
	color: rgba(255, 255, 255, .82)
}

.support-section {
	background: linear-gradient(180deg, #F4F8FC, #fff)
}

.support-grid {
	grid-template-columns: 1fr 420px
}

.support-image {
	height: 500px
}

.business-section {
	background: #fff
}

.business-card {
	background: linear-gradient(135deg, #062D78, #0B4FCF 55%, #08C6FF);
	border-radius: 34px;
	color: #fff;
	padding: 38px;
	display: grid;
	grid-template-columns: .88fr 1.12fr;
	gap: 30px;
	align-items: center;
	box-shadow: var(--shadow-strong);
	overflow: hidden
}

.business-card h2 {
	color: #fff
}

.business-card p {
	color: rgba(255, 255, 255, .84);
	margin-bottom: 22px
}

.business-image {
	height: 320px;
	overflow: hidden;
	border-radius: 26px;
	border: 1px solid rgba(255, 255, 255, .18);
	box-shadow: 0 20px 60px rgba(0, 0, 0, .20)
}

.business-image img {
	width: 100%;
	height: 100%;
	object-fit: cover
}
.faq-section {
  background: linear-gradient(180deg, #ffffff 0%, #f4f8fc 100%);
}

.faq-static-list {
  max-width: 860px;
  margin: 34px auto 0;
  display: grid;
  gap: 14px;
}

.faq-static-item {
  background: #ffffff;
  border: 1px solid var(--border);
  border-radius: 20px;
  padding: 20px 22px;
  box-shadow: 0 10px 28px rgba(5, 34, 92, 0.07);
}

.faq-static-item h3 {
  margin: 0 0 10px;
  color: var(--blue-dark);
  font-size: 17px;
  line-height: 1.3;
  font-weight: 950;
}

.faq-static-item p {
  margin: 0;
  color: var(--muted);
  font-size: 15px;
  line-height: 1.55;
}

@media (max-width: 768px) {
  .faq-static-list {
    margin-top: 26px;
    gap: 12px;
  }

  .faq-static-item {
    padding: 18px 16px;
    border-radius: 18px;
  }

  .faq-static-item h3 {
    font-size: 16px;
  }

  .faq-static-item p {
    font-size: 14px;
  }
}

.final-cta {
	background: #fff
}

.final-box {
	text-align: center;
	border-radius: 36px;
	padding: 54px 32px;
	background: linear-gradient(135deg, #041236, #0B4FCF 60%, #08C6FF);
	color: #fff;
	box-shadow: var(--shadow-strong)
}

.final-box h2 {
	color: #fff
}

.final-box p {
	color: rgba(255, 255, 255, .84);
	max-width: 720px;
	margin: 0 auto 26px
}

.site-footer {
	background: #fff;
	border-top: 1px solid var(--border);
	padding: 34px 0
}

.footer-inner {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 18px;
	flex-wrap: wrap
}

.footer-inner p {
	color: var(--muted);
	margin: 0
}

.mobile-sticky-cta {
	display: none
}

.mobile-sticky-cta strong {
	font-size: 14px;
	line-height: 1.05;
	color: var(--blue-dark)
}

.mobile-sticky-cta span {
	color: var(--blue-main);
	font-size: 15px
}

.mobile-sticky-cta a {
	background: linear-gradient(135deg, var(--yellow), #FFE16B);
	color: var(--blue-dark);
	padding: 12px 16px;
	border-radius: 999px;
	font-weight: 950;
	font-size: 13px
}

@media (max-width:1100px) {
	.main-nav {
		gap: 14px;
		font-size: 13px
	}

	.brand img {
		width: 118px
	}

	.hero-grid {
		grid-template-columns: 1fr;
		min-height: auto
	}

	.offer-card {
		max-width: 520px
	}

	.solutions-grid {
		grid-template-columns: 1fr
	}

	.solution-card-featured {
		grid-row: auto;
		min-height: 420px
	}

	.plans-grid {
		grid-template-columns: 1fr 1fr
	}

	.plan-card.featured {
		grid-column: 1/-1;
		transform: none
	}

	.use-grid,
	.chip-grid,
	.support-grid,
	.benefits-grid,
	.band-grid,
	.business-card,
	.product-card,
	.app-grid {
		grid-template-columns: 1fr
	}

	.support-grid {
		grid-template-columns: 1fr
	}

	.support-image {
		height: 420px;
		max-width: 520px
	}

	.business-image,
	.band-grid .media-card,
	.use-image,
	.chip-image,
	.product-image {
		height: 360px
	}

	.benefits-grid {
		gap: 28px
	}

	.atendimento-box {
		grid-template-columns: 1fr
	}

	.atendimento-box .btn {
		width: fit-content
	}
}

@media (max-width:768px) {
	body {
		padding-bottom: 82px
	}

	.site-header {
		position: sticky
	}

	.header-inner {
		min-height: 64px
	}

	.brand img {
		width: 105px
	}

	.menu-toggle {
		display: flex
	}

	.btn-header {
		display: none
	}

	.main-nav {
		position: absolute;
		top: 64px;
		left: 16px;
		right: 16px;
		display: none;
		flex-direction: column;
		align-items: stretch;
		gap: 0;
		background: #fff;
		border: 1px solid var(--border);
		border-radius: 22px;
		box-shadow: var(--shadow);
		padding: 10px
	}

	.main-nav.is-open {
		display: flex
	}

	.main-nav a {
		padding: 14px 12px;
		border-radius: 14px
	}

	.main-nav a:hover {
		background: var(--surface-2)
	}

	.section {
		padding: 58px 0
	}

	.section-head h2,
	.use-content h2,
	.chip-content h2,
	.support-copy h2,
	.business-card h2,
	.final-box h2,
	.product-card h2,
	.app-grid h2,
	.atendimento-box h2 {
		font-size: 27px;
		padding-top: 15px;
		text-align: center;
	}

	.hero-offer {
		padding: 42px 0 34px
	}

	.hero-bg {
		background: linear-gradient(180deg, rgba(4, 18, 54, .97) 0%, rgba(6, 45, 120, .91) 58%, rgba(6, 45, 120, .74) 100%), url('../img/hero-familia.webp') center top/cover no-repeat
	}

	.fiber-lines {
		opacity: .42
	}

	.hero-grid {
		gap: 24px
	}

	.hero-copy h1 {
		font-size: 38px;
		margin-bottom: 14px
	}

	.hero-subtitle {
		font-size: 17px;
		margin-bottom: 20px
	}

	.hero-actions {
		display: grid;
		grid-template-columns: 1fr;
		gap: 10px
	}

	.proof-strip {
		display: grid;
		grid-template-columns: 1fr;
		gap: 8px
	}

	.proof-strip span {
		text-align: center
	}

	.offer-card {
		padding: 22px;
		border-radius: 26px
	}

	.offer-speed {
		font-size: 125px
	}

	.offer-price {
		font-size: 32px
	}

	.solutions-section {
		padding: 56px 0
	}

	.solutions-header {
		grid-template-columns: 1fr
	}

	.solutions-header .btn {
		width: 100%
	}

	.solutions-grid {
		gap: 14px
	}

	.solution-card {
		grid-template-columns: 1fr;
		min-height: auto;
		padding: 22px;
		border-radius: 22px
	}

	.solution-card-featured {
		min-height: 380px;
		background-position: center
	}

	.solution-card-featured .solution-content h3 {
		font-size: 34px
	}

	.solution-content h3 {
		font-size: 23px
	}

	.plans-grid {
		display: flex;
		flex-direction: column
	}

	.plans-grid .plan-card.featured {
		order: -1
	}

	.plan-card {
		padding: 22px;
		border-radius: 24px
	}

	.plan-card h3 {
		font-size: 42px
	}

	.plan-price {
		font-size: 32px
	}

	.use-cards,
	.benefit-list,
	.mini-plans {
		grid-template-columns: 1fr
	}

	.media-card,
	.use-image,
	.chip-image,
	.support-image,
	.band-grid .media-card,
	.business-image,
	.product-image {
		height: 280px;
		border-radius: 24px
	}

	.support-image {
		max-width: none
	}

	.business-card,
	.product-card,
	.atendimento-box {
		padding: 26px;
		border-radius: 28px
	}

	.phone-frame {
		width: 220px;
		min-height: 390px
	}

	.final-box {
		padding: 38px 22px;
		border-radius: 28px
	}

	.footer-inner {
		justify-content: center;
		text-align: center
	}

	.mobile-sticky-cta {
		position: fixed;
		left: 12px;
		right: 12px;
		bottom: 12px;
		z-index: 80;
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 12px;
		background: rgba(255, 255, 255, .96);
		backdrop-filter: blur(14px);
		border: 1px solid var(--border);
		border-radius: 20px;
		padding: 10px 12px;
		box-shadow: 0 16px 44px rgba(0, 0, 0, .24)
	}
}

@media (max-width:420px) {
	.container {
		width: min(100% - 24px, var(--container))
	}

	.hero-copy h1 {
		font-size: 34px
	}

	.btn {
		white-space: normal;
		text-align: center
	}

	.offer-top {
		display: grid
	}

	.media-card,
	.use-image,
	.chip-image,
	.support-image,
	.band-grid .media-card,
	.business-image,
	.product-image {
		height: 240px
	}

	.section {
		padding: 48px 0
	}

	.app-mockup {
		display: none
	}
}

@media (prefers-reduced-motion:reduce) {
	* {
		scroll-behavior: auto !important;
		transition: none !important
	}
}


/* =========================================================
   ABC + APP — seção atualizada com assets separados
   Ajuste compacto: mesma presença visual da seção abcRede TV
========================================================= */
.abcapp-section {
	background: #fff;
	padding: 72px 0;
	overflow: hidden;
}

.abcapp-banner {
	position: relative;
	width: 100%;
	aspect-ratio: 1672/720;
	min-height: 0;
	max-height: 510px;
	overflow: hidden;
	isolation: isolate;
	border-radius: 28px;
	color: #fff;
	background: #061048 url('../img/abcapp/bg.webp') center/cover no-repeat;
	box-shadow: 0 28px 72px rgba(6, 27, 79, .18);
}

.abcapp-banner:before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 0;
	background:
		radial-gradient(circle at 76% 42%, rgba(8, 198, 255, .18), transparent 30%),
		linear-gradient(90deg, rgba(5, 14, 58, .32) 0%, rgba(5, 14, 58, .10) 45%, rgba(5, 14, 58, 0) 100%);
	pointer-events: none;
}

.abcapp-left,
.abcapp-center,
.abcapp-phone-wrap {
	position: absolute;
	z-index: 2;
}

.abcapp-left {
	left: 6.4%;
	top: 9.2%;
	width: 24.5%;
}

.abcapp-logo-img {
	width: 78%;
	max-width: 300px;
	height: auto;
	display: block;
	filter: drop-shadow(0 14px 26px rgba(0, 0, 0, .26));
}

.abcapp-title {
	margin: 6.8% 0 0;
	color: #fff;
	font-weight: 400;
	line-height: .98;
	letter-spacing: -.055em;
	text-shadow: 0 5px 16px rgba(0, 0, 0, .24);
}

.abcapp-title strong,
.abcapp-title span {
	display: block;
}

.abcapp-title strong {
	font-size: clamp(1.35rem, 2.42vw, 2.65rem);
	font-weight: 900;
	letter-spacing: -.055em;
	line-height: 1.03;
	margin-bottom: 2.1%;
}

.abcapp-title span {
	font-size: clamp(1.12rem, 2.03vw, 2.22rem);
	line-height: 1.08;
}

.abcapp-title mark {
	color: #ffc20b;
	background: transparent;
	font-weight: 900;
}

.abcapp-center {
	left: 34.1%;
	top: 18.4%;
	width: 31.5%;
}

.abcapp-price-card {
	position: relative;
	width: 100%;
	min-height: 0;
	max-height: none;
	padding: 4.4% 7.2% 4.2% 7.6%;
	border-radius: clamp(20px, 2.1vw, 32px);
	background: linear-gradient(180deg, rgba(0, 43, 128, .23), rgba(1, 16, 74, .26)), rgba(1, 22, 88, .20);
	border: 1.4px solid rgba(85, 196, 255, .86);
	box-shadow: inset 0 0 18px rgba(0, 206, 255, .26), inset 0 0 3px rgba(255, 255, 255, .40), 0 0 18px rgba(0, 163, 255, .34), 0 14px 36px rgba(0, 0, 0, .24);
	backdrop-filter: blur(6px);
}

.abcapp-price-card:before {
	content: "";
	position: absolute;
	inset: -2px;
	border-radius: inherit;
	pointer-events: none;
	background: linear-gradient(105deg, transparent 0 30%, rgba(130, 232, 255, .55), transparent 52% 100%);
	opacity: .32;
	padding: 1px;
	-webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
	-webkit-mask-composite: xor;
	mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
	mask-composite: exclude;
}

.abcapp-price-label {
	display: block;
	margin-bottom: .06em;
	color: rgba(255, 255, 255, .94);
	font-size: clamp(.78rem, 1.13vw, 1.22rem);
	line-height: 1;
}

.abcapp-price-line {
	display: flex;
	align-items: baseline;
	gap: .045em;
	line-height: .86;
	white-space: nowrap;
}

.abcapp-currency {
	font-size: clamp(1.25rem, 2.28vw, 2.52rem);
	font-weight: 300;
	margin-right: .06em;
}

.abcapp-price {
	color: #ffc20b;
	font-size: clamp(3rem, 5.95vw, 6.55rem);
	font-weight: 900;
	letter-spacing: -.075em;
	text-shadow: 0 3px 0 rgba(255, 138, 0, .18);
}

.abcapp-cents {
	font-size: clamp(1.25rem, 2.35vw, 2.55rem);
	line-height: .62;
	font-weight: 500;
	margin-left: .07em;
}

.abcapp-cents small {
	font-size: .78em;
	font-weight: 500;
}

.abcapp-subtext {
	margin: 4.6% 0 4.2% 2.1%;
	font-size: clamp(.78rem, 1.1vw, 1.2rem);
	line-height: 1.1;
	color: rgba(255, 255, 255, .92);
	text-shadow: 0 3px 12px rgba(0, 0, 0, .22);
}

.abcapp-subtext strong {
	font-weight: 900;
	color: #fff;
}

.abcapp-icons-grid {
	width: 90%;
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap: clamp(6px, .84vw, 14px);
	margin-left: .2%;
}

.abcapp-icons-grid picture,
.abcapp-icons-grid img {
	display: block;
	width: 100%;
}

.abcapp-icons-grid img {
	aspect-ratio: 1/1;
	object-fit: contain;
	filter: drop-shadow(0 7px 10px rgba(0, 0, 0, .28));
}

.abcapp-cta {
	display: grid;
	place-items: center;
	width: 82%;
	min-height: clamp(38px, 3.88vw, 62px);
	margin: 5.8% 0 0 .1%;
	border-radius: 999px;
	color: #08124c;
	text-decoration: none;
	font-size: clamp(.74rem, 1.08vw, 1.22rem);
	font-weight: 900;
	letter-spacing: -.02em;
	background: linear-gradient(180deg, #ffd91b 0%, #ffc20b 48%, #ffae00 100%);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, .55), 0 10px 20px rgba(0, 0, 0, .22), 0 0 20px rgba(255, 198, 0, .14);
	transition: transform .18s ease, box-shadow .18s ease;
}

.abcapp-cta:hover {
	transform: translateY(-2px);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, .55), 0 14px 28px rgba(0, 0, 0, .26), 0 0 28px rgba(255, 198, 0, .20);
}

.abcapp-phone-wrap {
	right: 8.1%;
	top: 7.4%;
	width: 23.2%;
	max-width: 335px;
	margin: 0;
}

.abcapp-phone {
	width: 100%;
	height: auto;
	display: block;
	filter: drop-shadow(0 22px 30px rgba(0, 0, 0, .42)) drop-shadow(0 0 22px rgba(44, 169, 255, .34));
}

@media(max-width:1100px) {
	.abcapp-section {
		padding: 62px 0;
	}

	.abcapp-banner {
		border-radius: 28px;
		max-height: 390px;
	}

	.abcapp-left {
		left: 5.8%;
		top: 9.5%;
	}

	.abcapp-center {
		left: 35%;
		width: 33%;
		top: 18.5%;
	}

	.abcapp-phone-wrap {
		right: 4.8%;
		width: 25%;
	}

	.abcapp-logo-img {
		width: 74%;
	}
}

@media(max-width:760px) {
	.abcapp-section {
		padding: 42px 0;
		background: #fff;
	}

	.abcapp-banner {
		aspect-ratio: auto;
		min-height: auto;
		max-height: none;
		padding: 22px 18px 24px;
		border-radius: 24px;
		display: grid;
		grid-template-columns: 1fr;
		gap: 18px;
		background-position: 68% center;
		box-shadow: 0 18px 42px rgba(6, 27, 79, .16);
	}

	.abcapp-banner:before {
		background: linear-gradient(180deg, rgba(5, 14, 58, .82), rgba(5, 14, 58, .58));
	}

	.abcapp-left,
	.abcapp-center,
	.abcapp-phone-wrap {
		position: relative;
		inset: auto;
		width: 100%;
		max-width: none;
	}

	.abcapp-left {
		order: 1;
	}

	.abcapp-center {
		order: 2;
	}

	.abcapp-phone-wrap {
		order: 3;
		display: flex;
		justify-content: center;
		margin-top: 4px;
	}

	.abcapp-logo-img {
		width: 170px;
		max-width: 62%;
	}

	.abcapp-title {
		margin-top: 14px;
		max-width: 320px;
	}

	.abcapp-title strong {
		font-size: 28px;
		line-height: 1.02;
	}

	.abcapp-title span {
		font-size: 22px;
		line-height: 1.04;
	}

	.abcapp-price-card {
		max-width: 100%;
		min-height: auto;
		padding: 16px 18px;
		border-radius: 22px;
	}

	.abcapp-price-label {
		font-size: 16px;
	}

	.abcapp-price-line {
		gap: .03em;
	}

	.abcapp-price {
		font-size: 60px;
	}

	.abcapp-currency {
		font-size: 26px;
	}

	.abcapp-cents {
		font-size: 24px;
	}

	.abcapp-subtext {
		font-size: 15px;
		line-height: 1.25;
		margin: 14px 0 16px 0;
	}

	.abcapp-icons-grid {
		width: min(100%, 340px);
		grid-template-columns: repeat(6, minmax(0, 1fr));
		gap: 8px;
		margin-left: 0;
	}

	.abcapp-cta {
		width: 100%;
		max-width: 360px;
		min-height: 52px;
		font-size: 15px;
		margin-top: 16px;
	}

	.abcapp-phone {
		width: min(220px, 66vw);
	}
}

@media(max-width:480px) {
	.abcapp-section {
		padding: 36px 0;
	}

	.abcapp-banner {
		padding: 18px 14px 20px;
		border-radius: 22px;
		gap: 16px;
		background-position: 70% center;
	}

	.abcapp-logo-img {
		width: 150px;
		max-width: 70%;
	}

	.abcapp-title {
		max-width: 340px;
		text-align: center;
	}

	.abcapp-title strong {
		font-size: 24px;
	}

	.abcapp-title span {
		font-size: 19px;
	}

	.abcapp-price-card {
		padding: 14px 15px 15px;
		border-radius: 20px;
	}

	.abcapp-price-label {
		font-size: 14px;
	}

	.abcapp-price {
		font-size: 52px;
	}

	.abcapp-currency {
		font-size: 23px;
	}

	.abcapp-cents {
		font-size: 20px;
	}

	.abcapp-subtext {
		font-size: 14px;
		margin: 12px 0 14px;
	}

	.abcapp-icons-grid {
		width: 100%;
		gap: 6px;
	}

	.abcapp-cta {
		min-height: 50px;
		font-size: 14px;
		padding: 0 14px;
	}

	.abcapp-phone {
		width: min(200px, 68vw);
	}
}

@media(max-width:360px) {
	.abcapp-title strong {
		font-size: 22px;
	}

	.abcapp-title span {
		font-size: 17px;
	}

	.abcapp-price {
		font-size: 46px;
	}

	.abcapp-currency {
		font-size: 20px;
	}

	.abcapp-cents {
		font-size: 18px;
	}

	.abcapp-icons-grid {
		grid-template-columns: repeat(4, minmax(0, 1fr));
		width: min(100%, 250px);
	}

	.abcapp-phone {
		width: min(180px, 64vw);
	}
}






/* =========================================================

========================================================= */


@media (max-width: 760px) {
  .abcapp-banner {
    text-align: center;
    justify-items: center;
  }

  .abcapp-left,
  .abcapp-center,
  .abcapp-phone-wrap {
    text-align: center;
    align-items: center;
    justify-content: center;
    margin-left: auto;
    margin-right: auto;
  }

  .abcapp-left picture,
  .abcapp-center,
  .abcapp-icons-grid,
  .abcapp-phone-wrap {
    margin-left: auto;
    margin-right: auto;
  }

  .abcapp-logo-img {
    margin-left: auto;
    margin-right: auto;
  }

  .abcapp-title {
    margin-left: auto;
    margin-right: auto;
  }

  .abcapp-price-card {
    margin-left: auto;
    margin-right: auto;
  }

  .abcapp-icons-grid {
    justify-content: center;
  }

  .abcapp-cta {
    margin-left: auto;
    margin-right: auto;
  }
}

/* =========================================================
   ABC + APP — Ícones premium
========================================================= */

.abcapp-icons-grid-premium {
  width: fit-content !important;
  max-width: none !important;
  display: grid !important;
  grid-template-columns: repeat(4, 64px) !important;
  gap: 14px !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 auto 0 0 !important;
}

.abcapp-icons-grid-premium picture {
  width: 64px !important;
  height: 64px !important;
  display: block !important;
  overflow: hidden !important;
  border-radius: 16px !important;
  background: rgba(255, 255, 255, 0.10) !important;
  box-shadow:
    0 10px 22px rgba(0, 0, 0, 0.28),
    inset 0 0 0 1px rgba(255, 255, 255, 0.16) !important;
}

.abcapp-icons-grid-premium img {
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: cover !important;
  display: block !important;
  border-radius: 16px !important;
}

/* Mobile */
@media (max-width: 760px) {
  .abcapp-icons-grid-premium {
    grid-template-columns: repeat(4, 54px) !important;
    gap: 10px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    justify-content: center !important;
  }

  .abcapp-icons-grid-premium picture {
    width: 54px !important;
    height: 54px !important;
    border-radius: 14px !important;
  }

  .abcapp-icons-grid-premium img {
    border-radius: 14px !important;
  }
}

@media (max-width: 480px) {
  .abcapp-icons-grid-premium {
    grid-template-columns: repeat(4, 50px) !important;
    gap: 8px !important;
  }

  .abcapp-icons-grid-premium picture {
    width: 50px !important;
    height: 50px !important;
    border-radius: 13px !important;
  }

  .abcapp-icons-grid-premium img {
    border-radius: 13px !important;
  }
}


/* =========================================================
   PLANOS DE INTERNET — VERSÃO FINAL COMPACTA / 5 PLANOS
========================================================= */

.plans-grid-compact {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 14px;
  margin-top: 36px;
  align-items: stretch;
}

.plan-card-compact {
  background: #ffffff;
  border: 1px solid var(--border);
  border-radius: 24px;
  padding: 22px 18px;
  box-shadow: 0 16px 44px rgba(5, 34, 92, 0.09);
  display: flex;
  flex-direction: column;
  min-height: 100%;
}

.plan-card-compact.featured {
  background: linear-gradient(180deg, #0d63ff 0%, #073a9e 100%);
  color: #ffffff;
  box-shadow: 0 24px 70px rgba(11, 79, 207, 0.28);
  transform: translateY(-8px);
}

.plan-card-premium {
  border-color: rgba(8, 198, 255, 0.35);
  background: linear-gradient(180deg, #ffffff 0%, #f4f8fc 100%);
}

.plan-speed {
  margin: 16px 0 10px;
  color: var(--blue-dark);
  font-size: clamp(38px, 3.5vw, 54px);
  line-height: 0.9;
  letter-spacing: -0.06em;
  font-weight: 950;
}

.plan-speed small {
  font-size: 17px;
  letter-spacing: -0.02em;
  font-weight: 900;
}

.plan-speed-unlimited {
  font-size: clamp(30px, 2.8vw, 42px);
  line-height: 0.95;
}

.plan-speed-unlimited small {
  display: block;
  margin-top: 4px;
  font-size: 20px;
}

.plan-price {
  margin: 0 0 12px;
  color: var(--blue-dark);
  font-size: clamp(28px, 2.6vw, 36px);
  line-height: 1;
  letter-spacing: -0.055em;
  font-weight: 950;
}

.plan-price span {
  font-size: 13px;
  color: var(--muted);
  letter-spacing: 0;
  font-weight: 850;
}

.plan-desc {
  color: var(--muted);
  font-size: 14px;
  line-height: 1.45;
  margin: 0 0 16px;
}

.plan-card-compact .check-list {
  margin-top: auto;
}

.plan-card-compact .btn {
  margin-top: 16px;
}

.plan-card-compact.featured .plan-speed,
.plan-card-compact.featured .plan-price,
.plan-card-compact.featured .plan-price span,
.plan-card-compact.featured .plan-desc,
.plan-card-compact.featured .check-list li {
  color: #ffffff;
}

.plan-card-compact.featured .check-list li::before {
  background: rgba(255, 255, 255, 0.18);
  color: #ffffff;
}

@media (max-width: 1180px) {
  .plans-grid-compact {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .plan-card-compact.featured {
    transform: none;
  }
}

@media (max-width: 768px) {
  .plans-grid-compact {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-top: 28px;
  }

  .plans-grid-compact .featured {
    order: -1;
  }

  .plan-card-compact {
    padding: 24px 20px;
    border-radius: 26px;
    text-align: center;
    align-items: center;
  }

  .plan-speed {
    font-size: 52px;
    margin-top: 16px;
  }

  .plan-speed small {
    font-size: 18px;
  }

  .plan-speed-unlimited {
    font-size: 38px;
  }

  .plan-speed-unlimited small {
    font-size: 22px;
  }

  .plan-price {
    font-size: 38px;
  }

  .plan-desc {
    max-width: 310px;
    margin-left: auto;
    margin-right: auto;
  }

  .plan-card-compact .check-list {
    width: fit-content;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    text-align: left;
  }

  .plan-card-compact .btn {
    width: 100%;
    max-width: 340px;
  }
}



/* =========================================
   TELEFONIA FIXA — FAIXA REDUZIDA / BACKGROUND COMPLETO
========================================= */

.telefonia-section {
  padding: 26px 0 18px;
  background: #ffffff;
}

.telefonia-banner {
  position: relative;
  min-height: 175px;
  border-radius: 26px;
  overflow: hidden;
  display: flex;
  align-items: center;
  padding: 22px 32px;
  box-shadow: 0 18px 42px rgba(6, 25, 77, 0.12);
  background:
    linear-gradient(90deg, rgba(4, 18, 54, 0.96) 0%, rgba(4, 18, 54, 0.88) 34%, rgba(4, 18, 54, 0.28) 60%, rgba(4, 18, 54, 0.05) 100%),
    url("../img/telefonia-fixa/bg-telefonia-fixa.webp") no-repeat center right / cover;
}

.telefonia-content {
  position: relative;
  z-index: 2;
  max-width: 620px;
}

.telefonia-tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 6px 13px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 950;
  letter-spacing: 0.05em;
  color: #ffc928;
  border: 1px solid rgba(255, 201, 40, 0.36);
  background: rgba(255, 201, 40, 0.12);
  margin-bottom: 9px;
}

.telefonia-title {
  margin: 0 0 8px;
  font-size: clamp(28px, 3.2vw, 42px);
  line-height: 0.98;
  font-weight: 950;
  letter-spacing: -0.05em;
  color: #ffffff;
}

.telefonia-title span {
  display: inline;
  color: #ffc928;
}

.telefonia-text {
  margin: 0 0 12px;
  font-size: 14.5px;
  line-height: 1.4;
  color: rgba(255, 255, 255, 0.92);
  max-width: 500px;
}

.telefonia-list {
  list-style: none;
  padding: 0;
  margin: 0 0 14px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.telefonia-list li {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 7px 11px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.11);
  color: #ffffff;
  font-size: 12.5px;
  line-height: 1;
  font-weight: 850;
}

.telefonia-list li::before {
  content: "✓";
  width: 17px;
  height: 17px;
  border-radius: 50%;
  background: #ffc928;
  color: #061b4f;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 950;
  flex: 0 0 auto;
}

.telefonia-bottom {
  display: flex;
  align-items: center;
  gap: 13px;
  flex-wrap: wrap;
}

.telefonia-price-box {
  min-width: 150px;
  padding: 10px 14px 9px;
  border-radius: 16px;
  background: rgba(4, 18, 54, 0.78);
  border: 1px solid rgba(255, 201, 40, 0.45);
  box-shadow: 0 10px 22px rgba(5, 18, 62, 0.22);
}

.telefonia-price-label {
  display: block;
  margin-bottom: 3px;
  font-size: 10px;
  line-height: 1;
  font-weight: 950;
  color: #ffffff;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.telefonia-price-line {
  display: flex;
  align-items: flex-start;
  gap: 3px;
  line-height: 1;
}

.telefonia-currency {
  margin-top: 7px;
  font-size: 16px;
  font-weight: 950;
  color: #ffc928;
}

.telefonia-price {
  font-size: 42px;
  line-height: 0.85;
  font-weight: 950;
  letter-spacing: -0.06em;
  color: #ffc928;
}

.telefonia-cents {
  margin-top: 7px;
  font-size: 19px;
  line-height: 1;
  font-weight: 950;
  color: #ffc928;
}

.telefonia-price-period {
  display: block;
  margin-top: 2px;
  font-size: 10.5px;
  line-height: 1;
  font-weight: 950;
  color: #ffffff;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.telefonia-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 22px;
  border-radius: 999px;
  background: linear-gradient(180deg, #ffe16b 0%, #ffc928 100%);
  color: #061b4f;
  text-decoration: none;
  font-size: 14px;
  font-weight: 950;
  white-space: nowrap;
  box-shadow: 0 12px 24px rgba(255, 201, 40, 0.24);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.telefonia-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 16px 30px rgba(255, 201, 40, 0.30);
}

@media (max-width: 991px) {
  .telefonia-banner {
    min-height: 185px;
    padding: 22px 24px;
    background:
      linear-gradient(90deg, rgba(4, 18, 54, 0.96) 0%, rgba(4, 18, 54, 0.86) 48%, rgba(4, 18, 54, 0.38) 100%),
      url("../img/telefonia-fixa/bg-telefonia-fixa.webp") no-repeat 70% center / cover;
  }

  .telefonia-content {
    max-width: 540px;
  }

  .telefonia-title {
    font-size: 34px;
  }
}

@media (max-width: 767px) {
  .telefonia-section {
    padding: 22px 0 12px;
  }

  .telefonia-banner {
    min-height: auto;
    padding: 22px 16px;
    border-radius: 22px;
    text-align: center;
    justify-content: center;
    background:
      linear-gradient(180deg, rgba(4, 18, 54, 0.94) 0%, rgba(4, 18, 54, 0.88) 58%, rgba(4, 18, 54, 0.62) 100%),
      url("../img/telefonia-fixa/bg-telefonia-fixa.webp") no-repeat 76% center / cover;
  }

  .telefonia-content {
    max-width: 100%;
  }

  .telefonia-tag {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 10px;
  }

  .telefonia-title {
    max-width: 330px;
    margin-left: auto;
    margin-right: auto;
    font-size: 31px;
    line-height: 1;
  }

  .telefonia-title span {
    display: block;
  }

  .telefonia-text {
    max-width: 320px;
    margin: 10px auto 13px;
    font-size: 14.5px;
  }

  .telefonia-list {
    justify-content: center;
    margin-bottom: 14px;
  }

  .telefonia-list li {
    font-size: 12px;
  }

  .telefonia-bottom {
    justify-content: center;
    gap: 10px;
  }

  .telefonia-price-box {
    width: 100%;
    max-width: 260px;
    text-align: left;
  }

  .telefonia-btn {
    width: 100%;
    max-width: 260px;
    min-height: 46px;
  }
}

@media (max-width: 420px) {
  .telefonia-banner {
    padding: 20px 14px;
  }

  .telefonia-title {
    font-size: 29px;
  }

  .telefonia-price {
    font-size: 39px;
  }
}


/* =========================================
   FOOTER CLEAN — VERSÃO FINAL
========================================= */
.site-footer{background:#041236;color:#fff;padding:34px 0 0}.footer-inner-final{display:flex;align-items:flex-start;justify-content:space-between;gap:32px}.footer-brand-block{max-width:520px}.footer-brand img{width:145px;height:auto;display:block;margin-bottom:14px}.footer-brand-block p{margin:0;color:rgba(255,255,255,.72);font-size:14px;line-height:1.5}.footer-company{margin-top:12px!important;color:rgba(255,255,255,.55)!important;font-size:12.5px!important;font-weight:600}.footer-contact-block{min-width:280px}.footer-contact-block h3{margin:0 0 12px;color:#fff;font-size:16px;font-weight:800}.footer-contact-item{display:block;margin-bottom:10px;color:#fff;text-decoration:none}.footer-contact-item span,.footer-social>span{display:block;margin-bottom:3px;color:rgba(255,255,255,.55);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em}.footer-contact-item strong{color:#ffc928;font-size:15px;font-weight:800}.footer-contact-item:hover strong{text-decoration:underline}.footer-social{margin-top:12px}.footer-social-links{display:flex;gap:14px;margin-top:6px}.footer-social-links a{display:inline-flex;align-items:center;gap:6px;color:rgba(255,255,255,.82);font-size:14px;font-weight:700;text-decoration:none}.footer-social-links a:hover{color:#ffc928}.footer-bottom{margin-top:28px;padding:14px 0;border-top:1px solid rgba(255,255,255,.10)}.footer-bottom-inner{display:flex;align-items:center;justify-content:space-between;gap:18px}.footer-bottom p{margin:0;color:rgba(255,255,255,.55);font-size:12.5px;line-height:1.4}.footer-dev strong{color:rgba(255,255,255,.85);font-weight:700}
/* =========================================
   PÁGINAS INTERNAS — CONTRATOS / REGULAMENTOS
========================================= */
.legal-hero{padding:86px 0 46px;background:radial-gradient(circle at 82% 16%,rgba(8,198,255,.18),transparent 28%),linear-gradient(180deg,#f6f9ff 0%,#fff 100%);border-bottom:1px solid rgba(5,34,92,.08)}.legal-hero-grid{display:grid;grid-template-columns:minmax(0,1fr);align-items:center;gap:34px}.legal-kicker{display:inline-flex;margin-bottom:14px;padding:7px 14px;border-radius:999px;background:rgba(11,79,207,.08);color:#0b4fcf;font-size:12px;font-weight:950;letter-spacing:.06em;text-transform:uppercase}.legal-hero h1{max-width:780px;margin:0;color:#041236;font-size:clamp(40px,5vw,66px);line-height:.96;letter-spacing:-.065em;font-weight:950}.legal-hero p{margin:18px 0 0;color:#5d6b84;font-size:17px;line-height:1.58}.legal-summary-card{padding:24px;border-radius:26px;background:#041236;color:#fff;box-shadow:0 20px 50px rgba(5,34,92,.12)}.legal-summary-card strong{display:block;color:#ffc928;font-size:28px;line-height:1;letter-spacing:-.04em;font-weight:950}.legal-summary-card span{display:block;margin-top:8px;color:rgba(255,255,255,.76);font-size:14px;font-weight:800}.legal-section{padding:52px 0 82px;background:#fff}.legal-section-head{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:22px}.legal-section-head h2{margin:0;color:#041236;font-size:32px;line-height:1;letter-spacing:-.04em;font-weight:950}.legal-section-head p{margin:0;color:#5d6b84;font-size:15px}.legal-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.legal-card{padding:24px;border-radius:26px;background:#fff;border:1px solid rgba(5,34,92,.10);box-shadow:0 18px 48px rgba(5,34,92,.08)}.legal-card-top{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:16px}.legal-card-top span{display:inline-flex;padding:6px 11px;border-radius:999px;background:rgba(255,201,40,.16);color:#0b2c88;font-size:12px;font-weight:950}.legal-card-top small{color:#718097;font-size:12px;font-weight:800;text-align:right}.legal-card h2{margin:0 0 10px;color:#041236;font-size:22px;line-height:1.12;letter-spacing:-.035em;font-weight:950}.legal-card p{min-height:46px;margin:0 0 18px;color:#5d6b84;font-size:15px;line-height:1.48}.legal-card-actions{display:flex;gap:10px;flex-wrap:wrap}.legal-card-actions a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 17px;border-radius:999px;background:#0b4fcf;color:#fff;text-decoration:none;font-size:14px;font-weight:900}.legal-card-actions a.secondary{background:rgba(11,79,207,.08);color:#0b4fcf}.regulation-section{padding:50px 0 82px;background:#fff}.regulation-paper{max-width:920px;margin:0 auto;padding:42px;border-radius:28px;background:#fff;border:1px solid rgba(5,34,92,.10);box-shadow:0 22px 60px rgba(5,34,92,.08)}.regulation-title{padding-bottom:24px;margin-bottom:26px;border-bottom:1px solid rgba(5,34,92,.10)}.regulation-title span{display:inline-flex;margin-bottom:10px;color:#0b4fcf;font-size:12px;font-weight:950;text-transform:uppercase;letter-spacing:.06em}.regulation-title h2{margin:0;color:#041236;font-size:clamp(28px,4vw,42px);line-height:1;letter-spacing:-.05em;font-weight:950}.regulation-title p{margin:14px 0 0;color:#5d6b84;font-size:16px;line-height:1.58}.regulation-block{padding:22px 0;border-bottom:1px solid rgba(5,34,92,.08)}.regulation-block:last-child{border-bottom:0;padding-bottom:0}.regulation-block h2{margin:0 0 12px;color:#041236;font-size:20px;line-height:1.18;letter-spacing:-.025em;font-weight:950}.regulation-block p{margin:0 0 8px;color:#344057;font-size:15px;line-height:1.58}.regulation-block a{color:#0b4fcf;font-weight:800}@media(max-width:768px){.site-footer{padding-top:30px}.footer-inner-final{flex-direction:column;gap:24px}.footer-contact-block{min-width:0;width:100%}.footer-bottom{margin-top:24px}.footer-bottom-inner{flex-direction:column;align-items:flex-start;gap:6px}.legal-hero{padding:70px 0 38px}.legal-hero-grid{grid-template-columns:1fr;gap:22px}.legal-hero h1{font-size:38px}.legal-hero p{font-size:15.5px}.legal-grid{grid-template-columns:1fr}.legal-section-head{display:block}.legal-section-head h2{margin-bottom:8px;font-size:28px}.legal-card{padding:22px 18px}.legal-card-actions a{width:100%}.regulation-paper{padding:24px 18px;border-radius:24px}.regulation-title h2{font-size:28px}}


/* =========================================
   404 — PÁGINA DE ERRO AMIGÁVEL
========================================= */

.error-page {
  min-height: 68vh;
  display: grid;
  place-items: center;
  padding: 96px 0;
  background:
    radial-gradient(circle at 80% 16%, rgba(8, 198, 255, 0.16), transparent 28%),
    linear-gradient(180deg, #f6f9ff 0%, #ffffff 100%);
}

.error-card {
  max-width: 760px;
  margin: 0 auto;
  padding: 44px;
  border-radius: 32px;
  background: #ffffff;
  border: 1px solid rgba(5, 34, 92, 0.10);
  box-shadow: 0 24px 70px rgba(5, 34, 92, 0.10);
  text-align: center;
}

.error-code {
  display: inline-flex;
  margin-bottom: 16px;
  padding: 8px 14px;
  border-radius: 999px;
  background: rgba(11, 79, 207, 0.08);
  color: #0b4fcf;
  font-size: 12px;
  font-weight: 950;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.error-card h1 {
  margin: 0 0 14px;
  color: #041236;
  font-size: clamp(36px, 5vw, 58px);
  line-height: 0.98;
  letter-spacing: -0.055em;
  font-weight: 950;
}

.error-card p {
  max-width: 580px;
  margin: 0 auto 26px;
  color: #5d6b84;
  font-size: 17px;
  line-height: 1.58;
}

.error-actions {
  display: flex;
  justify-content: center;
  gap: 12px;
  flex-wrap: wrap;
}

@media (max-width: 768px) {
  .error-page {
    padding: 72px 0;
  }

  .error-card {
    padding: 30px 20px;
    border-radius: 26px;
  }

  .error-actions .btn {
    width: 100%;
  }
}
