/* Deb Hotelier — custom layer over Tailwind CDN */
:root {
    --navy: #06162f;
    --navy-2: #0b2448;
    --gold: #b88b3d;
    --gold-light: #d9b86a;
    --cream: #f7f3ea;
    --ink: #172033;
}

html { scroll-behavior: smooth; }
body { font-family: "DM Sans", sans-serif; }
.font-display { font-family: "Playfair Display", serif; }

.skip-link {
    position: fixed; left: 1rem; top: -4rem; z-index: 100;
    background: white; color: var(--navy); padding: .75rem 1rem;
    border-radius: .75rem; box-shadow: 0 10px 30px rgba(0,0,0,.15);
}
.skip-link:focus { top: 1rem; }

.site-header {
    position: sticky; top: 0; z-index: 50; background: rgba(255,255,255,.94);
    backdrop-filter: blur(18px); border-bottom: 1px solid rgba(15,23,42,.08);
    transition: box-shadow .25s ease, background .25s ease;
}
.site-header.is-scrolled { box-shadow: 0 12px 35px rgba(6,22,47,.09); }
.nav-link { color: #344054; font-size: .875rem; font-weight: 600; transition: color .2s ease; }
.nav-link:hover, .nav-link:focus-visible { color: var(--gold); }

.btn {
    display: inline-flex; align-items: center; justify-content: center; gap: .6rem;
    min-height: 48px; padding: .75rem 1.15rem; border-radius: .8rem;
    font-weight: 700; font-size: .9rem; transition: transform .2s ease, box-shadow .2s ease, background .2s ease, color .2s ease;
}
.btn:hover { transform: translateY(-2px); }
.btn:focus-visible, button:focus-visible, a:focus-visible, input:focus-visible, textarea:focus-visible {
    outline: 3px solid rgba(184,139,61,.35); outline-offset: 3px;
}
.btn-gold { color: #fff; background: var(--gold); box-shadow: 0 12px 30px rgba(184,139,61,.2); }
.btn-gold:hover { background: #9e742f; }
.btn-navy { color: #fff; background: var(--navy); box-shadow: 0 12px 30px rgba(6,22,47,.18); }
.btn-navy:hover { background: var(--navy-2); }
.btn-outline { color: #fff; border: 1px solid rgba(255,255,255,.35); background: rgba(255,255,255,.04); }
.btn-outline:hover { background: rgba(255,255,255,.1); }
.btn-ghost { color: #fff; border: 1px solid rgba(255,255,255,.22); background: rgba(255,255,255,.03); }
.btn-ghost:hover { background: rgba(255,255,255,.08); }

.menu-toggle {
    display: inline-flex; width: 46px; height: 46px; flex-direction: column; align-items: center; justify-content: center;
    gap: 5px; border: 1px solid #dbe2ea; border-radius: .8rem; background: white;
}
.menu-toggle span { width: 19px; height: 2px; background: var(--navy); transition: transform .2s ease, opacity .2s ease; }
.menu-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.menu-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.menu-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
.mobile-menu { border-top: 1px solid #eef1f4; background: white; }
.mobile-menu a:not(.btn) { padding: .85rem 0; color: #344054; font-weight: 600; border-bottom: 1px solid #f0f2f5; }

.hero-section {
    min-height: 720px; display: flex; align-items: center;
    background:
        radial-gradient(circle at 15% 20%, rgba(184,139,61,.14), transparent 28%),
        radial-gradient(circle at 90% 70%, rgba(32,78,125,.28), transparent 32%),
        linear-gradient(135deg, #06162f 0%, #081c39 58%, #0b2a50 100%);
}
.hero-section::before {
    content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .16;
    background-image: linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px);
    background-size: 52px 52px; mask-image: linear-gradient(to right, black, transparent 75%);
}
.hero-orb { position: absolute; border-radius: 999px; filter: blur(2px); border: 1px solid rgba(255,255,255,.06); }
.hero-orb-one { width: 420px; height: 420px; right: -180px; top: -160px; }
.hero-orb-two { width: 280px; height: 280px; left: -160px; bottom: -160px; }
.text-gold-light { color: var(--gold-light); }

.eyebrow, .section-kicker {
    display: inline-flex; align-items: center; gap: .65rem;
    font-size: .72rem; font-weight: 800; letter-spacing: .18em; text-transform: uppercase;
    color: var(--gold);
}
.eyebrow { color: var(--gold-light); }
.eyebrow span { width: 26px; height: 1px; background: currentColor; }

.hero-card {
    position: relative; overflow: hidden; border: 1px solid rgba(255,255,255,.16);
    border-radius: 1.35rem; background: #fff; box-shadow: 0 30px 90px rgba(0,0,0,.32);
}
.hero-card-top { display:flex; align-items:center; gap:.5rem; padding:1rem 1.15rem; font-size:.73rem; font-weight:800; letter-spacing:.11em; text-transform:uppercase; color:#667085; }
.status-dot { width:8px; height:8px; border-radius:50%; background:var(--gold); box-shadow:0 0 0 5px rgba(184,139,61,.12); }
.hotel-visual { position:relative; height:340px; overflow:hidden; background:linear-gradient(180deg,#dfeaf3 0%,#f3efe5 66%,#d9d0c0 100%); }
.hotel-sky { position:absolute; inset:0 0 40%; background:linear-gradient(180deg,rgba(255,255,255,.75),rgba(255,255,255,0)); }
.hotel-building { position:absolute; left:15%; right:15%; bottom:36px; height:245px; border-radius:9px 9px 0 0; background:linear-gradient(100deg,#ece5d8,#fff 35%,#ded6c7); box-shadow:12px 0 28px rgba(0,0,0,.1); padding:22px 20px; }
.hotel-sign { display:inline-block; padding:7px 12px; color:#fff; background:var(--navy); font-size:8px; font-weight:800; letter-spacing:.18em; }
.hotel-windows { display:grid; grid-template-columns:repeat(6,1fr); gap:10px; margin-top:20px; }
.hotel-windows span { height:38px; border:4px solid #d5cbb9; background:linear-gradient(135deg,#9bb1c0,#385a72); }
.hotel-entrance { position:absolute; left:43%; bottom:0; width:16%; height:70px; border:7px solid #d0c5b2; background:#294763; }
.hotel-floor { position:absolute; left:0; right:0; bottom:0; height:38px; background:linear-gradient(#b8aa94,#9e917f); }
.service-figure { position:absolute; bottom:34px; width:22px; height:72px; border-radius:10px 10px 4px 4px; background:var(--navy); }
.service-figure::before { content:""; position:absolute; left:3px; top:-16px; width:16px; height:16px; border-radius:50%; background:#9b6e4a; }
.service-figure-one { left:10%; }
.service-figure-two { right:10%; background:#263f59; }
.hero-card-bottom { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1rem 1.15rem 1.2rem; }
.hero-arrow { display:grid; place-items:center; width:40px; height:40px; border-radius:50%; background:#f6f2e9; color:var(--gold); font-size:1.15rem; }

.trust-item { display:flex; align-items:center; gap:1rem; padding:1.4rem 0; }
.trust-number { font-family:"Playfair Display",serif; font-size:1.8rem; color:var(--navy); }
.trust-icon { display:grid; place-items:center; width:42px; height:42px; border-radius:12px; color:var(--gold); background:#f7f3ea; font-weight:800; }
.trust-item strong, .trust-item small { display:block; }
.trust-item strong { font-size:.88rem; color:var(--navy); }
.trust-item small { margin-top:.15rem; color:#667085; font-size:.76rem; }

.section-pad { padding: 5.5rem 0; }
.section-title { margin-top:.65rem; font-family:"Playfair Display",serif; font-size:clamp(2.2rem,4vw,3.65rem); line-height:1.1; letter-spacing:-.03em; color:var(--navy); }
.section-lead { margin-top:1.1rem; color:#667085; line-height:1.8; }
.about-visual { min-height:460px; position:relative; display:grid; place-items:center; }
.about-card-main {
    position:relative; width:min(100%,460px); min-height:370px; overflow:hidden; border-radius:1.5rem;
    padding:2.4rem; display:flex; flex-direction:column; justify-content:flex-end;
    background:
        linear-gradient(145deg, rgba(6,22,47,.9), rgba(11,36,72,.84)),
        repeating-linear-gradient(45deg, rgba(255,255,255,.06) 0 1px, transparent 1px 13px);
    box-shadow:0 30px 80px rgba(6,22,47,.2);
}
.about-card-main::after { content:"DH"; position:absolute; right:-15px; top:-50px; font-family:"Playfair Display"; font-size:220px; font-weight:700; color:rgba(255,255,255,.04); }
.mini-label { position:absolute; top:2.2rem; left:2.4rem; color:var(--gold-light); font-size:.68rem; font-weight:800; letter-spacing:.22em; }
.about-card-main h3 { position:relative; z-index:1; color:#fff; font-family:"Playfair Display"; font-size:2.5rem; line-height:1.1; }
.about-card-main h3 span { color:var(--gold-light); }
.about-card-main p { position:relative; z-index:1; margin-top:1rem; max-width:300px; color:#cbd5e1; line-height:1.7; }
.about-line { position:relative; z-index:1; width:70px; height:2px; margin:1.3rem 0 0; background:var(--gold); }
.about-floating { position:absolute; right:0; bottom:2rem; display:flex; align-items:center; gap:.8rem; padding:1rem 1.1rem; background:white; border:1px solid #e6e9ed; border-radius:1rem; box-shadow:0 20px 55px rgba(6,22,47,.14); }
.about-floating-icon { display:grid; place-items:center; width:42px; height:42px; border-radius:12px; background:#f7f3ea; color:var(--gold); }
.about-floating strong, .about-floating small { display:block; }
.about-floating strong { color:var(--navy); font-size:.85rem; }
.about-floating small { color:#667085; font-size:.7rem; margin-top:.15rem; }

.service-card { padding:1.5rem; border:1px solid #e8ebef; border-radius:1.1rem; background:#fff; transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.service-card:hover { transform:translateY(-5px); border-color:rgba(184,139,61,.45); box-shadow:0 18px 45px rgba(6,22,47,.08); }
.service-top { display:flex; align-items:center; justify-content:space-between; }
.service-icon { display:grid; place-items:center; width:48px; height:48px; border-radius:14px; background:#f7f3ea; color:var(--gold); font-size:1.25rem; }
.service-no { color:#98a2b3; font-size:.72rem; font-weight:800; letter-spacing:.12em; }
.service-card h3 { margin-top:1.5rem; color:var(--navy); font-size:1.08rem; font-weight:800; }
.service-card p { margin-top:.65rem; color:#667085; font-size:.9rem; line-height:1.75; }
.service-link { display:inline-flex; gap:.5rem; align-items:center; margin-top:1.3rem; color:var(--navy); font-size:.82rem; font-weight:800; }
.service-link:hover { color:var(--gold); }

.steps-grid { display:grid; gap:.9rem; }
.step-card { display:grid; grid-template-columns:auto 1fr; gap:1rem; padding:1.15rem; border:1px solid rgba(255,255,255,.1); border-radius:1rem; background:rgba(255,255,255,.035); }
.step-number { display:grid; place-items:center; width:44px; height:44px; border-radius:12px; color:var(--gold-light); background:rgba(184,139,61,.11); font-size:.72rem; font-weight:900; }
.step-card h3 { color:#fff; font-size:.95rem; font-weight:800; }
.step-card p { margin-top:.35rem; color:#9fb0c5; font-size:.83rem; line-height:1.65; }

.reason-card { min-height:150px; padding:1.3rem; border:1px solid #e6e2d9; border-radius:1rem; background:rgba(255,255,255,.62); transition:transform .2s ease, background .2s ease; }
.reason-card:hover { transform:translateY(-4px); background:#fff; }
.reason-icon { display:grid; place-items:center; width:42px; height:42px; border-radius:12px; background:var(--navy); color:var(--gold-light); font-size:.75rem; font-weight:900; }
.reason-card h3 { margin-top:1rem; color:var(--navy); font-size:.88rem; line-height:1.45; font-weight:800; }

.kolkata-map { position:relative; min-height:440px; overflow:hidden; border-radius:1.5rem; background:linear-gradient(145deg,#06162f,#0d3156); box-shadow:0 25px 75px rgba(6,22,47,.18); }
.map-grid { position:absolute; inset:0; opacity:.35; background-image:linear-gradient(rgba(255,255,255,.08) 1px, transparent 1px),linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px); background-size:45px 45px; }
.map-route { position:absolute; height:2px; background:linear-gradient(90deg,transparent,var(--gold-light),transparent); transform-origin:left center; opacity:.65; }
.route-a { left:22%; top:48%; width:58%; transform:rotate(-14deg); }
.route-b { left:28%; top:64%; width:48%; transform:rotate(13deg); }
.map-pin { position:absolute; display:flex; align-items:center; gap:.55rem; color:#fff; font-size:.75rem; font-weight:800; }
.map-pin span { width:12px; height:12px; border-radius:50%; background:var(--gold-light); box-shadow:0 0 0 7px rgba(217,184,106,.12),0 0 22px rgba(217,184,106,.65); }
.pin-salt { left:58%; top:31%; }
.pin-kesh { left:66%; top:53%; }
.pin-minto { left:34%; top:65%; }
.map-city { position:absolute; left:8%; bottom:9%; font-family:"Playfair Display"; color:rgba(255,255,255,.1); font-size:5.5rem; letter-spacing:.08em; }
.map-caption { position:absolute; right:8%; bottom:9%; color:#aebdcd; font-size:.68rem; text-transform:uppercase; letter-spacing:.16em; }

.cta-section { background:linear-gradient(135deg,#081c39,#0b2a50); position:relative; overflow:hidden; }
.cta-section::after { content:""; position:absolute; width:480px; height:480px; border:1px solid rgba(255,255,255,.07); border-radius:50%; right:-170px; top:-190px; }

.contact-item { display:flex; align-items:flex-start; gap:.9rem; padding:1rem; border:1px solid #e7e1d7; border-radius:.9rem; background:rgba(255,255,255,.6); }
.contact-item > span { display:grid; place-items:center; flex:none; width:40px; height:40px; border-radius:11px; background:var(--navy); color:var(--gold-light); }
.contact-item small, .contact-item strong { display:block; }
.contact-item small { color:#8a93a1; font-size:.7rem; text-transform:uppercase; letter-spacing:.11em; }
.contact-item strong { margin-top:.2rem; color:var(--navy); font-size:.85rem; overflow-wrap:anywhere; }

.contact-form { padding:1.5rem; border:1px solid #e5e0d8; border-radius:1.25rem; background:#fff; box-shadow:0 20px 60px rgba(6,22,47,.06); }
.field label { display:block; margin-bottom:.45rem; color:var(--navy); font-size:.8rem; font-weight:800; }
.field label span { color:#b42318; }
.field input, .field textarea {
    width:100%; border:1px solid #d9dee6; border-radius:.75rem; background:#fff; padding:.78rem .9rem;
    color:var(--ink); font-size:.9rem; transition:border-color .2s ease, box-shadow .2s ease;
}
.field input::placeholder, .field textarea::placeholder { color:#a3aab5; }
.field input:focus, .field textarea:focus { border-color:var(--gold); box-shadow:0 0 0 4px rgba(184,139,61,.1); outline:none; }
.field.invalid input, .field.invalid textarea { border-color:#d92d20; }
.error-message { display:block; min-height:1rem; margin-top:.25rem; color:#b42318; font-size:.7rem; }

.faq-list { border-top:1px solid #e5e7eb; }
.faq-item { border-bottom:1px solid #e5e7eb; }
.faq-question { display:flex; align-items:center; justify-content:space-between; gap:1rem; width:100%; padding:1.25rem 0; color:var(--navy); text-align:left; font-weight:800; }
.faq-plus { display:grid; place-items:center; flex:none; width:30px; height:30px; border:1px solid #dfe3e8; border-radius:50%; color:var(--gold); font-size:1.1rem; transition:transform .2s ease, background .2s ease; }
.faq-question[aria-expanded="true"] .faq-plus { transform:rotate(45deg); background:#f7f3ea; }
.faq-answer { padding:0 2.5rem 1.2rem 0; color:#667085; font-size:.9rem; line-height:1.8; }

.final-cta { background:linear-gradient(180deg,#f7f3ea,#fff); border-top:1px solid #e8e2d8; }

.footer-heading { margin-bottom:1rem; color:#fff; font-size:.78rem; text-transform:uppercase; letter-spacing:.14em; }
.footer-link:hover { color:#fff; }

.reveal { opacity:0; transform:translateY(18px); transition:opacity .7s ease, transform .7s ease; }
.reveal.is-visible { opacity:1; transform:none; }
.delay-1 { transition-delay:.08s; }
.delay-2 { transition-delay:.16s; }

@media (max-width: 767px) {
    .section-pad { padding:4.2rem 0; }
    .hero-section { min-height:auto; }
    .hero-card { margin-top:.5rem; }
    .hotel-visual { height:290px; }
    .about-visual { min-height:390px; }
    .about-floating { right:0; bottom:0; }
    .kolkata-map { min-height:360px; }
    .map-city { font-size:3.7rem; }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior:auto; }
    *, *::before, *::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
    .reveal { opacity:1; transform:none; }
}