/* =========================================================
   LUXXURIOS OÜ — Luxury Black & Gold Design
   ========================================================= */

:root{
  --black: #060606;
  --black-soft: #0d0d0d;
  --black-elevated: #131313;
  --gold: #d4af37;
  --gold-light: #f4e4a6;
  --gold-dark: #9c7a24;
  --cream: #f5f0e6;
  --grey: #a8a49a;
  --border-gold: rgba(212,175,55,0.25);
  --font-display: 'Marcellus', 'Cormorant Garamond', serif;
  --font-serif: 'Cormorant Garamond', serif;
  --font-body: 'Jost', sans-serif;
}

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

html{ scroll-behavior:smooth; }

body{
  background:var(--black);
  color:var(--cream);
  font-family:var(--font-body);
  font-weight:300;
  line-height:1.7;
  overflow-x:hidden;
}

.container{
  max-width:1200px;
  margin:0 auto;
  padding:0 32px;
}

a{ color:inherit; text-decoration:none; }
ul{ list-style:none; }
img{ max-width:100%; display:block; }

.gold-text{
  background:linear-gradient(120deg, var(--gold-dark), var(--gold-light), var(--gold));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

/* ===== Custom cursor glow ===== */
.cursor-glow{
  position:fixed;
  width:400px; height:400px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(212,175,55,0.08), transparent 70%);
  pointer-events:none;
  z-index:1;
  transform:translate(-50%,-50%);
  transition:opacity .3s;
  left:50%; top:50%;
}

/* ===== Buttons ===== */
.btn{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:16px 36px;
  font-family:var(--font-body);
  font-size:0.85rem;
  letter-spacing:1.5px;
  text-transform:uppercase;
  border-radius:2px;
  cursor:pointer;
  border:1px solid transparent;
  transition:all .35s ease;
  white-space:nowrap;
}

.btn-gold{
  background:linear-gradient(120deg, var(--gold-dark), var(--gold), var(--gold-light));
  color:#111;
  font-weight:500;
  box-shadow:0 4px 25px rgba(212,175,55,0.25);
}
.btn-gold:hover{
  transform:translateY(-3px);
  box-shadow:0 10px 30px rgba(212,175,55,0.4);
}

.btn-outline{
  border-color:var(--border-gold);
  color:var(--cream);
  background:transparent;
}
.btn-outline:hover{
  border-color:var(--gold);
  background:rgba(212,175,55,0.08);
  color:var(--gold-light);
}

.btn-large{
  padding:20px 48px;
  font-size:0.95rem;
  margin-top:20px;
}
.btn-small{
  padding:10px 22px;
  font-size:0.72rem;
}

/* ===== Section titles ===== */
.section-kicker{
  font-family:var(--font-body);
  font-size:0.78rem;
  letter-spacing:4px;
  text-transform:uppercase;
  color:var(--gold);
  margin-bottom:18px;
}
.section-kicker.center{ text-align:center; }

.section-title{
  font-family:var(--font-display);
  font-size:clamp(2rem, 4vw, 2.8rem);
  font-weight:400;
  line-height:1.25;
  margin-bottom:24px;
  color:var(--cream);
}
.section-title.center{ text-align:center; max-width:750px; margin-left:auto; margin-right:auto; }

/* =========================================================
   HEADER
   ========================================================= */
.site-header{
  position:fixed;
  top:0; left:0; right:0;
  z-index:1000;
  padding:22px 0;
  transition:all .4s ease;
  background:transparent;
}
.site-header.scrolled{
  background:rgba(6,6,6,0.9);
  backdrop-filter:blur(12px);
  padding:14px 0;
  border-bottom:1px solid var(--border-gold);
}

.header-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
}

.logo{
  font-family:var(--font-display);
  font-size:1.4rem;
  letter-spacing:3px;
  color:var(--cream);
}
.logo span{ color:var(--gold); }

.main-nav{
  display:flex;
  align-items:center;
  gap:38px;
}
.main-nav a{
  font-size:0.85rem;
  letter-spacing:1px;
  text-transform:uppercase;
  color:var(--cream);
  position:relative;
  padding-bottom:4px;
  transition:color .3s;
}
.main-nav a:not(.nav-cta)::after{
  content:'';
  position:absolute;
  left:0; bottom:0;
  width:0; height:1px;
  background:var(--gold);
  transition:width .3s ease;
}
.main-nav a:not(.nav-cta):hover{ color:var(--gold-light); }
.main-nav a:not(.nav-cta):hover::after{ width:100%; }

.nav-cta{
  border:1px solid var(--border-gold);
  padding:10px 22px;
  border-radius:2px;
}
.nav-cta:hover{
  background:var(--gold);
  color:#111 !important;
  border-color:var(--gold);
}

.nav-toggle{
  display:none;
  flex-direction:column;
  gap:5px;
  background:none;
  border:none;
  cursor:pointer;
  z-index:1100;
}
.nav-toggle span{
  width:26px; height:1px;
  background:var(--gold);
  transition:all .3s;
}

/* =========================================================
   HERO
   ========================================================= */
.hero{
  position:relative;
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}
.hero-bg{
  position:absolute;
  inset:0;
  background:url('../images/hero-bg.jpg') center/cover no-repeat;
  transform:scale(1.05);
}
.hero-overlay{
  position:absolute;
  inset:0;
  background:
    radial-gradient(ellipse at center, rgba(6,6,6,0.55) 0%, rgba(6,6,6,0.85) 65%, rgba(6,6,6,0.98) 100%);
}
.hero-particles{
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:1;
}
.particle{
  position:absolute;
  width:3px; height:3px;
  background:var(--gold-light);
  border-radius:50%;
  opacity:0.6;
  animation:floatUp linear infinite;
}
@keyframes floatUp{
  from{ transform:translateY(0); opacity:0; }
  10%{ opacity:0.8; }
  90%{ opacity:0.4; }
  to{ transform:translateY(-100vh); opacity:0; }
}

.hero-content{
  position:relative;
  z-index:2;
  text-align:center;
  max-width:900px;
}

.hero-kicker{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:16px;
  color:var(--gold);
  font-size:0.8rem;
  letter-spacing:4px;
  margin-bottom:28px;
  animation:fadeInUp 1s ease .1s both;
}
.hero-kicker .line{
  width:40px; height:1px;
  background:var(--gold);
  display:inline-block;
}

.hero-title{
  font-family:var(--font-display);
  font-size:clamp(2.5rem, 6vw, 4.6rem);
  line-height:1.2;
  font-weight:400;
  color:var(--cream);
  margin-bottom:28px;
  animation:fadeInUp 1s ease .25s both;
}

.hero-subtitle{
  font-size:1.1rem;
  color:var(--grey);
  max-width:640px;
  margin:0 auto 44px;
  animation:fadeInUp 1s ease .4s both;
}

.hero-actions{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:22px;
  flex-wrap:wrap;
  animation:fadeInUp 1s ease .55s both;
}

@keyframes fadeInUp{
  from{ opacity:0; transform:translateY(30px); }
  to{ opacity:1; transform:translateY(0); }
}

.scroll-indicator{
  position:absolute;
  bottom:36px;
  left:50%;
  transform:translateX(-50%);
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:10px;
  color:var(--grey);
  font-size:0.7rem;
  letter-spacing:2px;
  text-transform:uppercase;
  z-index:2;
}
.scroll-line{
  width:1px; height:50px;
  background:linear-gradient(var(--gold), transparent);
  position:relative;
  overflow:hidden;
}
.scroll-line::after{
  content:'';
  position:absolute;
  top:-50%; left:0;
  width:100%; height:50%;
  background:var(--gold-light);
  animation:scrollMove 2s ease-in-out infinite;
}
@keyframes scrollMove{
  0%{ top:-50%; }
  100%{ top:100%; }
}

/* =========================================================
   MARQUEE
   ========================================================= */
.marquee-section{
  background:var(--black-soft);
  border-top:1px solid var(--border-gold);
  border-bottom:1px solid var(--border-gold);
  overflow:hidden;
  padding:22px 0;
}
.marquee-track{
  display:flex;
  align-items:center;
  gap:40px;
  white-space:nowrap;
  width:max-content;
  animation:marquee 30s linear infinite;
}
.marquee-track span{
  font-family:var(--font-display);
  font-size:1.2rem;
  color:var(--grey);
  letter-spacing:1px;
}
.marquee-track i{
  color:var(--gold);
  font-size:0.8rem;
}
@keyframes marquee{
  from{ transform:translateX(0); }
  to{ transform:translateX(-50%); }
}

/* =========================================================
   ABOUT
   ========================================================= */
.about{
  padding:140px 0;
  background:var(--black);
}
.about-grid{
  display:grid;
  grid-template-columns:0.7fr 1.3fr;
  gap:70px;
  align-items:center;
}
.about-frame{
  position:relative;
  aspect-ratio:3/4;
  border:1px solid var(--border-gold);
  display:flex;
  align-items:flex-end;
  padding:30px;
  background:
    linear-gradient(160deg, rgba(212,175,55,0.06), transparent 60%),
    var(--black-elevated);
}
.frame-number{
  font-family:var(--font-display);
  font-size:5rem;
  color:transparent;
  -webkit-text-stroke:1px var(--gold);
}
.frame-line{
  position:absolute;
  top:20px; right:20px;
  width:60px; height:60px;
  border-top:1px solid var(--gold);
  border-right:1px solid var(--gold);
}

.about-text p{ color:var(--grey); margin-bottom:18px; }

.about-stats{
  display:flex;
  gap:50px;
  margin-top:40px;
  flex-wrap:wrap;
}
.stat-number{
  display:block;
  font-family:var(--font-display);
  font-size:2rem;
  color:var(--gold);
}
.stat-label{
  font-size:0.78rem;
  letter-spacing:1px;
  text-transform:uppercase;
  color:var(--grey);
}

/* =========================================================
   SERVICES
   ========================================================= */
.services{
  padding:140px 0;
  background:var(--black-soft);
  border-top:1px solid var(--border-gold);
  border-bottom:1px solid var(--border-gold);
}
.services-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:2px;
  margin-top:70px;
  background:var(--border-gold);
}
.service-card{
  background:var(--black-soft);
  padding:50px 40px;
  transition:background .4s ease;
}
.service-card:hover{
  background:var(--black-elevated);
}
.service-icon{
  width:56px; height:56px;
  border:1px solid var(--border-gold);
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--gold);
  font-size:1.2rem;
  margin-bottom:26px;
  transition:all .35s ease;
}
.service-card:hover .service-icon{
  background:var(--gold);
  color:#111;
  transform:rotate(-8deg);
}
.service-card h3{
  font-family:var(--font-display);
  font-size:1.3rem;
  font-weight:400;
  margin-bottom:14px;
  color:var(--cream);
}
.service-card p{
  color:var(--grey);
  font-size:0.95rem;
}

/* =========================================================
   PROCESS
   ========================================================= */
.process{
  padding:140px 0;
  background:var(--black);
}
.process-timeline{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:40px;
  margin-top:80px;
  position:relative;
}
.process-timeline::before{
  content:'';
  position:absolute;
  top:26px;
  left:12%;
  right:12%;
  height:1px;
  background:linear-gradient(90deg, transparent, var(--border-gold), var(--border-gold), transparent);
}
.process-step{
  position:relative;
  text-align:center;
  padding:0 10px;
}
.process-number{
  width:54px; height:54px;
  margin:0 auto 26px;
  border-radius:50%;
  background:var(--black-elevated);
  border:1px solid var(--gold);
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:var(--font-display);
  color:var(--gold);
  position:relative;
  z-index:1;
}
.process-step h3{
  font-family:var(--font-display);
  font-size:1.2rem;
  font-weight:400;
  margin-bottom:12px;
  color:var(--cream);
}
.process-step p{
  color:var(--grey);
  font-size:0.92rem;
}

/* =========================================================
   ADVANTAGES
   ========================================================= */
.advantages{
  padding:140px 0;
  background:var(--black-soft);
  border-top:1px solid var(--border-gold);
  border-bottom:1px solid var(--border-gold);
}
.advantages-grid{
  display:grid;
  grid-template-columns:1.2fr 0.8fr;
  gap:80px;
  align-items:center;
}
.advantages-text p{ color:var(--grey); margin-bottom:24px; }
.advantages-list li{
  display:flex;
  align-items:flex-start;
  gap:14px;
  margin-bottom:16px;
  color:var(--cream);
  font-size:0.98rem;
}
.advantages-list i{
  color:var(--gold);
  margin-top:5px;
}

.advantages-visual{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:340px;
}
.gold-ring{
  position:absolute;
  width:280px; height:280px;
  border:1px solid var(--border-gold);
  border-radius:50%;
  animation:rotateRing 30s linear infinite;
}
.gold-ring::before{
  content:'';
  position:absolute;
  inset:30px;
  border:1px solid var(--gold-dark);
  border-radius:50%;
}
@keyframes rotateRing{
  from{ transform:rotate(0deg); }
  to{ transform:rotate(360deg); }
}
.advantages-quote{
  position:relative;
  z-index:1;
  background:var(--black-elevated);
  border:1px solid var(--border-gold);
  padding:40px;
  max-width:320px;
  text-align:center;
}
.advantages-quote i{
  color:var(--gold);
  font-size:1.4rem;
  margin-bottom:16px;
}
.advantages-quote p{
  font-family:var(--font-serif);
  font-style:italic;
  font-size:1.25rem;
  color:var(--cream);
  margin-bottom:16px;
}
.advantages-quote span{
  font-size:0.75rem;
  letter-spacing:1px;
  text-transform:uppercase;
  color:var(--grey);
}

/* =========================================================
   PRICING
   ========================================================= */
.pricing{
  padding:140px 0;
  background:var(--black);
}
.pricing-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:30px;
  margin-top:70px;
}
.pricing-card{
  position:relative;
  border:1px solid var(--border-gold);
  padding:50px 36px;
  background:var(--black-elevated);
  transition:transform .35s ease, box-shadow .35s ease;
  display:flex;
  flex-direction:column;
}
.pricing-card:hover{
  transform:translateY(-8px);
  box-shadow:0 20px 40px rgba(0,0,0,0.5);
}
.pricing-card.featured{
  border-color:var(--gold);
  background:linear-gradient(160deg, rgba(212,175,55,0.08), var(--black-elevated) 60%);
}
.featured-badge{
  position:absolute;
  top:-14px; left:50%;
  transform:translateX(-50%);
  background:var(--gold);
  color:#111;
  font-size:0.7rem;
  letter-spacing:1px;
  text-transform:uppercase;
  padding:6px 18px;
  border-radius:20px;
  font-weight:500;
}
.pricing-card h3{
  font-family:var(--font-display);
  font-size:1.6rem;
  font-weight:400;
  color:var(--gold-light);
  margin-bottom:12px;
}
.pricing-desc{
  color:var(--grey);
  margin-bottom:26px;
  font-size:0.95rem;
  min-height:50px;
}
.pricing-card ul{
  margin-bottom:34px;
  flex-grow:1;
}
.pricing-card li{
  display:flex;
  align-items:flex-start;
  gap:12px;
  margin-bottom:14px;
  font-size:0.92rem;
  color:var(--cream);
}
.pricing-card li i{ color:var(--gold); margin-top:4px; }
.pricing-card .btn{ align-self:flex-start; }

.pricing-note{
  text-align:center;
  color:var(--grey);
  font-size:0.9rem;
  margin-top:50px;
  font-style:italic;
}

/* =========================================================
   CTA
   ========================================================= */
.cta-section{
  position:relative;
  padding:160px 0;
  overflow:hidden;
  text-align:center;
}
.cta-bg{
  position:absolute;
  inset:0;
  background:url('../images/cta-bg.jpg') center/cover no-repeat;
}
.cta-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, var(--black) 0%, rgba(6,6,6,0.88) 40%, var(--black) 100%);
}
.cta-content{ position:relative; z-index:1; }
.cta-title{
  font-family:var(--font-display);
  font-size:clamp(2.2rem, 5vw, 3.2rem);
  font-weight:400;
  color:var(--cream);
  margin-bottom:22px;
}
.cta-subtitle{
  color:var(--grey);
  max-width:560px;
  margin:0 auto 46px;
  font-size:1.05rem;
}
.cta-contacts{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:40px;
  flex-wrap:wrap;
  margin-bottom:40px;
}
.cta-contact-item{
  display:flex;
  align-items:center;
  gap:12px;
  color:var(--cream);
  font-size:1rem;
  transition:color .3s;
}
.cta-contact-item i{ color:var(--gold); }
.cta-contact-item:hover{ color:var(--gold-light); }

/* =========================================================
   FOOTER
   ========================================================= */
.site-footer{
  background:var(--black-soft);
  border-top:1px solid var(--border-gold);
  padding:80px 0 0;
}
.footer-inner{
  display:grid;
  grid-template-columns:1.5fr 1fr 1fr 1fr;
  gap:40px;
  padding-bottom:60px;
}
.footer-brand p{
  color:var(--grey);
  font-size:0.88rem;
  margin-top:18px;
  line-height:1.8;
}
.footer-links h4{
  font-family:var(--font-body);
  font-size:0.85rem;
  letter-spacing:1.5px;
  text-transform:uppercase;
  color:var(--gold);
  margin-bottom:22px;
  font-weight:500;
}
.footer-links a{
  display:block;
  color:var(--grey);
  font-size:0.92rem;
  margin-bottom:12px;
  transition:color .3s;
}
.footer-links a:hover{ color:var(--gold-light); }

.footer-bottom{
  border-top:1px solid var(--border-gold);
  padding:26px 0;
  text-align:center;
  color:var(--grey);
  font-size:0.82rem;
}

/* =========================================================
   COOKIE BANNER
   ========================================================= */
.cookie-banner{
  position:fixed;
  bottom:24px;
  left:24px;
  right:24px;
  max-width:680px;
  margin:0 auto;
  background:var(--black-elevated);
  border:1px solid var(--border-gold);
  padding:26px 30px;
  z-index:2000;
  display:flex;
  align-items:center;
  gap:24px;
  flex-wrap:wrap;
  justify-content:space-between;
  box-shadow:0 20px 50px rgba(0,0,0,0.6);
  transform:translateY(150%);
  opacity:0;
  transition:transform .6s ease, opacity .6s ease;
}
.cookie-banner.visible{
  transform:translateY(0);
  opacity:1;
}
.cookie-content{
  display:flex;
  align-items:flex-start;
  gap:16px;
  flex:1;
  min-width:220px;
}
.cookie-content i{
  color:var(--gold);
  font-size:1.4rem;
  margin-top:2px;
}
.cookie-content p{
  font-size:0.88rem;
  color:var(--grey);
}
.cookie-content a{
  color:var(--gold-light);
  text-decoration:underline;
}
.cookie-actions{
  display:flex;
  gap:12px;
}

/* =========================================================
   LEGAL PAGES (Privaatsuspoliitika / Küpsised)
   ========================================================= */
.legal-hero{
  padding:180px 0 80px;
  background:var(--black-soft);
  border-bottom:1px solid var(--border-gold);
  text-align:center;
}
.legal-hero .section-kicker{ justify-content:center; display:flex; }
.legal-hero h1{
  font-family:var(--font-display);
  font-size:clamp(2rem, 4vw, 3rem);
  font-weight:400;
  color:var(--cream);
  margin-bottom:16px;
}
.legal-hero p{ color:var(--grey); }

.legal-content{
  padding:90px 0 140px;
  background:var(--black);
}
.legal-content .container{
  max-width:820px;
}
.legal-content h2{
  font-family:var(--font-display);
  font-size:1.5rem;
  font-weight:400;
  color:var(--gold-light);
  margin:46px 0 18px;
}
.legal-content h2:first-child{ margin-top:0; }
.legal-content p{
  color:var(--grey);
  margin-bottom:16px;
}
.legal-content ul{
  margin:0 0 16px 0;
}
.legal-content ul li{
  color:var(--grey);
  padding-left:22px;
  position:relative;
  margin-bottom:10px;
}
.legal-content ul li::before{
  content:'—';
  position:absolute;
  left:0;
  color:var(--gold);
}
.legal-content a{
  color:var(--gold-light);
  text-decoration:underline;
}
.legal-content .updated-date{
  font-size:0.85rem;
  color:var(--gold);
  letter-spacing:1px;
  text-transform:uppercase;
  margin-bottom:40px;
  display:inline-block;
}
.legal-content table{
  width:100%;
  border-collapse:collapse;
  margin:20px 0 30px;
}
.legal-content table th, .legal-content table td{
  border:1px solid var(--border-gold);
  padding:12px 16px;
  text-align:left;
  font-size:0.92rem;
  color:var(--grey);
}
.legal-content table th{
  color:var(--gold-light);
  font-weight:500;
  background:var(--black-soft);
}
.back-link{
  display:inline-flex;
  align-items:center;
  gap:10px;
  color:var(--gold);
  font-size:0.85rem;
  letter-spacing:1px;
  text-transform:uppercase;
  margin-bottom:20px;
}
.back-link:hover{ color:var(--gold-light); }

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (max-width: 992px){
  .about-grid, .advantages-grid{ grid-template-columns:1fr; }
  .about-visual{ order:2; max-width:320px; margin:0 auto; }
  .services-grid{ grid-template-columns:repeat(2, 1fr); }
  .process-timeline{ grid-template-columns:repeat(2, 1fr); gap:60px 30px; }
  .process-timeline::before{ display:none; }
  .pricing-grid{ grid-template-columns:1fr; max-width:460px; margin-left:auto; margin-right:auto; }
  .footer-inner{ grid-template-columns:1fr 1fr; }
}

@media (max-width: 768px){
  .main-nav{
    position:fixed;
    top:0; right:-100%;
    width:78%;
    max-width:340px;
    height:100vh;
    background:var(--black-elevated);
    border-left:1px solid var(--border-gold);
    flex-direction:column;
    justify-content:center;
    align-items:flex-start;
    padding:40px;
    gap:30px;
    transition:right .45s ease;
    z-index:1050;
  }
  .main-nav.open{ right:0; }
  .nav-toggle{ display:flex; }
  .services-grid{ grid-template-columns:1fr; }
  .process-timeline{ grid-template-columns:1fr; }
  .footer-inner{ grid-template-columns:1fr; }
  .cta-contacts{ flex-direction:column; gap:18px; }
  .cookie-banner{ flex-direction:column; align-items:stretch; left:14px; right:14px; bottom:14px; }
  .cookie-actions{ justify-content:flex-end; }
}
