/* ========= RESET ========= */
*{
margin:0;
padding:0;
box-sizing:border-box;
font-family:'Inter','Segoe UI',sans-serif;
}

body{
padding-top:110px;
background:#f7f9f8;
color:#1f2937;
}

/* ========= PREMIUM DOCTOR COLORS ========= */
:root{
--primary:#7b2d3a;   /* Royal Wine */
--dark:#1e2a44;      /* Deep Navy */
--accent:#d4a373;    /* Soft Gold */
--text:#1f2937;
}

/* ========= TOP STRIP ========= */
.top-strip{
position:fixed;
top:0;
left:0;
width:100%;
height:32px;
background:linear-gradient(90deg,#4a1e28,#8a3243);
display:flex;
align-items:center;
justify-content:center;
z-index:2000;
}

.text-slider{
position:absolute;
left:50%;
transform:translateX(-50%);
width:70%;
height:18px;
overflow:hidden;
text-align:center;
}

.text-slider span{
position:absolute;
left:50%;
transform:translateX(-50%);
white-space:nowrap;
opacity:0;
color:#fff;
font-size:13px;
font-weight:500;
}

/* animation */
.text-slider span:nth-child(1){animation:slide1 12s infinite;}
.text-slider span:nth-child(2){animation:slide2 12s infinite;}
.text-slider span:nth-child(3){animation:slide3 12s infinite;}

@keyframes slide1{
0%{opacity:0;transform:translateX(-50%) translateX(-120%);}
10%,30%{opacity:1;transform:translateX(-50%) translateX(0);}
40%{opacity:0;transform:translateX(-50%) translateX(120%);}
100%{opacity:0;}
}
@keyframes slide2{
0%,33%{opacity:0;}
43%{opacity:0;transform:translateX(-50%) translateX(-120%);}
53%,73%{opacity:1;transform:translateX(-50%) translateX(0);}
83%{opacity:0;transform:translateX(-50%) translateX(120%);}
100%{opacity:0;}
}
@keyframes slide3{
0%,66%{opacity:0;}
76%{opacity:0;transform:translateX(-50%) translateX(-120%);}
86%,96%{opacity:1;transform:translateX(-50%) translateX(0);}
100%{opacity:0;transform:translateX(-50%) translateX(120%);}
}

/* SOCIAL */
.top-social{
position:absolute;
right:15px;
display:flex;
gap:12px;
}

.top-social a{
color:#fff;
font-size:14px;
transition:.3s;
}

.top-social a:hover{
color:#d1fae5;
transform:translateY(-2px);
}

/* ========= HEADER ========= */
.main-header{
position:fixed;
top:32px;
left:0;
width:100%;
background:rgba(255,255,255,.95);
backdrop-filter:blur(14px);
padding:14px 55px;
display:flex;
justify-content:space-between;
align-items:center;
box-shadow:0 2px 10px rgba(0,0,0,.04);
z-index:1500;
}

.logo{
font-size:26px;
font-weight:700;
color:var(--dark);
}

.menu{
display:flex;
list-style:none;
gap:34px;
}

.menu li a{
font-size:15px;
font-weight:600;
color:#374151;
transition:.25s;
}

.menu li a:hover{
color:var(--primary);
}

/* ========= SAAS BUTTON ========= */
.btn-primary{
background:linear-gradient(135deg,#a03c4d,#7b2d3a);
color:#fff;
padding:11px 26px;
border-radius:12px;
font-weight:600;
box-shadow:0 10px 24px rgba(123,45,58,.25);
transition:.3s;
text-decoration:none;
}

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

/* ========= HERO ========= */
.hero{
min-height:calc(100vh - 120px);
display:flex;
align-items:center;
justify-content:space-between;
padding:0 70px;
background:
radial-gradient(circle at 85% 15%, rgba(123,45,58,0.10) 0%, transparent 55%),
radial-gradient(circle at 15% 90%, rgba(123,45,58,0.06) 0%, transparent 60%),
linear-gradient(180deg,#ffffff 0%,#fdf9f9 100%);
}

.hero-left{width:52%;}

.badge{
display:inline-block;
padding:7px 14px;
background:#f3ebed;
color:var(--primary);
font-size:13px;
font-weight:600;
border-radius:50px;
margin-bottom:18px;
}

.slide h1{
font-size:52px;
line-height:1.2;
font-weight:800;
color:#3a3a3a;
margin-bottom:18px;
}

.slide p{
font-size:19px;
line-height:1.7;
color:#374151;
max-width:560px;
margin-bottom:30px;
}

.highlight{
color:var(--primary);
font-weight:700;
}

.hero-buttons{
display:flex;
gap:16px;
}

.btn-outline{
border:2px solid var(--primary);
color:var(--primary);
padding:10px 24px;
border-radius:12px;
font-weight:600;
text-decoration:none;
transition:.3s;
}

.btn-outline:hover{
background:var(--primary);
color:#fff;
}

/* HERO IMAGE */
.hero-right{
width:48%;
display:flex;
justify-content:center;
}

.video-box{
width:530px;
height:330px;
border-radius:24px;
overflow:hidden;
background:#fff;
box-shadow:0 20px 45px rgba(30,42,68,.12);
}

.video-box img{
width:100%;
height:100%;
object-fit:cover;
}

/* ========= MOBILE ========= */
@media(max-width:768px){

body{padding-top:100px;}

.menu{display:none;}
.main-header{padding:12px 16px;}
.logo{font-size:21px;}
.top-social{display:none;}

.text-slider{width:90%;}
.text-slider span{font-size:12px;}

.hero{
flex-direction:column;
padding:60px 20px 30px;
}

.hero-left,.hero-right{width:100%;}

.slide h1{font-size:34px;}
.slide p{font-size:15px;}

.hero-buttons{
flex-direction:column;
margin-bottom:26px;
}

.btn-primary,.btn-outline{
width:100%;
text-align:center;
}

.video-box{
width:100%;
height:230px;
border-radius:18px;
}
}