/* =========================================
ATECH SERVICES PREMIUM WEBSITE V90
========================================= */

*{
margin:0;
padding:0;
box-sizing:border-box;
}

:root{
--black:#050505;
--black2:#0b0b0b;
--red:#e50914;
--white:#ffffff;
--grey:#a1a1aa;
--line:rgba(255,255,255,.08);
}

html{
scroll-behavior:smooth;
}

body{
background:#050505;
color:#fff;
font-family:Inter,Arial,Helvetica,sans-serif;
overflow-x:hidden;
}

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

.container{
width:min(1320px,calc(100% - 36px));
margin:auto;
}

/*=====================
TOPBAR
======================*/

.topbar{
background:#0a0a0a;
border-bottom:1px solid rgba(255,255,255,.06);
}

.topbar-inner{
min-height:52px;
display:flex;
justify-content:space-between;
align-items:center;
gap:20px;
}

.topbar-services,
.topbar-links{
display:flex;
flex-wrap:wrap;
gap:18px;
}

.topbar-services a,
.topbar-links a{
font-size:14px;
font-weight:800;
color:#d4d4d8;
transition:.3s;
}

.topbar-services a:hover,
.topbar-links a:hover{
color:var(--red);
}

/*=====================
NAVBAR
======================*/

.nav{
position:sticky;
top:0;
z-index:100;
background:rgba(5,5,5,.95);
backdrop-filter:blur(15px);
border-bottom:1px solid rgba(255,255,255,.05);
}

.nav-inner{
min-height:88px;
display:flex;
justify-content:space-between;
align-items:center;
gap:30px;
}

.brand{
display:flex;
gap:12px;
align-items:center;
font-size:32px;
font-weight:900;
letter-spacing:2px;
}

.brand strong{
color:#fff;
}

.brand span{
color:var(--red);
}

.nav-links{
display:flex;
gap:26px;
}

.nav-links a{
font-weight:800;
font-size:15px;
color:#d4d4d8;
transition:.3s;
}

.nav-links a:hover{
color:#fff;
}

.nav-actions{
display:flex;
gap:14px;
}

/*=====================
BUTTONS
======================*/

.btn{
display:inline-flex;
align-items:center;
justify-content:center;
padding:16px 28px;
border-radius:999px;
font-weight:900;
transition:.3s;
cursor:pointer;
border:none;
}

.btn-red{
background:var(--red);
color:#fff;
box-shadow:0 15px 45px rgba(229,9,20,.35);
}

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

.btn-outline{
background:transparent;
border:1px solid rgba(255,255,255,.18);
color:#fff;
}

.btn-white{
background:#fff;
color:#111;
}

.btn-whatsapp{
background:#16a34a;
color:#fff;
}

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

/*=====================
HERO
======================*/

.hero{
position:relative;
overflow:hidden;
padding:90px 0 70px;
background:
radial-gradient(circle at 85% 10%,rgba(229,9,20,.18),transparent 28%),
radial-gradient(circle at 15% 80%,rgba(255,255,255,.05),transparent 25%),
#050505;
}

.red-line{
position:absolute;
height:2px;
background:linear-gradient(to right,transparent,var(--red),transparent);
opacity:.6;
}

.red-line-one{
top:110px;
left:-120px;
width:500px;
transform:rotate(-10deg);
}

.red-line-two{
right:-100px;
bottom:140px;
width:450px;
transform:rotate(12deg);
}

.dot-field{
position:absolute;
width:240px;
height:240px;
opacity:.12;
background-image:radial-gradient(#fff 1px,transparent 1px);
background-size:18px 18px;
}

.dot-left{
left:-40px;
bottom:60px;
}

.dot-right{
right:20px;
top:90px;
}

.hero-grid{
display:grid;
grid-template-columns:1.2fr .8fr;
gap:50px;
align-items:start;
}

.hero-copy{
display:flex;
flex-direction:column;
gap:28px;
}

.kicker{
display:flex;
align-items:center;
gap:12px;
font-size:14px;
font-weight:900;
color:#c4c4c5;
letter-spacing:1px;
}

.kicker span{
width:40px;
height:2px;
background:var(--red);
}
/*=====================
HERO SERVICE TAGS
======================*/

.hero-service-tags{
display:flex;
flex-wrap:wrap;
gap:10px;
}

.hero-service-tags a{
padding:10px 14px;
border-radius:999px;
background:rgba(255,255,255,.06);
border:1px solid rgba(255,255,255,.1);
font-size:13px;
font-weight:900;
color:#e5e7eb;
transition:.3s;
}

.hero-service-tags a:hover{
border-color:var(--red);
color:#fff;
}

/*=====================
REGISTRATION DESK
======================*/

.reg-search-box{
width:100%;
max-width:760px;
padding:34px;
border-radius:34px;
background:
linear-gradient(145deg,rgba(255,255,255,.11),rgba(255,255,255,.035));
border:1px solid rgba(255,255,255,.13);
box-shadow:0 30px 90px rgba(0,0,0,.45);
position:relative;
overflow:hidden;
}

.reg-search-box:before{
content:"";
position:absolute;
inset:0;
background:
linear-gradient(135deg,rgba(229,9,20,.22),transparent 45%),
radial-gradient(circle at 88% 18%,rgba(255,255,255,.08),transparent 30%);
pointer-events:none;
}

.reg-search-box>*{
position:relative;
z-index:2;
}

.reg-desk-title{
display:flex;
flex-direction:column;
gap:8px;
margin-bottom:20px;
}

.reg-desk-title span{
color:var(--red);
font-size:14px;
font-weight:900;
letter-spacing:2px;
text-transform:uppercase;
}

.reg-desk-title strong{
font-size:clamp(28px,4vw,48px);
line-height:1.05;
letter-spacing:-1px;
max-width:680px;
}

.reg-input-row{
display:grid;
grid-template-columns:1fr 170px;
gap:12px;
margin-bottom:16px;
}

.reg-input-row input{
width:100%;
height:66px;
border:0;
border-radius:18px;
padding:0 22px;
font-size:30px;
font-weight:900;
letter-spacing:2px;
text-transform:uppercase;
background:#facc15;
color:#111;
outline:none;
box-shadow:inset 0 0 0 2px rgba(0,0,0,.15);
}

.reg-input-row input::placeholder{
color:rgba(0,0,0,.45);
}

.reg-input-row button{
height:66px;
border:0;
border-radius:18px;
background:var(--red);
color:#fff;
font-weight:900;
font-size:16px;
cursor:pointer;
}

.reg-desk-actions{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:12px;
margin:18px 0;
}

.reg-search-box small{
display:block;
color:#b7b7b7;
font-weight:700;
line-height:1.5;
}

/*=====================
HERO CARDS
======================*/

.hero-cards{
display:grid;
gap:22px;
}

.feature-card{
display:grid;
grid-template-columns:82px 1fr 30px;
gap:18px;
align-items:center;
padding:28px;
border-radius:32px;
background:
linear-gradient(145deg,rgba(255,255,255,.1),rgba(255,255,255,.035));
border:1px solid rgba(255,255,255,.13);
box-shadow:0 30px 80px rgba(0,0,0,.42);
transition:.3s;
position:relative;
overflow:hidden;
}

.feature-card:before{
content:"";
position:absolute;
inset:0;
background:linear-gradient(135deg,rgba(229,9,20,.2),transparent 46%);
opacity:.75;
pointer-events:none;
}

.feature-card>*{
position:relative;
z-index:2;
}

.feature-card:hover{
transform:translateY(-6px);
border-color:rgba(229,9,20,.9);
}

.hex-badge{
width:82px;
height:82px;
display:grid;
place-items:center;
font-weight:900;
color:var(--red);
background:rgba(229,9,20,.12);
border:1px solid rgba(229,9,20,.45);
clip-path:polygon(25% 5%,75% 5%,100% 50%,75% 95%,25% 95%,0 50%);
}

.feature-card small{
font-weight:900;
color:#c9c9c9;
}

.feature-card h3{
font-size:30px;
line-height:1;
margin:6px 0 8px;
}

.feature-card p{
font-size:15px;
line-height:1.6;
color:#c9c9c9;
}

.feature-card>span{
font-size:42px;
color:var(--red);
}

/*=====================
TRUST PANEL
======================*/

.trust-panel{
margin-top:42px;
display:grid;
grid-template-columns:repeat(5,1fr);
border-radius:32px;
overflow:hidden;
background:rgba(12,12,12,.9);
border:1px solid rgba(255,255,255,.12);
box-shadow:0 25px 80px rgba(0,0,0,.5);
}

.trust-panel>div{
padding:24px;
border-right:1px solid rgba(255,255,255,.08);
background:rgba(255,255,255,.03);
}

.trust-panel>div:last-child{
border-right:0;
}

.trust-panel b{
display:grid;
place-items:center;
width:48px;
height:48px;
border-radius:16px;
background:rgba(229,9,20,.13);
border:1px solid rgba(229,9,20,.35);
color:var(--red);
margin-bottom:14px;
}

.trust-panel h4{
font-size:18px;
margin-bottom:8px;
}

.trust-panel p{
font-size:14px;
color:#b7b7b7;
line-height:1.5;
}

/*=====================
SECTIONS
======================*/

.section{
padding:100px 0;
position:relative;
}

.section-heading{
max-width:850px;
margin:0 auto 58px;
text-align:center;
}

.section-heading span,
.red-label{
display:inline-block;
color:var(--red);
font-size:13px;
font-weight:900;
letter-spacing:2px;
text-transform:uppercase;
margin-bottom:16px;
}

.section-heading h2,
.why-section h2,
.mot-section h2,
.quote-section h2,
.contact-strip h2{
font-size:clamp(36px,5vw,64px);
line-height:1.05;
letter-spacing:-1px;
margin-bottom:20px;
}

.section-heading p,
.why-section p,
.mot-section p,
.quote-section p{
color:#c9c9c9;
font-size:18px;
line-height:1.8;
}

/*=====================
SERVICES
======================*/

.services-section{
background:
radial-gradient(circle at 12% 20%,rgba(229,9,20,.12),transparent 26%),
#070707;
}

.services-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:24px;
}

.service-card{
min-height:300px;
padding:34px;
border-radius:30px;
background:
linear-gradient(145deg,rgba(255,255,255,.095),rgba(255,255,255,.03));
border:1px solid rgba(255,255,255,.13);
box-shadow:0 25px 75px rgba(0,0,0,.4);
position:relative;
overflow:hidden;
transition:.3s;
}

.service-card:before{
content:"";
position:absolute;
inset:0;
background:linear-gradient(135deg,rgba(229,9,20,.2),transparent 45%);
opacity:.45;
}

.service-card>*{
position:relative;
z-index:2;
}

.service-card:hover{
transform:translateY(-8px);
border-color:rgba(229,9,20,.85);
}

.service-card b{
width:64px;
height:64px;
display:grid;
place-items:center;
border-radius:20px;
background:rgba(229,9,20,.13);
border:1px solid rgba(229,9,20,.42);
color:var(--red);
margin-bottom:30px;
}

.service-card h3{
font-size:26px;
margin-bottom:14px;
}

.service-card p{
font-size:16px;
line-height:1.75;
color:#c9c9c9;
margin-bottom:22px;
}

.service-card a{
color:var(--red);
font-weight:900;
}
/*=====================
WHY SECTION
======================*/

.why-section{
background:
radial-gradient(circle at 80% 18%,rgba(229,9,20,.18),transparent 28%),
radial-gradient(circle at 10% 86%,rgba(255,255,255,.055),transparent 25%),
#050505;
border-top:1px solid rgba(255,255,255,.06);
border-bottom:1px solid rgba(255,255,255,.06);
}

.why-grid{
display:grid;
grid-template-columns:1fr .55fr .45fr;
gap:34px;
align-items:center;
}

.why-grid>div:first-child{
max-width:680px;
}

.why-grid p{
margin-bottom:28px;
}

.stats-stack{
display:grid;
gap:18px;
}

.stats-stack>div{
padding:30px;
border-radius:28px;
background:
linear-gradient(145deg,rgba(255,255,255,.095),rgba(255,255,255,.03));
border:1px solid rgba(255,255,255,.13);
box-shadow:0 25px 75px rgba(0,0,0,.38);
}

.stats-stack b{
display:block;
font-size:clamp(42px,5vw,66px);
color:var(--red);
line-height:1;
margin-bottom:10px;
}

.stats-stack span{
font-weight:900;
color:#e5e5e5;
}

.quality-card{
min-height:380px;
border-radius:34px;
display:grid;
place-items:center;
background:
radial-gradient(circle at 50% 50%,rgba(229,9,20,.22),transparent 46%),
linear-gradient(145deg,rgba(255,255,255,.08),rgba(255,255,255,.025));
border:1px solid rgba(255,255,255,.13);
box-shadow:0 30px 90px rgba(0,0,0,.42);
}

.quality-card>div{
width:220px;
height:220px;
border-radius:999px;
display:grid;
place-items:center;
text-align:center;
background:#0b0b0b;
border:2px solid rgba(229,9,20,.72);
box-shadow:
0 0 0 12px rgba(229,9,20,.06),
0 0 60px rgba(229,9,20,.32);
}

.quality-card strong{
font-size:26px;
letter-spacing:2px;
}

.quality-card span{
display:block;
color:var(--red);
font-size:14px;
font-weight:900;
letter-spacing:2px;
}

/*=====================
SPLIT / FORMS
======================*/

.split{
display:grid;
grid-template-columns:.92fr 1.08fr;
gap:42px;
align-items:start;
}

.mot-section{
background:
radial-gradient(circle at 78% 18%,rgba(229,9,20,.16),transparent 30%),
#070707;
}

.quote-section{
background:
radial-gradient(circle at 20% 18%,rgba(229,9,20,.13),transparent 30%),
#050505;
}

.info-panel,
.form-card{
position:relative;
overflow:hidden;
border-radius:34px;
padding:38px;
background:
linear-gradient(145deg,rgba(255,255,255,.105),rgba(255,255,255,.032));
border:1px solid rgba(255,255,255,.14);
box-shadow:0 35px 100px rgba(0,0,0,.45);
}

.info-panel:before,
.form-card:before{
content:"";
position:absolute;
inset:0;
background:
linear-gradient(135deg,rgba(229,9,20,.16),transparent 42%),
radial-gradient(circle at 90% 15%,rgba(255,255,255,.07),transparent 28%);
pointer-events:none;
}

.info-panel>*,
.form-card>*{
position:relative;
z-index:2;
}

.info-panel p{
margin-bottom:24px;
}

.check-list{
list-style:none;
display:grid;
gap:13px;
margin:28px 0;
}

.check-list li{
padding:15px 17px;
border-radius:16px;
background:rgba(255,255,255,.075);
border:1px solid rgba(255,255,255,.12);
color:#f3f3f3;
font-weight:900;
}

.check-list li:before{
content:"✓ ";
color:var(--red);
}

.form-card h3{
font-size:32px;
margin-bottom:24px;
}

.form-row{
display:grid;
grid-template-columns:repeat(2,1fr);
gap:18px;
}

.form-card label{
display:block;
font-weight:900;
margin:15px 0 8px;
color:#f5f5f5;
}

.form-card input,
.form-card select,
.form-card textarea{
width:100%;
padding:16px;
border-radius:15px;
border:1px solid rgba(255,255,255,.17);
background:rgba(0,0,0,.48);
color:#fff;
font-size:16px;
outline:none;
}

.form-card input:focus,
.form-card select:focus,
.form-card textarea:focus{
border-color:var(--red);
box-shadow:0 0 0 4px rgba(229,9,20,.16);
}

.form-card option{
color:#111;
}

.form-card textarea{
min-height:140px;
resize:vertical;
}

.consent{
display:flex!important;
gap:10px;
align-items:flex-start;
color:#d8d8d8!important;
line-height:1.5;
}

.consent input{
width:auto;
margin-top:4px;
}
/*=====================
CONTACT
======================*/

.contact-section{
background:
radial-gradient(circle at 82% 18%,rgba(229,9,20,.18),transparent 28%),
#070707;
}

.contact-strip{
display:grid;
grid-template-columns:1.4fr repeat(3,1fr);
gap:20px;
align-items:stretch;
}

.contact-strip>div,
.contact-strip>a{
padding:30px;
border-radius:28px;
background:
linear-gradient(145deg,rgba(255,255,255,.095),rgba(255,255,255,.032));
border:1px solid rgba(255,255,255,.13);
box-shadow:0 28px 80px rgba(0,0,0,.38);
}

.contact-strip h2 span{
color:var(--red);
}

.contact-strip b{
display:block;
color:var(--red);
font-size:18px;
margin-bottom:10px;
}

.contact-strip small{
color:#d0d0d0;
font-weight:800;
}

/*=====================
FLOATING ACTIONS
======================*/

.floating-actions{
position:fixed;
right:18px;
bottom:18px;
z-index:120;
display:flex;
flex-direction:column;
gap:10px;
}

/*=====================
FOOTER
======================*/

.footer{
background:#000;
color:#fff;
padding:60px 0 24px;
border-top:1px solid rgba(255,255,255,.1);
}

.footer-grid{
display:grid;
grid-template-columns:1.3fr 1fr 1fr 1fr;
gap:34px;
}

.footer-brand{
margin-bottom:18px;
}

.footer h3{
margin-bottom:18px;
}

.footer p{
color:#c7c7c7;
line-height:1.7;
}

.footer a{
display:block;
color:#e5e5e5;
margin-bottom:10px;
font-weight:800;
}

.footer a:hover{
color:var(--red);
}

.footer-bottom{
border-top:1px solid rgba(255,255,255,.12);
margin-top:34px;
padding-top:20px;
color:#b8b8b8;
}

/*=====================
MOBILE PROFIT LAYOUT
======================*/

@media(max-width:1120px){
.nav-inner{
flex-wrap:wrap;
}

.nav-links{
order:3;
width:100%;
justify-content:center;
}

.hero-grid,
.split,
.why-grid{
grid-template-columns:1fr;
}

.trust-panel,
.services-grid{
grid-template-columns:repeat(2,1fr);
}

.contact-strip,
.footer-grid{
grid-template-columns:1fr 1fr;
}

.quality-card{
min-height:260px;
}
}

@media(max-width:760px){
.container{
width:min(100% - 24px,1320px);
}

.topbar-inner{
align-items:flex-start;
flex-direction:column;
padding:12px 0;
}

.topbar-services{
gap:10px;
}

.topbar-services a{
padding:8px 10px;
border-radius:999px;
background:rgba(255,255,255,.06);
}

.nav-inner{
min-height:auto;
padding:16px 0;
}

.brand{
font-size:24px;
}

.nav-links{
display:none;
}

.nav-actions{
width:100%;
display:grid;
grid-template-columns:1fr 1fr;
gap:10px;
}

.nav-actions .btn{
width:100%;
padding:14px 12px;
}

.hero{
padding:34px 0 45px;
}

.hero-grid{
gap:26px;
}

.kicker{
font-size:12px;
line-height:1.5;
}

.hero-service-tags{
gap:8px;
}

.hero-service-tags a{
font-size:12px;
padding:9px 10px;
}

.reg-search-box{
padding:22px;
border-radius:26px;
}

.reg-desk-title strong{
font-size:26px;
}

.reg-input-row{
grid-template-columns:1fr;
}

.reg-input-row input{
height:62px;
font-size:26px;
text-align:center;
}

.reg-input-row button{
height:56px;
}

.reg-desk-actions{
grid-template-columns:1fr;
}

.feature-card{
grid-template-columns:1fr;
padding:24px;
}

.feature-card>span{
display:none;
}

.hex-badge{
width:70px;
height:70px;
}

.trust-panel,
.services-grid,
.stats-stack,
.form-row,
.contact-strip,
.footer-grid{
grid-template-columns:1fr;
}

.trust-panel{
margin-top:26px;
}

.section{
padding:70px 0;
}

.section-heading h2,
.why-section h2,
.mot-section h2,
.quote-section h2,
.contact-strip h2{
font-size:34px;
}

.info-panel,
.form-card{
padding:26px;
border-radius:28px;
}

.floating-actions{
position:fixed;
left:12px;
right:12px;
bottom:12px;
z-index:9999;
display:grid;
grid-template-columns:repeat(3,1fr);
gap:8px;
}

.floating-actions .btn{
width:100%;
padding:14px 8px;
font-size:13px;
border-radius:999px;
}

body{
padding-bottom:74px;
}
}
