/* itel Subho Utsav — Diwali theme ("Yeh Diwali itel Wali") */
:root{
  --plum:#2B0B4E; --purple:#4E1D86; --violet:#7A2A9E; --magenta:#B8177A; --rani:#E3146E;
  --brand:#ED1651; --brand-d:#C20E4A;
  --sindoor:#E3146E; --sindoor-d:#B8105C; --maroon:#4E1D86; --maroon-2:#7A2A9E;
  --gold:#D9A13A; --gold-l:#FFD978; --gold-p:#EBD3A0; --yellow:#FFEF3A;
  --ivory:#FFF7EE; --paper:#FFFDF9; --ink:#24113A; --muted:#6F5C80; --line:#E7D4B4;
}
*{box-sizing:border-box;margin:0;padding:0}
[hidden]{display:none!important}
html{scroll-behavior:smooth}
body{font-family:'Poppins',system-ui,sans-serif;color:var(--ink);line-height:1.6;min-height:100vh;
  background-color:var(--ivory);
  background-image:
    radial-gradient(circle at 0 0,rgba(217,161,58,.12) 0,transparent 34%),
    radial-gradient(circle at 100% 45%,rgba(184,23,122,.07) 0,transparent 30%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='96'%3E%3Cg fill='none' stroke='%23D9A13A' stroke-opacity='.16'%3E%3Ccircle cx='48' cy='48' r='6'/%3E%3Ccircle cx='48' cy='48' r='15' stroke-dasharray='2 4'/%3E%3Cpath d='M48 22Q52 30 48 36Q44 30 48 22ZM48 74Q52 66 48 60Q44 66 48 74ZM22 48Q30 44 36 48Q30 52 22 48ZM74 48Q66 44 60 48Q66 52 74 48Z'/%3E%3C/g%3E%3C/svg%3E")}
a{color:var(--rani)}
.serif{font-family:'Playfair Display',Georgia,serif}

/* ---------- Top bar + bunting border ---------- */
.topbar{background:#fff;display:flex;align-items:center;justify-content:center;gap:14px;padding:10px 16px;position:relative}
.topbar-logo img{height:52px;width:auto;max-width:180px;object-fit:contain;display:block}
.topbar-tag{font-family:'Poppins',sans-serif;font-weight:600;font-size:12px;letter-spacing:.22em;color:var(--purple);text-transform:uppercase;border-left:1px solid var(--line);padding-left:14px}
.paar{height:18px;background:var(--plum) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='18'%3E%3Cpath d='M0 2H60' stroke='%23FFD978' stroke-width='1.4'/%3E%3Cpath d='M3 2.5H17L10 15Z' fill='%234FB3E8'/%3E%3Cpath d='M23 2.5H37L30 15Z' fill='%23F6A93B'/%3E%3Cpath d='M43 2.5H57L50 15Z' fill='%23E3146E'/%3E%3C/svg%3E") repeat-x;background-size:60px 18px}

/* ---------- Hero ---------- */
.hero{position:relative;overflow:hidden;text-align:center;color:#fff;padding:176px 16px 0;
  background:
    radial-gradient(ellipse at 60% 78%,rgba(240,24,128,.9) 0%,rgba(240,24,128,0) 55%),
    linear-gradient(180deg,#4B1C86 0%,#6A1F98 38%,#9A1A8C 72%,#C0177F 100%)}
.hero::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.9;
  background-image:radial-gradient(circle,#FFE8B0 1.2px,transparent 1.6px),radial-gradient(circle,#FFE8B0 .9px,transparent 1.3px);
  background-size:120px 110px,70px 90px;background-position:10px 40px,40px 10px;
  -webkit-mask-image:linear-gradient(180deg,#000 0,#000 45%,transparent 80%);mask-image:linear-gradient(180deg,#000 0,#000 45%,transparent 80%);
  animation:twinkle 4s ease-in-out infinite alternate}
.hero .lanterns{position:absolute;left:0;top:0;width:100%;height:170px;pointer-events:none;z-index:1}
.lanterns .sway{animation:sway 5s ease-in-out infinite alternate}
.lanterns .flame{animation:flick 1.4s ease-in-out infinite alternate;transform-box:fill-box;transform-origin:50% 100%}
.lanterns .glow{animation:glow 2.4s ease-in-out infinite alternate}
.hero .mandala{position:absolute;width:520px;height:520px;right:-170px;top:280px;color:#FFB86B;opacity:.22;animation:spin 120s linear infinite;pointer-events:none}
.hero .mandala.m2{left:-200px;right:auto;top:520px;width:440px;height:440px;color:#FF8FC4;animation-direction:reverse}
.hero > *:not(.mandala):not(.lanterns):not(.arch):not(.hero-glow){position:relative;z-index:2}
.eyebrow{font-family:'Poppins',sans-serif;color:#FFE8B0;letter-spacing:.24em;text-transform:uppercase;font-size:12.5px;font-weight:600}
.hero .tagline{display:block;width:min(560px,92%);height:auto;margin:14px auto 6px;filter:drop-shadow(0 12px 26px rgba(30,0,40,.45))}
.hero h1{font-family:'Playfair Display',Georgia,serif;font-weight:800;font-size:clamp(32px,6.2vw,54px);line-height:1.08;max-width:760px;margin:6px auto 12px;text-shadow:0 2px 14px rgba(40,0,50,.35)}
.hero h1 em{font-style:italic;color:var(--gold-l)}
.hero .lead{max-width:600px;margin:0 auto;font-size:16.5px;color:#FBEAF6}
.hero .divider{margin:10px auto 2px}
.cta{display:inline-block;margin:24px 0 4px;padding:14px 34px;border-radius:40px;text-decoration:none;font:700 16.5px 'Poppins',sans-serif;
  color:var(--plum);background:linear-gradient(180deg,#FFE58F,#E9AE3E);border:1px solid #FFEDB5;
  box-shadow:0 0 0 4px rgba(255,217,120,.25),0 10px 24px rgba(30,0,40,.35)}
.cta:hover{filter:brightness(1.05)}
.hero-phones{position:relative;display:block;width:min(380px,74%);height:auto;margin:30px auto -6px;filter:drop-shadow(0 22px 26px rgba(30,0,40,.5))}
.hero-glow{position:absolute;left:50%;bottom:30px;width:560px;height:220px;margin-left:-280px;border-radius:50%;background:radial-gradient(closest-side,rgba(255,217,120,.5),transparent);z-index:1}
.hero .arch{position:relative;display:block;width:100%;height:70px;margin-top:-40px;z-index:3}
.hero-pad{height:20px}
.hero.small{padding:150px 16px 0}
.hero.small h1{font-size:clamp(28px,5.6vw,44px)}
.hero.small .arch{margin-top:24px}

/* ---------- Diya divider ---------- */
.divider{display:flex;align-items:center;justify-content:center;gap:12px;margin:34px auto}
.divider::before,.divider::after{content:"";height:1px;width:min(130px,26vw);background:linear-gradient(90deg,transparent,var(--gold))}
.divider::after{background:linear-gradient(90deg,var(--gold),transparent)}
.divider svg{width:62px;height:22px;flex:none;overflow:visible}
.divider .fl{animation:flick 1.6s ease-in-out infinite alternate;transform-box:fill-box;transform-origin:50% 100%}
.hero .divider::before{background:linear-gradient(90deg,transparent,#FFE8B0)}.hero .divider::after{background:linear-gradient(90deg,#FFE8B0,transparent)}

/* ---------- Framed card ---------- */
main{max-width:780px;margin:0 auto;padding:30px 16px 40px}
.frame{position:relative;background-color:var(--paper);border:1px solid var(--gold);border-radius:14px;padding:36px 28px;
  box-shadow:inset 0 0 0 6px var(--paper),inset 0 0 0 7px var(--gold-p),0 16px 36px rgba(60,10,80,.10);
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='44'%3E%3Cg fill='none'%3E%3Cpath d='M6 6H28M6 6V28' stroke='%23D9A13A' stroke-width='1.4'/%3E%3Cpath d='M6 17Q17 17 17 6' stroke='%23E3146E' stroke-width='1.3'/%3E%3C/g%3E%3Ccircle cx='11' cy='11' r='2.6' fill='%237A2A9E'/%3E%3C/svg%3E"),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='44'%3E%3Cg transform='translate(44 0) scale(-1 1)'%3E%3Cg fill='none'%3E%3Cpath d='M6 6H28M6 6V28' stroke='%23D9A13A' stroke-width='1.4'/%3E%3Cpath d='M6 17Q17 17 17 6' stroke='%23E3146E' stroke-width='1.3'/%3E%3C/g%3E%3Ccircle cx='11' cy='11' r='2.6' fill='%237A2A9E'/%3E%3C/g%3E%3C/svg%3E"),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='44'%3E%3Cg transform='translate(0 44) scale(1 -1)'%3E%3Cg fill='none'%3E%3Cpath d='M6 6H28M6 6V28' stroke='%23D9A13A' stroke-width='1.4'/%3E%3Cpath d='M6 17Q17 17 17 6' stroke='%23E3146E' stroke-width='1.3'/%3E%3C/g%3E%3Ccircle cx='11' cy='11' r='2.6' fill='%237A2A9E'/%3E%3C/g%3E%3C/svg%3E"),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='44'%3E%3Cg transform='translate(44 44) scale(-1 -1)'%3E%3Cg fill='none'%3E%3Cpath d='M6 6H28M6 6V28' stroke='%23D9A13A' stroke-width='1.4'/%3E%3Cpath d='M6 17Q17 17 17 6' stroke='%23E3146E' stroke-width='1.3'/%3E%3C/g%3E%3Ccircle cx='11' cy='11' r='2.6' fill='%237A2A9E'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:6px 6px,calc(100% - 6px) 6px,6px calc(100% - 6px),calc(100% - 6px) calc(100% - 6px)}
.st{font-family:'Playfair Display',Georgia,serif;font-weight:800;font-size:clamp(26px,4.8vw,36px);line-height:1.15;color:var(--purple);text-align:center}
.kicker{font-family:'Poppins',sans-serif;color:var(--rani);letter-spacing:.22em;text-transform:uppercase;font-size:12px;text-align:center;font-weight:600;margin-bottom:4px}

/* ---------- Buttons ---------- */
.btn{display:block;width:100%;padding:15px;border-radius:40px;cursor:pointer;text-align:center;text-decoration:none;
  font:700 16.5px 'Poppins',sans-serif;color:#fff;border:1px solid #F7C76A;
  background:linear-gradient(180deg,#F0328A,var(--rani) 45%,#A3127A);box-shadow:inset 0 0 0 3px rgba(255,217,120,.3),0 8px 18px rgba(184,23,122,.32)}
.btn:hover{filter:brightness(1.07)}
.btn:disabled{opacity:.55;cursor:not-allowed}
.btn.gold{color:var(--plum);background:linear-gradient(180deg,#FFE58F,#E9AE3E);border-color:#C98A2E;box-shadow:0 8px 18px rgba(217,161,58,.3)}
.btn.ghost{background:var(--paper);color:var(--ink);border-color:var(--line);box-shadow:none}

/* ---------- Footer ---------- */
.foot{background:#fff;color:var(--purple);text-align:center;padding:26px 16px 30px}
.foot-logo{height:46px;width:auto;display:block;margin:0 auto 12px}
.foot-main{color:var(--purple);font-family:'Poppins',sans-serif;letter-spacing:.1em;font-size:13px;font-weight:600;text-transform:uppercase}
.foot small{display:block;color:var(--muted);margin-top:6px;font-size:12.5px}
.foot a{color:var(--rani)}

@keyframes spin{to{transform:rotate(360deg)}}
@keyframes sway{from{transform:rotate(-2.2deg)}to{transform:rotate(2.2deg)}}
@keyframes flick{from{transform:scale(1,1)}to{transform:scale(.88,1.12)}}
@keyframes glow{from{opacity:.75}to{opacity:1}}
@keyframes twinkle{from{opacity:.55}to{opacity:1}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
@media(max-width:520px){
  .frame{padding:40px 20px 34px}
  .topbar-tag{display:none}
  .hero{padding-top:118px}
  .hero.small{padding-top:112px}
  .hero .lanterns{height:110px}
  .hero .mandala{width:360px;height:360px;right:-150px}
  .hero .arch{height:44px;margin-top:-26px}
}

/* brand name always lowercase 'itel' */
.bw{font-family:'Poppins',system-ui,sans-serif;text-transform:none!important;letter-spacing:.02em;font-weight:700}