

@import url('https://fonts.googleapis.com/css2?family=Anton&display=swap');
/* HERO BANNER (single static image, fixed 600px height) */
.eh-hero{
  position:relative;
  width:100%;
  height:650px;
  overflow:hidden;
  background:var(--ink);
}

.eh-hero__image{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:bottom center;
}

.eh-hero__desktop{
  display:block;
}

.eh-hero__mobile{
  display:none;
}

/* Full-coverage lighter dark overlay across the entire banner */
.eh-hero__scrim{
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  background:rgba(6, 6, 5, 0.10);
}

/* Directional overlay for extra text legibility */
.eh-hero__overlay{
  position:absolute;
  inset:0;
  z-index:3;
  pointer-events:none;
  background:rgba(0, 0, 0, 0.10);
}

.eh-hero__label{
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%, -50%);
  margin:-60px 0 0 0;
  z-index:4;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  white-space:nowrap;
}

.eh-hero__label-badge{
  background:#FCC222;
  color:#1a1a1a;
  font-family:'Philosopher', serif;
  font-weight:500;
  font-size:18px;
  letter-spacing:0.15em;
  text-transform:uppercase;
  padding:6px 20px;
  border-radius:1px;
  white-space:nowrap;
}

.eh-hero__label-line{
  display:inline-block;
  width:40px;
  height:1px;
  background:#FCC222;
}

.eh-hero__title{
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%, -50%);
  z-index:4;
  margin:0;
  font-family:'Philosopher', serif;
  font-weight:500;
  font-size:clamp(32px, 5vw, 42px);
  text-transform:uppercase;
  color:#FFFFFF;
  text-align:center;
  white-space:nowrap;
}




    
.dp-luxury {
    background: #FFFFFF;
    padding: 40px 110px 20px;
    color: #2B2621;
  }
 
  .dp-luxury__inner {
    max-width: 1400px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
 
  .dp-luxury__title {
    font-family: Georgia, "Times New Roman", serif;
    font-weight: 500;
    font-size: 30px;
    text-align: center;
    letter-spacing: 0.5px;
    color: #1F1A15;
    position: relative;
    padding-bottom: 15px;
    text-transform: uppercase;
  }
 
  .dp-luxury__title::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 230px;
    height: 2px;
    background: #F1DC5F;
  }
 
  .dp-luxury__text {
    max-width: 1060px;
    text-align: center;
    font-size: 16px;
    line-height: 1.9;
    font-weight: 300;
    color: #55503F;
    margin-top: 10px;
    font-family: 'Inter', Serif;
  }
 
  .dp-luxury__grid {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 6px;
    margin-top: 36px;
  }
 
  .dp-luxury__card {
    position: relative;
    overflow: hidden;
    border-radius: 0px;
    aspect-ratio: 3 / 5;
    cursor: pointer;
  }
 
  .dp-luxury__card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 1.1s ease;
  }
 
  .dp-luxury__card:hover img {
    transform: scale(1.06);
  }
 
  .dp-luxury__card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.1); 
  pointer-events: none;
}
 
 .dp-luxury__heading {
  position: absolute;
  left: 16px;
  right: 16px;

  font-family: Georgia, 'Times New Roman', serif;
  font-weight: 600;

  /* Responsive font size */
  font-size: 24px;

  /* Controls text height */
  line-height: 1.2;

  /* Space between letters */
  

  color: #fff;
  text-transform: uppercase;
  
}
 
  .dp-luxury__card--top .dp-luxury__heading {
    bottom: 22px;
  }
 
  .dp-luxury__card--bottom .dp-luxury__heading {
    top: 22px;
  }

  




:root{
    --ink:#1b1a17;
    --bg:#ffffff;
    --panel:#f1efe9;
    --ivory:#1b1a17;
    --stone:#7a766c;
    --gold:#b3874a;
    --line: rgba(27,26,23,0.1);
  }
  .gallery-section{
    width:1200px;
    max-width:100%;
    box-sizing:border-box;
    margin:0 auto;
    padding:88px 40px 96px;
    background:var(--bg);
    font-family:'Jost', sans-serif;
    color:var(--ivory);
  }
  .gallery-title{
    text-align:center;
    font-family:Georgia, "Times New Roman", serif;
    font-weight:500;
    font-size:30px;
    letter-spacing:0.5px;
    margin:0;
    color:var(--ink);
    position:relative;
    padding-bottom:28px;
    text-transform: uppercase;
  }
  .gallery-title::after{
    content:"";
    position:absolute;
    bottom:0;
    left:50%;
    transform:translateX(-50%);
    width:130px;
    height:2px;
    background:#F1DC5F;
  }

  /* =========================================
     NEW GRID PATTERN
     (2 equal images / 1 full-width image / 1 large + 1 small image)
     Matches the reference layout — placement & size only.
     ========================================= */
  .gallery-grid{
    display:grid;
    grid-template-columns:repeat(12, 1fr);
    grid-template-rows: 320px 300px 300px;
    gap:8px;
    margin-top:56px;
  }
  .gallery-grid + .gallery-grid{
    margin-top:8px;
  }
  .pattern-new{
    grid-template-areas:
      "a a a a a a b b b b b b"
      "c c c c d d d d e e e e"
      "f f f f f f f f g g g g";
  }
  /* Used when a block doesn't have enough images to fill all 3 rows,
     so no empty row height is reserved. */
  .pattern-new.rows-1{
    grid-template-rows: 320px;
    grid-template-areas:
      "a a a a a a b b b b b b";
  }
  .pattern-new.rows-2{
    grid-template-rows: 320px 300px;
    grid-template-areas:
      "a a a a a a b b b b b b"
      "c c c c d d d d e e e e";
  }
  .hidden-block{
    display:none;
  }
  .tile{
    position:relative;
    overflow:hidden;
    border-radius:2px;
    cursor:pointer;
    background:var(--panel);
    opacity:0;
    transform:translateY(14px);
    animation:rise 700ms ease forwards;
  }
  .tile img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
    transform:scale(1.001);
    transition:transform 900ms cubic-bezier(.2,.7,.2,1), filter 900ms ease;
    filter:saturate(0.92) brightness(0.94);
  }
  .tile:hover img{
    transform:scale(1.06);
    filter:saturate(1) brightness(1);
  }
  .tile::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(180deg, rgba(17,16,9,0) 45%, rgba(12,11,7,0.86) 100%);
    pointer-events:none;
  }
  .tile-caption{
    position:absolute;
    left:20px;
    right:20px;
    bottom:16px;
    display:flex;
    align-items:center;
    gap:12px;
  }
  .tile-mark{
    width:26px;
    height:26px;
    border:1px solid var(--gold);
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:11px;
    color:var(--gold);
    flex-shrink:0;
    font-family:'Jost', sans-serif;
    letter-spacing:0.2px;
  }
  .tile-name{
    font-size:13px;
    color:#f4efe4;
    font-weight:300;
    letter-spacing:0.2px;
  }
  .a{grid-area:a;}
  .b{grid-area:b;}
  .c{grid-area:c;}
  .d{grid-area:d;}
  .e{grid-area:e;}
  .f{grid-area:f;}
  .g{grid-area:g;}
  .a{animation-delay:60ms;}
  .b{animation-delay:150ms;}
  .c{animation-delay:240ms;}
  .d{animation-delay:330ms;}
  .e{animation-delay:410ms;}
  .f{animation-delay:490ms;}
  .g{animation-delay:570ms;}
  @keyframes rise{to{opacity:1; transform:translateY(0);}}

  .view-more-wrap{
    display:flex;
    justify-content:center;
    margin-top:48px;
  }
  .view-more-btn{
    font-family:'Inter', sans-serif;
    font-size:12px;
    letter-spacing:1.5px;
    text-transform:uppercase;
    color:var(--ink);
    background:transparent;
    border:1px solid #F1DC5F;
    padding:14px 38px;
    cursor:pointer;
    transition:background 250ms ease, color 250ms ease;
  }
  .view-more-btn:hover{
    background:#F1DC5F;
    color:#141414;
  }

  .lightbox{
    position:fixed;
    inset:0;
    background:rgba(12,11,7,0.94);
    display:none;
    align-items:center;
    justify-content:center;
    z-index:999;
    padding:40px;
    box-sizing:border-box;
  }
  .lightbox.active{
    display:flex;
  }
  .lightbox-figure{
    display:flex;
    flex-direction:column;
    align-items:center;
    max-width:90vw;
  }
  .lightbox-img{
    max-width:86vw;
    max-height:76vh;
    object-fit:contain;
    border-radius:2px;
    display:block;
  }
  .lightbox-caption{
    margin-top:18px;
    display:flex;
    align-items:center;
    gap:12px;
    color:#f4efe4;
    font-family:'Jost', sans-serif;
  }
  .lightbox-price{
    width:30px;
    height:30px;
    border:1px solid var(--gold);
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:12px;
    color:var(--gold);
  }
  .lightbox-name{
    font-size:14px;
    font-weight:300;
    letter-spacing:0.3px;
  }
  .lightbox-close, .lightbox-prev, .lightbox-next{
    position:absolute;
    background:transparent;
    border:none;
    color:#f4efe4;
    font-size:28px;
    cursor:pointer;
    line-height:1;
    padding:8px;
  }
  .lightbox-close{
    top:24px;
    right:32px;
    font-size:26px;
  }
  .lightbox-prev{
    left:24px;
    top:50%;
    transform:translateY(-50%);
    font-size:36px;
  }
  .lightbox-next{
    right:24px;
    top:50%;
    transform:translateY(-50%);
    font-size:36px;
  }
  
  
  
  
  
  :root{
    --reg-sky-warm:#d9a273;
    --reg-glass-bg:rgba(255,255,255,0.14);
    --reg-glass-border:rgba(255,255,255,0.35);
    --reg-ink:#0c2237;
    --reg-accent:#c99b78;
    --reg-accent-dark:#a97d5c;
    --reg-error:#e2664a;
    --reg-success:#3f9c76;
  }
 
  /* ---------- Background image (section, cover) ---------- */
  .reg-bg{
    position:absolute;
    inset:0;
    z-index:0;
    overflow:hidden;
  }
  .reg-bg img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center;
    display:block;
  }
  /* dark overlay so left-side text and card stay readable over any photo */
  .reg-bg::after{
    content:'';
    position:absolute;
    inset:0;
    background:linear-gradient(90deg, rgba(4,14,26,0.62) 0%, rgba(4,14,26,0.42) 45%, rgba(4,14,26,0.28) 100%);
  }
 
  /* ---------- Layout ---------- */
  .reg-section{
    position:relative;
    height:600px;
    overflow:hidden;
    font-family:'Manrope', sans-serif;
    color:var(--reg-ink);
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:40px;
    padding:0 6vw;
    flex-wrap:wrap;
  }
 
  .reg-intro{
    position:relative;
    z-index:1;
    flex:1 1 380px;
    max-width:520px;
    color:#fff;
    padding-top:20px;
  }
  .reg-eyebrow{
    display:flex;
    align-items:center;
    gap:14px;
    font-size:12px;
    letter-spacing:.22em;
    text-transform:uppercase;
    color:rgba(255,255,255,0.85);
    font-weight:500;
    margin-bottom:26px;
    font-family: 'Inter', sans-serif;
  }
  .reg-eyebrow::before{
    content:'';
    width:34px;
    height:1px;
    background:rgba(255,255,255,0.65);
  }
  .reg-intro h2{
    font-family:'Cormorant Garamond', serif;
    font-weight:500;
    font-size:clamp(40px, 5.2vw, 68px);
    line-height:1.05;
    margin:0 0 6px 0;
    letter-spacing:.005em;
  }
  .reg-intro h2 span{
    display:block;
    color:#F1DC5F;
    font-style:italic;
  }
 
 
  /* ---------- Glass Card ---------- */
  .reg-card{
    position:relative;
    z-index:1;
    flex:1 1 420px;
    max-width:460px;
    background:var(--reg-glass-bg);
    border:1px solid var(--reg-glass-border);
    backdrop-filter:blur(22px) saturate(140%);
    -webkit-backdrop-filter:blur(22px) saturate(140%);
    border-radius:22px;
    padding:38px 36px 32px;
    box-shadow:0 30px 60px -20px rgba(6,20,35,0.55), inset 0 1px 0 rgba(255,255,255,0.4);
  }
 
  .reg-field{
    margin-bottom:20px;
  }
  .reg-field label{
    display:block;
    font-size:12px;
    font-weight:600;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:rgba(20,40,60,0.72);
    margin-bottom:9px;
    font-family: 'Inter', sans-serif;
  }
  .reg-field input,
  .reg-field textarea{
    width:100%;
    border:1px solid rgba(255,255,255,0.55);
    background:rgba(255,255,255,0.55);
    border-radius:12px;
    padding:14px 16px;
    font-size:14.5px;
    font-family:inherit;
    color:var(--reg-ink);
    outline:none;
    transition:border-color .18s ease, background .18s ease, box-shadow .18s ease;
  }
  .reg-field input::placeholder,
  .reg-field textarea::placeholder{
    color:rgba(20,40,60,0.4);
  }
  .reg-field input:focus,
  .reg-field textarea:focus{
    background:rgba(255,255,255,0.85);
    border-color:var(--reg-accent);
    box-shadow:0 0 0 4px rgba(201,155,120,0.22);
  }
  .reg-field textarea{
    resize:vertical;
    min-height:96px;
    font-family:inherit;
  }
 
  .reg-field.reg-invalid input,
  .reg-field.reg-invalid textarea{
    border-color:var(--reg-error);
    background:rgba(255,240,238,0.75);
  }
  .reg-field.reg-valid input,
  .reg-field.reg-valid textarea{
    border-color:var(--reg-success);
  }
 
  .reg-error-msg{
    display:none;
    align-items:center;
    gap:6px;
    font-size:12.5px;
    color:var(--reg-error);
    margin-top:7px;
    font-weight:600;
  }
  .reg-field.reg-invalid .reg-error-msg{
    display:flex;
  }
 
  .reg-submit-btn{
    width:100%;
    margin-top:6px;
    border:none;
    cursor:pointer;
    background:linear-gradient(135deg, #FEFAE0 0%, #F5EBC2 100%);
    color:#141414;
    font-family:inherit;
    font-weight:500;
    font-size:16px;
    letter-spacing:.01em;
    padding:16px 22px;
    border-radius:12px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    transition:transform .15s ease, box-shadow .15s ease, opacity .15s ease;
    box-shadow:0 14px 28px -10px rgba(169,125,92,0.65);
    font-family: 'Inter', sans-serif;
  }
  .reg-submit-btn:hover{
    transform:translateY(-1px);
    box-shadow:0 18px 34px -10px rgba(169,125,92,0.75);
  }
  .reg-submit-btn:active{
    transform:translateY(0);
  }
  .reg-submit-btn svg{
    width:16px;
    height:16px;
    transition:transform .15s ease;
  }
  .reg-submit-btn:hover svg{
    transform:translateX(3px);
  }
 
  .reg-success-banner{
    display:none;
    align-items:center;
    gap:10px;
    background:rgba(63,156,118,0.18);
    border:1px solid rgba(63,156,118,0.45);
    color:#1f5b41;
    font-size:13.5px;
    font-weight:700;
    padding:12px 14px;
    border-radius:10px;
    margin-bottom:18px;
  }
  .reg-success-banner.reg-show{
    display:flex;
  }
  
  
  
  
  
  
  
  
  
/* =====================================================================
   0. GLOBAL
===================================================================== */

 
/* ---- Gallery rows as variables, so EMPTY rows/cells can be collapsed ----
   (fixes the big blank space when a block has fewer images than the pattern) */
.gallery-grid{
  --gr1:320px; --gr2:300px; --gr3:300px;
  grid-template-rows:var(--gr1) var(--gr2) var(--gr3);
}
.gallery-grid.pattern-new.rows-1{ grid-template-rows:var(--gr1); }
.gallery-grid.pattern-new.rows-2{ grid-template-rows:var(--gr1) var(--gr2); }
 
@media (min-width:768px){
  /* no f / g images  -> remove the 3rd row */
  .gallery-grid.pattern-new:not(.rows-1):not(:has(.f)){
    grid-template-rows:var(--gr1) var(--gr2);
    grid-template-areas:
      "a a a a a a b b b b b b"
      "c c c c d d d d e e e e";
  }
  /* no c / d / e images -> only the first row */
  .gallery-grid.pattern-new:not(:has(.c)){
    grid-template-rows:var(--gr1);
    grid-template-areas:"a a a a a a b b b b b b";
  }
  /* last image of a row stretches instead of leaving a hole */
  .gallery-grid.pattern-new:not(:has(.d)) .c{ grid-column:1 / 13; }
  .gallery-grid.pattern-new:has(.d):not(:has(.e)) .d{ grid-column:5 / 13; }
  .gallery-grid.pattern-new:has(.f):not(:has(.g)) .f{ grid-column:1 / 13; }
}
 
 
/* =====================================================================
   1. LARGE SCREENS (>= 1600px)
===================================================================== */
@media (min-width:1600px){
 
  /* hero */
  .eh-hero{ height:760px; }
  .eh-hero__label{ margin-top:-72px; }
  .eh-hero__label-badge{ font-size:20px; padding:7px 24px; }
  .eh-hero__label-line{ width:56px; }
  .eh-hero__title{ font-size:52px; }
 
  /* luxury cards */
  .dp-luxury{ padding:60px 140px 30px; }
  .dp-luxury__inner{ max-width:1560px; }
  .dp-luxury__title{ font-size:36px; }
  .dp-luxury__text{ font-size:18px; max-width:1200px; }
  .dp-luxury__grid{ gap:8px; margin-top:48px; }
  .dp-luxury__heading{ font-size:28px; left:20px; right:20px; }
 
  /* gallery (row heights x1.25) */
  .gallery-section{ width:1500px; padding:104px 48px 112px; }
  .gallery-title{ font-size:36px; }
  .gallery-grid{ --gr1:400px; --gr2:375px; --gr3:375px; gap:10px; }
  .gallery-grid + .gallery-grid{ margin-top:10px; }
  .tile-name{ font-size:15px; }
  .view-more-btn{ font-size:13px; padding:16px 44px; }
 
  /* register form */
  .reg-section{ height:680px; padding:0 8vw; }
  .reg-card{ max-width:520px; padding:44px 42px 38px; }
}
 
 
/* =====================================================================
   2. 4K / ULTRA-WIDE (>= 2200px)
===================================================================== */
@media (min-width:2200px){
 
  .eh-hero{ height:900px; }
  .eh-hero__label{ margin-top:-90px; }
  .eh-hero__label-badge{ font-size:24px; }
  .eh-hero__title{ font-size:64px; }
 
  .dp-luxury{ padding:80px 160px 40px; }
  .dp-luxury__inner{ max-width:1900px; }
  .dp-luxury__title{ font-size:44px; }
  .dp-luxury__text{ font-size:20px; max-width:1400px; }
  .dp-luxury__heading{ font-size:34px; }
 
  /* row heights x1.6 */
  .gallery-section{ width:1900px; }
  .gallery-title{ font-size:44px; }
  .gallery-grid{ --gr1:512px; --gr2:480px; --gr3:480px; gap:12px; }
  .tile-name{ font-size:17px; }
 
  .reg-section{ height:780px; }
  .reg-card{ max-width:600px; }
  .reg-intro{ max-width:640px; }
}
 
 
/* =====================================================================
   3. SMALL LAPTOPS (<= 1280px)
===================================================================== */
@media (max-width:1280px){
 
  .dp-luxury{ padding:40px 64px 20px; }
  .dp-luxury__heading{ font-size:21px; }
 
  .gallery-section{ padding:76px 32px 84px; }
}
 
 
/* =====================================================================
   4. TABLET LANDSCAPE (<= 1024px)
===================================================================== */
@media (max-width:1024px){
 
  /* ---------- HERO ---------- */
  .eh-hero{ height:520px; }
  .eh-hero__label-badge{ font-size:16px; padding:6px 18px; }
  .eh-hero__label-line{ width:32px; }
  .eh-hero__title{ font-size:clamp(30px, 5vw, 40px); }
 
  /* ---------- LUXURY CARDS (still 4 across, smaller type) ---------- */
  .dp-luxury{ padding:36px 32px 20px; }
  .dp-luxury__title{ font-size:26px; }
  .dp-luxury__text{ font-size:15px; line-height:1.8; }
  .dp-luxury__heading{ font-size:18px; left:12px; right:12px; }
  .dp-luxury__card--top .dp-luxury__heading{ bottom:16px; }
  .dp-luxury__card--bottom .dp-luxury__heading{ top:16px; }
 
  /* ---------- GALLERY (same 12-col pattern, shorter rows) ---------- */
  .gallery-section{ padding:68px 28px 76px; }
  .gallery-title{ font-size:26px; padding-bottom:24px; }
  .gallery-grid{ --gr1:260px; --gr2:240px; --gr3:240px; margin-top:44px; }
 
  /* ---------- LIGHTBOX ---------- */
  .lightbox{ padding:28px; }
 
  /* ---------- REGISTER FORM ---------- */
  .reg-section{ padding:0 5vw; gap:32px; }
  .reg-card{ padding:32px 28px 28px; }
}
 
 
/* =====================================================================
   5. TABLET PORTRAIT (<= 900px)
===================================================================== */
@media (max-width:900px){
 
  /* ---------- LUXURY CARDS: 2 x 2 ---------- */
  .dp-luxury__grid{ grid-template-columns:repeat(2, minmax(0,1fr)); gap:6px; }
  .dp-luxury__card{ aspect-ratio:4 / 5; }
  .dp-luxury__heading{ font-size:22px; left:16px; right:16px; }
 
  /* ---------- REGISTER FORM: stacked ---------- */
  .reg-section{
    height:auto;
    flex-direction:column;
    flex-wrap:nowrap;
    align-items:stretch;
    justify-content:center;
    padding:64px 6vw;
    gap:32px;
  }
  .reg-intro{ flex:none; max-width:100%; padding-top:0; }
  .reg-card{ flex:none; width:100%; max-width:560px; }
}
 
 
/* =====================================================================
   6. MOBILE (<= 767px)
===================================================================== */
@media (max-width:767px){
 
  /* ---------- HERO ---------- */
  .eh-hero__desktop{ display:none; }
  .eh-hero__mobile{ display:block; }
 
  .eh-hero{ height:600px; }
  .eh-hero__scrim{ background:rgba(6,6,5,.25); }   /* a bit more contrast for centred text */
  .eh-hero__label{
    margin-top:-64px;
    gap:8px;
    width:92%;
    justify-content:center;
  }
  .eh-hero__label-badge{ font-size:13px; letter-spacing:.12em; padding:5px 14px; }
  .eh-hero__label-line{ width:20px; }
  .eh-hero__title{
    width:90%;
    white-space:normal;                 /* base is nowrap — runs off the screen */
    font-size:clamp(24px, 7vw, 32px);
    line-height:1.2;
  }
 
  /* ---------- LUXURY CARDS: 2 x 2 ---------- */
  .dp-luxury{ padding:32px 20px 16px; }
  .dp-luxury__title{ font-size:22px; padding-bottom:14px; }
  .dp-luxury__title::after{ width:150px; }
  .dp-luxury__text{ font-size:14.5px; line-height:1.8; margin-top:8px; }
  .dp-luxury__grid{ margin-top:24px; gap:6px; }
  .dp-luxury__card{ aspect-ratio:3 / 4; }
  .dp-luxury__heading{ font-size:17px; left:12px; right:12px; }
  .dp-luxury__card--top .dp-luxury__heading{ bottom:14px; }
  .dp-luxury__card--bottom .dp-luxury__heading{ top:14px; }
 
  /* ---------- GALLERY: 2-column flow ----------
     No fixed rows / areas any more, so a block with 2, 3, 4, 5, 6 or 7
     images never leaves an empty row.
     Layout: [a b] [c full] [d e] [f g]; a lone last image goes full width. */
  .gallery-section{ padding:52px 14px 60px; }
  .gallery-title{ font-size:22px; padding-bottom:20px; }
  .gallery-title::after{ width:100px; }
 
  .gallery-grid,
  .gallery-grid.pattern-new,
  .gallery-grid.pattern-new.rows-1,
  .gallery-grid.pattern-new.rows-2{
    grid-template-columns:repeat(2, minmax(0,1fr));
    grid-template-areas:none;
    grid-template-rows:none;
    grid-auto-rows:auto;
    gap:6px;
    margin-top:36px;
  }
  .gallery-grid + .gallery-grid{ margin-top:6px; }
 
  .gallery-grid .a, .gallery-grid .b, .gallery-grid .c, .gallery-grid .d,
  .gallery-grid .e, .gallery-grid .f, .gallery-grid .g{ grid-area:auto; }
 
  .gallery-grid .tile{ aspect-ratio:4 / 3; }
  .gallery-grid .tile img{ position:absolute; inset:0; width:100%; height:100%; }
 
  .gallery-grid .c,
  .gallery-grid .tile:nth-child(4):last-child,
  .gallery-grid .tile:nth-child(6):last-child{
    grid-column:1 / -1;
    aspect-ratio:16 / 10;
  }
 
  .tile-caption{ left:12px; right:12px; bottom:10px; gap:8px; }
  .tile-mark{ width:22px; height:22px; font-size:10px; }
  .tile-name{ font-size:12px; }
 
  .view-more-wrap{ margin-top:32px; }
  .view-more-btn{ padding:13px 32px; font-size:12px; }
 
  /* ---------- LIGHTBOX ---------- */
  .lightbox{ padding:16px; }
  .lightbox-figure{ max-width:94vw; }
  .lightbox-img{ max-width:94vw; max-height:68vh; }
  .lightbox-caption{ margin-top:14px; gap:10px; flex-wrap:wrap; justify-content:center; }
  .lightbox-name{ font-size:13px; }
  .lightbox-close{ top:12px; right:14px; }
  .lightbox-prev,
  .lightbox-next{
    width:40px; height:40px;
    padding:0;
    font-size:26px;
    border-radius:50%;
    background:rgba(0,0,0,.4);
    display:flex; align-items:center; justify-content:center;
  }
  .lightbox-prev{ left:8px; }
  .lightbox-next{ right:8px; }
 
  /* ---------- REGISTER FORM ---------- */
  .reg-section{ padding:56px 20px; }
  .reg-eyebrow{ font-size:11px; letter-spacing:.18em; margin-bottom:18px; }
  .reg-intro h2{ font-size:clamp(34px, 9vw, 48px); }
  .reg-card{ max-width:100%; padding:26px 20px 22px; border-radius:18px; }
  .reg-field input,
  .reg-field textarea{ font-size:16px; }      /* 16px stops iOS zoom on focus */
}
 
 
/* =====================================================================
   7. PHONES (<= 480px)
===================================================================== */
@media (max-width:480px){
 
  .eh-hero{ height:600px; }
  .eh-hero__label{ margin-top:-56px; }
  .eh-hero__label-badge{ font-size:12px; padding:4px 12px; }
  .eh-hero__label-line{ width:14px; }
 
  .dp-luxury{ padding:28px 14px 14px; }
  .dp-luxury__title{ font-size:20px; }
  .dp-luxury__heading{ font-size:14px; left:10px; right:10px; line-height:1.25; }
  .dp-luxury__card--top .dp-luxury__heading{ bottom:12px; }
  .dp-luxury__card--bottom .dp-luxury__heading{ top:12px; }
 
  .gallery-section{ padding:44px 10px 52px; }
  .gallery-title{ font-size:20px; }
 
  .reg-section{ padding:48px 16px; }
  .reg-card{ padding:22px 16px 20px; }
}
 
 
/* =====================================================================
   8. VERY SMALL PHONES (<= 360px)
===================================================================== */
@media (max-width:360px){
 
  .eh-hero{ height:600px; }
  .eh-hero__title{ font-size:22px; }
 
  .dp-luxury__heading{ font-size:12.5px; }
  .tile-mark{ display:none; }
 
}
 
 
/* =====================================================================
   9. SHORT LANDSCAPE PHONES
===================================================================== */
@media (max-height:500px) and (orientation:landscape){
 
  .eh-hero{ height:360px; }
 
  .lightbox{ padding:8px; }
  .lightbox-img{ max-height:72vh; }
  .lightbox-caption{ margin-top:8px; }
  .lightbox-close{ top:6px; right:10px; }
}
 
 
/* =====================================================================
   10. TOUCH DEVICES — no sticky hover effects
===================================================================== */
@media (hover:none){
  .dp-luxury__card:hover img,
  .tile:hover img{ transform:none; }
  .reg-submit-btn:hover{ transform:none; }
}
