:root{
    --red:        #BE2A2E;
    --red-dark:   #7E1518;
    --red-deep:   #4E0E10;
    --gold:       #E4A238;
    --gold-dark:  #B87A1C;
    --purple:     #5B3A8E;
    --purple-dark:#402968;
    --cream:      #FBF3E5;
    --paper:      #F5EADA;
    --ink:        #241A16;
    --ink-soft:   #4A3C34;
    --stone:      #8A7B6C;
    --line:       rgba(36,26,22,0.12);
    --shadow:     0 24px 60px -30px rgba(36,26,22,0.45);
  }

  *{ box-sizing:border-box; }
  html{ scroll-behavior:smooth; }
  body{ margin:0; background:var(--cream); color:var(--ink); font-family:'Manrope', sans-serif; -webkit-font-smoothing:antialiased; }
  h1,h2,h3,.display{ font-family:'Fraunces', serif; font-weight:560; letter-spacing:-0.01em; margin:0; }
  a{ color:inherit; text-decoration:none; }
  img,svg{ display:block; max-width:100%; }
  .wrap{ max-width:1180px; margin:0 auto; padding:0 32px; }
  .eyebrow{ font-family:'Manrope',sans-serif; font-weight:700; font-size:12.5px; letter-spacing:0.16em; text-transform:uppercase; color:var(--gold-dark); }
  .eyebrow.on-dark{ color:var(--gold); }

  @media (prefers-reduced-motion: reduce){
    *{ animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important; }
  }

  /* ---------- HEADER ---------- */
  header{ position:sticky; top:0; z-index:50; background:rgba(251,243,229,0.92); backdrop-filter:blur(10px); border-bottom:1px solid var(--line); }
  .nav{ display:flex; align-items:center; justify-content:space-between; padding:16px 32px; max-width:1180px; margin:0 auto; }
  .brand{ display:flex; align-items:center; gap:12px; }
  .brand-mark{ width:38px; height:38px; flex:none; }
  .brand-text{ line-height:1.05; }
  .brand-text .k{ font-family:'Fraunces',serif; font-weight:650; font-size:19px; letter-spacing:0.01em; }
  .brand-text .c{ font-size:9.5px; letter-spacing:0.24em; color:var(--stone); font-weight:700; }
  .nav-links{ display:none; align-items:center; gap:34px; }
  @media (min-width:880px){ .nav-links{ display:flex; } }
  .nav-links a{ font-size:14px; font-weight:600; color:var(--ink-soft); position:relative; padding:4px 0; }
  .nav-links a::after{ content:''; position:absolute; left:0; right:0; bottom:-2px; height:2px; background:var(--red); transform:scaleX(0); transform-origin:left; transition:transform .25s ease; }
  .nav-links a:hover::after{ transform:scaleX(1); }
  .btn{ display:inline-flex; align-items:center; gap:8px; font-size:13.5px; font-weight:700; letter-spacing:0.01em; padding:11px 22px; border-radius:3px; border:1.5px solid transparent; cursor:pointer; transition:transform .2s ease, box-shadow .2s ease, background .2s ease; }
  .btn-primary{ background:var(--red); color:var(--cream); box-shadow:0 10px 24px -12px rgba(126,21,24,0.65); }
  .btn-primary:hover{ background:var(--red-dark); transform:translateY(-1px); }
  .btn-ghost-dark{ border-color:rgba(251,243,229,0.4); color:var(--cream); }
  .btn-ghost-dark:hover{ border-color:var(--gold); color:var(--gold); }
  .nav-cta{ display:none; }
  @media (min-width:880px){ .nav-cta{ display:inline-flex; } }
  .burger{ display:flex; background:none; border:none; cursor:pointer; padding:6px; }
  @media (min-width:880px){ .burger{ display:none; } }
  .burger span{ display:block; width:22px; height:2px; background:var(--ink); margin:5px 0; }

  /* ---------- HERO ---------- */
  .hero{ position:relative; overflow:hidden; background:linear-gradient(180deg, var(--red) 0%, var(--red-dark) 78%, var(--red-deep) 100%); color:var(--cream); padding:90px 0 0; }
  .hero-inner{ max-width:1180px; margin:0 auto; padding:0 32px; display:grid; gap:22px; position:relative; z-index:2; }
  .hero h1{ font-size:clamp(36px, 5.8vw, 66px); line-height:1.04; max-width:760px; color:var(--cream); }
  .hero h1 em{ font-style:italic; color:var(--gold); font-weight:450; }
  .hero p.lede{ max-width:520px; font-size:17px; line-height:1.65; color:rgba(251,243,229,0.86); font-weight:500; }
  .hero-cta-row{ display:flex; gap:14px; flex-wrap:wrap; margin-top:6px; align-items:center; }
  .price-pill{ display:inline-flex; align-items:center; gap:8px; background:var(--gold); color:var(--red-deep); font-weight:800; font-size:13.5px; padding:11px 18px; border-radius:999px; letter-spacing:0.01em; }
  .hero-stats{ margin-top:52px; padding-top:26px; border-top:1px solid rgba(251,243,229,0.18); display:grid; grid-template-columns:repeat(2,1fr); gap:26px 20px; }
  @media (min-width:720px){ .hero-stats{ grid-template-columns:repeat(4,1fr); } }
  .hero-stats .num{ font-family:'Fraunces',serif; font-size:clamp(26px,3.2vw,38px); font-weight:560; color:var(--gold); }
  .hero-stats .lbl{ font-size:12px; color:rgba(251,243,229,0.72); font-weight:600; margin-top:4px; }

  .hand-illustration{ display:block; width:100%; height:auto; margin-top:56px; }

  .steps-divider{ display:block; width:100%; height:34px; }

  /* ---------- SECTION SHELLS ---------- */
  section{ padding:92px 0; }
  .section-head{ max-width:640px; margin-bottom:52px; }
  .section-head h2{ font-size:clamp(29px,3.4vw,42px); margin-top:10px; line-height:1.1; }
  .section-head p{ margin-top:16px; font-size:16px; line-height:1.7; color:var(--ink-soft); }

  /* ---------- ABOUT ---------- */
  .about{ background:var(--cream); }
  .about-grid{ display:grid; gap:56px; }
  @media (min-width:900px){ .about-grid{ grid-template-columns:1fr 1fr; align-items:center; } }
  .about-copy p{ font-size:16px; line-height:1.75; color:var(--ink-soft); margin:0 0 16px; }
  .about-copy p:last-child{ margin-bottom:0; }
  .about-art{ background:var(--paper); border:1px solid var(--line); border-radius:4px; padding:34px; position:relative; overflow:hidden; }
  .about-art svg{ width:100%; height:auto; }
  .about-art img{ width:100%; height:auto; border-radius:4px; display:block; }
  .about-art-cap{ margin-top:18px; font-size:13px; color:var(--stone); text-align:center; font-weight:600; }
  .about-tags{ display:flex; flex-wrap:wrap; gap:10px; margin-top:26px; }
  .tag{ font-size:12.5px; font-weight:700; letter-spacing:0.03em; color:var(--red-dark); border:1px solid rgba(190,42,46,0.3); padding:8px 14px; border-radius:999px; }

  /* ---------- FEATURED PROJECT ---------- */
  .featured{ background:var(--red-deep); color:var(--cream); position:relative; overflow:hidden; }
  .featured .eyebrow{ color:var(--gold); }
  .feat-top{ display:flex; justify-content:space-between; align-items:flex-start; gap:24px; flex-wrap:wrap; margin-bottom:8px; }
  .feat-badge{ background:var(--purple); color:var(--cream); font-size:12px; font-weight:800; letter-spacing:0.05em; text-transform:uppercase; padding:8px 14px; border-radius:999px; }
  .feat-title{ font-size:clamp(30px,4vw,48px); margin-top:14px; color:var(--cream); }
  .feat-sub{ font-size:16px; color:rgba(251,243,229,0.78); margin-top:14px; max-width:560px; line-height:1.7; }
  .feat-price-row{ display:flex; gap:16px; flex-wrap:wrap; margin-top:26px; align-items:center; }
  .feat-price{ background:var(--gold); color:var(--red-deep); font-weight:800; padding:14px 22px; border-radius:4px; font-size:15px; }
  .feat-price b{ font-family:'Fraunces',serif; font-size:22px; display:block; margin-top:2px; }
  .feat-visual{ margin-top:48px; background:rgba(251,243,229,0.06); border:1px solid rgba(251,243,229,0.16); border-radius:6px; padding:0; overflow:hidden; max-width:520px; }
  .feat-visual svg{ width:100%; height:auto; }
  .feat-visual img{ width:100%; height:auto; display:block; }

  /* ---------- BROCHURE GALLERY ---------- */
  .gallery{ background:var(--paper); }
  .gallery-grid{ display:grid; gap:22px; }
  @media (min-width:760px){ .gallery-grid{ grid-template-columns:repeat(2,1fr); } }
  .gallery-card{ background:var(--cream); border:1px solid var(--line); border-radius:6px; overflow:hidden; box-shadow:var(--shadow); transition:transform .3s ease; }
  .gallery-card:hover{ transform:translateY(-4px); }
  .gallery-card img{ width:100%; height:auto; display:block; }
  .gallery-card .cap{ padding:16px 18px; font-size:13.5px; font-weight:700; color:var(--ink-soft); }
  .feat-tags{ display:flex; flex-wrap:wrap; gap:10px; margin-top:24px; }
  .feat-tags span{ font-size:12.5px; font-weight:700; color:var(--gold); border:1px solid rgba(228,162,56,0.4); padding:8px 14px; border-radius:999px; }

  /* ---------- LOCATION ---------- */
  .location{ background:var(--cream); }
  .loc-grid{ display:grid; gap:1px; background:var(--line); border:1px solid var(--line); margin-top:8px; }
  @media (min-width:720px){ .loc-grid{ grid-template-columns:repeat(2,1fr); } }
  @media (min-width:1040px){ .loc-grid{ grid-template-columns:repeat(3,1fr); } }
  .loc-card{ background:var(--cream); padding:28px 26px; display:flex; gap:16px; align-items:flex-start; }
  .loc-card .icon{ width:36px; height:36px; flex:none; }
  .loc-card h3{ font-size:16px; font-weight:650; line-height:1.35; }

  /* ---------- AMENITIES ---------- */
  .amenities{ background:var(--paper); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
  .amen-grid{ display:grid; gap:1px; background:var(--line); border:1px solid var(--line); }
  @media (min-width:720px){ .amen-grid{ grid-template-columns:repeat(2,1fr); } }
  @media (min-width:1040px){ .amen-grid{ grid-template-columns:repeat(4,1fr); } }
  .amen-card{ background:var(--paper); padding:32px 26px; }
  .amen-card .icon{ width:38px; height:38px; margin-bottom:18px; }
  .amen-card h3{ font-size:17px; font-weight:650; margin-bottom:8px; }
  .amen-card p{ font-size:14px; line-height:1.6; color:var(--ink-soft); margin:0; }

 /* ---------- AREA STATEMENT / PRICING ---------- */

.area-statement{
  background:var(--cream);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}

.area-table-wrap{
  overflow-x:auto;
  overflow-y:hidden;

  border:1px solid var(--line);
  background:var(--paper);
  box-shadow:var(--shadow);

  -webkit-overflow-scrolling:touch;
}

.area-table{
  width:100%;
  min-width:760px;
  border-collapse:collapse;
  font-size:13.5px;
}

.area-table th{
  background:var(--red-deep);
  color:var(--cream);

  padding:15px 14px;

  text-align:left;

  font-size:12px;
  font-weight:700;
  letter-spacing:0.05em;
  text-transform:uppercase;

  white-space:nowrap;
}

.area-table td{
  padding:14px;

  border-top:1px solid var(--line);

  color:var(--ink-soft);
  font-weight:600;

  white-space:nowrap;
}

.area-table tbody tr{
  transition:background .2s ease;
}

.area-table tbody tr:hover{
  background:rgba(228,162,56,0.08);
}

.area-table .floor{
  font-family:'Fraunces',serif;

  color:var(--red-deep);

  font-size:16px;
  font-weight:560;
}

.area-table .flat{
  color:var(--ink);
  font-weight:700;
}

.area-table .price{
  color:var(--red-dark);
  font-weight:800;
}

.area-note{
  margin-top:16px;

  font-size:12.5px;
  line-height:1.6;

  color:var(--stone);
}


/* =========================================================
   TABLET ONLY
   641px - 900px
   ========================================================= */

@media (min-width:641px) and (max-width:900px){

  .area-table-wrap{
    overflow-x:hidden;
  }

  .area-table{
    width:100%;
    min-width:0;

    table-layout:fixed;

    font-size:11px;
  }

  .area-table th{
    padding:11px 6px;

    font-size:9px;

    letter-spacing:.025em;

    white-space:normal;

    line-height:1.25;
  }

  .area-table td{
    padding:11px 6px;

    font-size:11px;

    white-space:nowrap;
  }

  .area-table .floor{
    font-size:13px;
    line-height:1.25;
  }

  .area-table .flat{
    font-size:11px;
  }

  .area-table .price{
    font-size:11px;
  }

  .area-note{
    font-size:11.5px;
  }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width:640px){

  .area-statement{
    overflow:hidden;
  }

  .area-table-wrap{
    margin-left:-20px;
    margin-right:-20px;

    overflow-x:auto;
    overflow-y:hidden;

    border-left:0;
    border-right:0;

    box-shadow:none;
  }

  .area-table{
    min-width:760px;

    font-size:12px;
  }

  .area-table th{
    padding:12px 10px;

    font-size:10px;

    letter-spacing:.04em;

    white-space:nowrap;
  }

  .area-table td{
    padding:12px 10px;

    font-size:12px;
  }

  .area-table .floor{
    font-size:14px;
  }

  .area-table .flat{
    font-size:12px;
  }

  .area-table .price{
    font-size:12px;
  }

  .area-note{
    margin-top:14px;

    font-size:11.5px;
    line-height:1.6;
  }

}

/* =========================================================
   PAYMENT STATEMENT
   ========================================================= */

.payment-plan{
  background:var(--cream);
  padding:96px 0;
}

.payment-box{
  margin-top:52px;

  background:var(--paper);

  border:1px solid var(--line);

  box-shadow:var(--shadow);
}

.payment-box-title{
  padding:24px 34px;

  border-bottom:1px solid var(--line);
}

.payment-box-title span{
  font-family:'Fraunces',serif;

  font-size:28px;
  line-height:1.2;
  font-weight:560;

  color:var(--ink);
}

.payment-row{
  display:grid;

  grid-template-columns:minmax(0,1fr) auto;

  align-items:center;

  gap:20px;

  padding:17px 34px;

  border-bottom:1px solid var(--line);

  color:var(--ink-soft);

  font-size:14px;
  line-height:1.5;

  transition:background .2s ease;
}

.payment-row span{
  min-width:0;
}

.payment-row strong{
  color:var(--red-dark);

  font-size:14px;
  font-weight:800;

  white-space:nowrap;
}

.payment-row:last-child{
  border-bottom:none;
}

.payment-row:hover{
  background:rgba(228,162,56,.06);
}


/* FINAL TOTAL */

.payment-row.payment-total{
  background:var(--red-deep);
}

.payment-row.payment-total span,
.payment-row.payment-total strong{
  color:var(--cream);
}

.payment-row.payment-total:hover{
  background:var(--red-deep);
}


/* =========================================================
   ADDITIONAL CHARGES
   ========================================================= */

.charges-box{
  margin-top:48px;

  padding:34px;

  background:var(--paper);

  border:1px solid var(--line);

  box-shadow:var(--shadow);
}

.charges-box h3{
  margin:8px 0 24px;

  font-family:'Fraunces',serif;

  font-size:28px;
  line-height:1.2;
  font-weight:560;

  color:var(--ink);
}

.charges-list{
  border-top:1px solid var(--line);
}

.charge-row{
  display:flex;

  align-items:center;
  justify-content:space-between;

  gap:20px;

  padding:16px 0;

  border-bottom:1px solid var(--line);

  color:var(--ink-soft);

  font-size:14px;
  line-height:1.5;
}

.charge-row strong{
  color:var(--red-dark);

  font-weight:800;

  white-space:nowrap;
}


/* =========================================================
   360° VIRTUAL VIEW
   ========================================================= */

.virtual-view{
  background:var(--paper);
  padding:96px 0;
}

.viewer-wrapper{
  margin-top:52px;
}

.viewer{
  position:relative;

  width:100%;
  height:600px;

  overflow:hidden;

  background:var(--red-deep);

  border:1px solid var(--line);

  box-shadow:var(--shadow);

  cursor:grab;

  user-select:none;

  touch-action:none;
}

.viewer:active{
  cursor:grabbing;
}

.viewer img{
  position:absolute;

  top:50%;
  left:50%;

  width:auto;
  height:100%;

  max-width:none;

  user-select:none;
  pointer-events:none;

  -webkit-user-drag:none;
}

.viewer-hint{
  position:absolute;

  left:50%;
  bottom:24px;

  transform:translateX(-50%);

  display:flex;

  align-items:center;

  gap:9px;

  padding:10px 17px;

  background:rgba(36,26,22,.78);

  color:var(--cream);

  font-size:12px;
  font-weight:700;

  letter-spacing:.03em;

  pointer-events:none;

  white-space:nowrap;
}

.viewer-hint span{
  color:var(--gold);

  font-size:17px;
}

.zoom-controls{
  position:absolute;

  top:22px;
  right:22px;

  display:flex;

  flex-direction:column;

  gap:7px;
}

.zoom-controls button{
  width:42px;
  height:42px;

  border:1px solid rgba(251,243,229,.25);

  background:rgba(36,26,22,.78);

  color:var(--cream);

  font-size:20px;

  cursor:pointer;

  transition:background .2s ease;
}

.zoom-controls button:hover{
  background:var(--red-dark);
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width:900px){

  .payment-plan{
    padding:82px 0;
  }

  .virtual-view{
    padding:82px 0;
  }

  .viewer{
    height:500px;
  }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width:640px){

  /* ---------- GENERAL SECTION HEADINGS ---------- */

  .section-head h2{
    font-size:30px;
    line-height:1.15;
  }

  .section-head p{
    margin-top:14px;

    font-size:14px;
    line-height:1.65;
  }

  .eyebrow{
    font-size:11px;
    letter-spacing:.14em;
  }


  /* ---------- AREA STATEMENT ---------- */

  .area-statement{
    overflow:hidden;
  }

  .area-table-wrap{
    margin-left:-20px;
    margin-right:-20px;

    border-left:0;
    border-right:0;

    box-shadow:none;
  }

  .area-table{
    min-width:760px;

    font-size:12px;
  }

  .area-table th{
    padding:12px 10px;

    font-size:10px;
    letter-spacing:.04em;
  }

  .area-table td{
    padding:12px 10px;

    font-size:12px;
  }

  .area-table .floor{
    font-size:14px;
  }

  .area-table .flat{
    font-size:12px;
  }

  .area-table .price{
    font-size:12px;
  }

  .area-note{
    margin-top:14px;

    font-size:11.5px;
    line-height:1.6;
  }


  /* ---------- PAYMENT STATEMENT ---------- */

  .payment-plan{
    padding:72px 0;
  }

  .payment-box{
    margin-top:36px;
  }

  .payment-box-title{
    padding:20px;
  }

  .payment-box-title span{
    font-size:23px;
  }

  .payment-row{
    grid-template-columns:minmax(0,1fr) auto;

    gap:15px;

    padding:15px 20px;

    font-size:13px;
  }

  .payment-row span{
    line-height:1.45;
  }

  .payment-row strong{
    font-size:13px;
  }


  /* ---------- ADDITIONAL CHARGES ---------- */

  .charges-box{
    margin-top:36px;

    padding:24px 20px;
  }

  .charges-box h3{
    font-size:23px;
    line-height:1.25;
  }

  .charge-row{
    min-height:52px;

    padding:14px 0;

    gap:12px;
  }

  .charge-row span{
    font-size:13px;
  }

  .charge-row strong{
    font-size:13px;
  }


  /* ---------- 360° VIEW ---------- */

  .virtual-view{
    padding:72px 0;

    overflow:hidden;
  }

  .viewer-wrapper{
    margin-top:36px;
  }

  .viewer{
    height:360px;

    border-left:0;
    border-right:0;

    box-shadow:none;
  }

  .viewer-hint{
    bottom:16px;

    padding:9px 14px;

    font-size:11px;
  }

  .viewer-hint span{
    font-size:15px;
  }

  .zoom-controls{
    top:14px;
    right:14px;

    gap:6px;
  }

  .zoom-controls button{
    width:38px;
    height:38px;

    font-size:18px;
  }

}
  /* ---------- PROCESS ---------- */
  .process{ background:var(--ink); color:var(--cream); position:relative; overflow:hidden; }
  .process .section-head p{ color:rgba(251,243,229,0.72); }
  .process .section-head .eyebrow{ color:var(--gold); }
  .process .section-head h2{ color:var(--cream); }
  .process-list{ display:grid; gap:0; border-top:1px solid rgba(251,243,229,0.14); }
  .process-item{ display:grid; grid-template-columns:64px 1fr; gap:22px; padding:26px 0; border-bottom:1px solid rgba(251,243,229,0.14); }
  @media (min-width:720px){ .process-item{ grid-template-columns:80px 220px 1fr; } }
  .process-num{ font-family:'Fraunces',serif; font-size:28px; color:var(--gold); font-weight:450; }
  .process-item h3{ font-size:18px; font-weight:600; }
  .process-item p{ font-size:14.5px; line-height:1.6; color:rgba(251,243,229,0.68); margin:8px 0 0; }
  @media (min-width:720px){ .process-item p{ margin-top:0; } }

  /* ---------- TESTIMONIALS ---------- */
  .testimonials{ background:var(--cream); }
  .test-grid{ display:grid; gap:24px; }
  @media (min-width:820px){ .test-grid{ grid-template-columns:repeat(3,1fr); } }
  .test-card{ background:var(--paper); border:1px solid var(--line); border-radius:4px; padding:28px 24px; display:flex; flex-direction:column; gap:16px; }
  .quote-mark{ font-family:'Fraunces',serif; font-size:40px; color:var(--gold); line-height:1; }
  .test-card p.quote{ font-size:14.5px; line-height:1.68; color:var(--ink-soft); flex:1; }
  .test-who{ display:flex; align-items:center; gap:12px; border-top:1px solid var(--line); padding-top:14px; }
  .test-avatar{ width:36px; height:36px; border-radius:50%; background:var(--red); display:flex; align-items:center; justify-content:center; color:var(--cream); font-weight:700; font-size:13px; flex:none; }
  .test-who .name{ font-size:13.5px; font-weight:700; }
  .test-who .role{ font-size:12px; color:var(--stone); }

  /* ---------- CTA BAND ---------- */
  .cta-band{ background:var(--gold); color:var(--red-deep); position:relative; overflow:hidden; }
  .cta-inner{ display:grid; gap:28px; align-items:center; }
  @media (min-width:820px){ .cta-inner{ grid-template-columns:1.3fr auto; } }
  .cta-inner h2{ font-size:clamp(25px,3.2vw,36px); color:var(--red-deep); }
  .cta-inner p{ margin-top:12px; font-size:15px; color:rgba(78,14,16,0.78); max-width:480px; line-height:1.6; }
  .btn-dark{ background:var(--ink); color:var(--cream); }
  .btn-dark:hover{ background:#000; }
  .cta-buttons{ display:flex; gap:14px; flex-wrap:wrap; }

  /* ---------- FOOTER ---------- */
  footer{ background:var(--ink); color:rgba(251,243,229,0.75); padding:60px 0 26px; }
  .foot-grid{ display:grid; gap:38px; }
  @media (min-width:820px){ .foot-grid{ grid-template-columns:1.3fr 0.9fr 1fr 1fr; } }
  .foot-brand{ display:flex; align-items:center; gap:12px; margin-bottom:14px; }
  .foot-brand .k{ font-family:'Fraunces',serif; color:var(--cream); font-size:19px; font-weight:650; }
  footer p{ font-size:13.5px; line-height:1.7; max-width:300px; }
  footer h4{ color:var(--cream); font-size:13px; letter-spacing:0.08em; text-transform:uppercase; margin-bottom:16px; font-weight:700; }
  footer ul{ list-style:none; padding:0; margin:0; display:grid; gap:10px; }
  footer ul a{ font-size:13.5px; transition:color .2s ease; }
  footer ul a:hover{ color:var(--gold); }
  .foot-bottom{ margin-top:52px; padding-top:22px; border-top:1px solid rgba(251,243,229,0.12); display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; font-size:12px; color:rgba(251,243,229,0.45); }

  .reveal{ opacity:0; transform:translateY(18px); transition:opacity .7s ease, transform .7s ease; }
  .reveal.in{ opacity:1; transform:none; }