/* hero-santorini.css — premium Santorini hero styles */
:root{
  --sant-ivory: #fffaf2;
  --sant-sand: #f6f0e7;
  --sant-gold: #c99a42;
  --sant-gold-2: #f2d184;
  --sant-navy: #061b34;
  --sant-navy-2: #0f3a5a;
  --sant-text: #102033;
  --muted: #6d7783;
  --hero-overlay-1: linear-gradient(90deg, rgba(6,27,52,0.86) 0%, rgba(6,27,52,0.56) 35%, rgba(6,27,52,0.12) 70%, rgba(6,27,52,0) 100%);
  --hero-warm-radial: radial-gradient(600px 300px at 18% 62%, rgba(242,209,132,0.08), transparent 28%);
  --serif: 'Cormorant Garamond', 'Crimson Pro', serif;
  --ui: 'Inter', system-ui, -apple-system, sans-serif;
}

.hero {
  position:relative;
  min-height:92vh;
  display:grid;
  align-items:center;
  overflow:hidden;
  background-color:var(--sant-ivory);
  color:#fff;
}
.hero__bg {
  position:absolute; inset:0; z-index:0;
  background-image: url('assets/hero-santorini.jpg');
  background-size:cover;
  background-position: center right;
  filter: contrast(1.02) saturate(1.06);
  transform: translateZ(0);
}
.hero__overlay {
  position:absolute; inset:0; z-index:1;
  background: var(--hero-overlay-1), var(--hero-warm-radial);
  mix-blend-mode: normal;
  pointer-events:none;
}
.hero__inner{
  position:relative; z-index:2; max-width:1280px; margin:auto; padding:clamp(28px,6vw,84px);
  display:grid; grid-template-columns: minmax(0,1fr) 420px; gap: clamp(20px,5vw,64px); align-items:center;
}
.hero h1{
  font-family:var(--serif); font-weight:700; font-size:clamp(36px,6.6vw,76px); line-height:0.92; letter-spacing:-0.02em; color: #fff;
  text-shadow: 0 10px 28px rgba(4,15,29,0.45);
}
.hero p.lead{ font-family:var(--ui); font-size:clamp(16px,2.1vw,20px); color: rgba(255,255,255,0.88); max-width:720px; margin-top:18px; }
.hero .cta{ display:inline-flex; align-items:center; gap:12px; padding:14px 22px; border-radius:999px; font-weight:800; color: #07192a;
  background: linear-gradient(135deg,var(--sant-gold-2),var(--sant-gold)); box-shadow: 0 18px 44px rgba(201,154,66,0.18); border: 1px solid rgba(255,255,255,0.06); transition: transform .18s ease, box-shadow .18s ease;
}
.hero .cta:hover{ transform: translateY(-3px); box-shadow: 0 26px 70px rgba(201,154,66,0.22); }
@media(max-width:980px){
  .hero__inner{ grid-template-columns: 1fr; padding:38px 22px; text-align:left;}
  .hero__bg{ background-position: center; }
  .hero h1{ font-size:clamp(28px,7.6vw,44px); color: #fff;}
}
.brand-mark{ width:48px;height:48px;border-radius:50%;background:linear-gradient(180deg,var(--sant-gold),var(--sant-gold-2));display:grid;place-items:center;font-family:var(--serif);font-weight:800;color:#07192a; }