/* ============================================================
   franco-media.com - agent pages (TASK-N44.4, ruling JS)
   The Banyan Living agent page and any page listed in
   GPCF_AGENT_PAGE_IDS (inc/env.php). Enqueued on those pages only,
   after tokens.css (inc/n44.php).

   Tokens only: no colour value and no font name outside tokens.css.
   Part C rewrites the band rows and the residence blocks of the page
   to these classes, without inline styles, and removes the two
   hidden raw HTML rows whose CSS and script now live in this file
   and in assets/js/agent-page.js.

   Contrast (WCAG 2.1, measured on the token values):
   - band label, on-dark on dark-teal (solid bar, N44b ruling JT3): 7.28:1
   - @SIAM code, cta-ink on cta: 8.47:1; on cta-hover 4.95:1
   - copy label, cta-ink at .85 on cta: 6.81:1; on hover the label goes
     to full opacity, 4.95:1 (at .85 it would be 4.32:1)
   - band copy, text on card: 15.9:1; strong, heading-2 on card: 7.28:1;
     link, link on card: 7.28:1; link hover 19.08:1
   - residence card: h4 heading-2 on card 7.28:1; place, muted on card
     4.97:1; specs, text on card 15.9:1; chip, text on card 15.9:1;
     button, cta-ink on cta 8.47:1, on cta-hover 4.95:1
   N44c (ruling JW): the residence card h4, place and specs lines and the
   brand heading are scoped one step higher, so the theme's body rules
   (.entry-content h3, .entry-content :is(h4, h5, h6), .entry-content p)
   and WPBakery's .wpb_text_column :last-child cannot override them.
   N44d (ruling JY): WPBakery's #content .wpb_text_column :last-child
   (specificity 1,2,0) sets margin-bottom 0 on a heading that closes its
   text block, and no class-only selector outranks it. The brand heading
   therefore keeps its 8px gap below as padding, not margin.
   ============================================================ */

/* ---------- (a) utility rules, from the decoded block of the page body ---------- */

.siam-hidden-util,
.wpb_column.siam-hidden-util{
  display:none;
}

.siam-tabfix .vc_tta-tabs-list .vc_tta-title-text,
.siam-tabfix .vc_tta-panel-heading .vc_tta-title-text,
.siam-tabfix .vc_tta-panel-title .vc_tta-title-text{
  color:var(--on-dark);
  font-family:var(--font-display);
  font-weight:700;
}
@media (max-width:600px){
  .siam-tabfix .vc_tta-title-text{ font-size:13px; }
}

.siam-pulse-dot::after{
  content:'';
  position:absolute;
  top:50%;
  left:50%;
  width:100%;
  height:100%;
  border-radius:50%;
  background:inherit;
  transform:translate(-50%,-50%);
  animation:siamPulseRipple 1.8s ease-out infinite;
}
@keyframes siamPulseRipple{
  0%{ opacity:.65; transform:translate(-50%,-50%) scale(1); }
  100%{ opacity:0; transform:translate(-50%,-50%) scale(3.4); }
}
@keyframes siamFadeSlideIn{
  from{ opacity:0; transform:translateY(8px); }
  to{ opacity:1; transform:translateY(0); }
}
.siam-fade-text{
  animation:siamFadeSlideIn .9s ease-out both;
}

/* ---------- (b) the discount band ---------- */

.siam-band{
  max-width:820px;
  margin:10px auto 30px;
  background:var(--os-card);
  border:1px solid var(--os-line);
  border-radius:var(--radius-card);
  box-shadow:var(--shadow-floating);
  overflow:hidden;
  font-family:var(--font-body);
}
.siam-band-bar{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:13px 22px;
  background:var(--os-dark-teal);
}
.siam-band-bar .label{
  color:var(--on-dark);
  font-family:var(--font-display);
  font-size:11px;
  font-weight:700;
  letter-spacing:2px;
  text-transform:uppercase;
}
.siam-pulse-dot{
  position:relative;
  display:inline-block;
  flex:none;
  width:10px;
  height:10px;
  border-radius:50%;
  background:var(--os-pearl-aqua);
}
.siam-band-row{
  display:flex;
  flex-wrap:wrap;
}
.siam-band-copy{
  flex:2 1 320px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:26px 28px;
  color:var(--os-text);
  font-size:18px;
  line-height:1.6;
  text-align:center;
}
.siam-band-copy p{
  margin:0;
  color:inherit;
  font-size:inherit;
  line-height:inherit;
}
.siam-band-copy strong{
  color:var(--os-heading-2);
}
.siam-band-copy a{
  color:var(--os-link);
  text-decoration:underline;
  text-underline-offset:3px;
}
.siam-band-copy a:hover,
.siam-band-copy a:focus-visible{
  color:var(--os-link-hover);
}
.siam-code-panel{
  flex:1 1 220px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:22px 26px;
  background:var(--os-tint-warm);
}
.siam-copy-box{
  width:100%;
  padding:16px 18px;
  background:var(--os-cta);
  color:var(--os-cta-ink);
  border:0;
  border-radius:var(--radius-card);
  cursor:pointer;
  text-align:center;
  transition:background .2s;
  animation:siamSoftPulse 2.4s ease-out infinite;
}
.siam-copy-box:hover,
.siam-copy-box:focus-visible{
  background:var(--os-cta-hover);
  animation:none;
}
.siam-copy-box:focus-visible{
  outline:2px solid var(--os-dark-teal);
  outline-offset:3px;
}
.siam-copy-box .code{
  font-family:var(--font-display);
  font-size:26px;
  font-weight:800;
  letter-spacing:2px;
  line-height:1.2;
}
.siam-copy-label{
  margin-top:6px;
  font-family:var(--font-body);
  font-size:11px;
  font-weight:700;
  letter-spacing:1.5px;
  text-transform:uppercase;
  opacity:.85;
}
.siam-copy-box:hover .siam-copy-label,
.siam-copy-box:focus-visible .siam-copy-label{
  opacity:1;
}
@keyframes siamSoftPulse{
  0%{ box-shadow:0 0 0 0 rgba(var(--os-cta-rgb),.45); }
  70%{ box-shadow:0 0 0 14px rgba(var(--os-cta-rgb),0); }
  100%{ box-shadow:0 0 0 14px rgba(var(--os-cta-rgb),0); }
}

/* ---------- (c) the residence cards ---------- */

.siam-res-card{
  display:flex;
  flex-direction:column;
  height:100%;
  background:var(--os-card);
  border:1px solid var(--os-line);
  border-radius:var(--radius-card);
  overflow:hidden;
  box-shadow:0 3px 14px rgba(var(--os-ink-rgb),.07);
}
.siam-res-media{
  position:relative;
}
.siam-res-media img{
  display:block;
  width:100%;
  height:210px;
  object-fit:cover;
}
.siam-res-chip{
  position:absolute;
  top:12px;
  left:12px;
  padding:5px 11px;
  background:var(--os-card);
  color:var(--os-text);
  font-size:11px;
  font-weight:700;
  letter-spacing:.3px;
  border-radius:var(--radius-pill);
  box-shadow:0 1px 5px rgba(var(--os-ink-rgb),.18);
}
.siam-res-body{
  flex:1;
  display:flex;
  flex-direction:column;
  padding:18px;
}
.siam-res-card h4,
.entry-content .siam-res-card .siam-res-body h4{
  margin:0 0 10px;
  color:var(--os-heading-2);
  font-family:var(--font-display);
  font-size:15.5px;
  font-weight:700;
  line-height:1.5;
  letter-spacing:normal;
  text-transform:none;
}
.siam-res-place,
.entry-content .siam-res-card .siam-res-place{
  margin:0 0 12px;
  color:var(--os-muted);
  font-size:12.5px;
}
.siam-res-specs,
.entry-content .siam-res-card .siam-res-specs{
  margin:0 0 14px;
  padding-top:10px;
  border-top:1px solid var(--os-line);
  color:var(--os-text);
  font-size:13px;
}
.siam-res-btn{
  display:block;
  margin-top:auto;
  padding:11px 16px;
  background:var(--os-cta);
  color:var(--os-cta-ink);
  font-family:var(--font-display);
  font-size:14px;
  font-weight:700;
  text-align:center;
  text-decoration:none;
  border-radius:8px;
}
.siam-res-btn:hover,
.siam-res-btn:focus-visible{
  background:var(--os-cta-hover);
  color:var(--os-cta-ink);
}
.siam-res-btn:focus-visible{
  outline:2px solid var(--os-dark-teal);
  outline-offset:2px;
}
.siam-brand-h,
.entry-content h3.siam-brand-h{
  margin:26px 0 0;
  padding-bottom:8px;
  color:var(--os-heading-2);
  font-family:var(--font-display);
  font-size:17px;
  font-weight:700;
  line-height:1.4;
}
.siam-res-figure{
  margin:0 0 18px;
  border-radius:var(--radius-card);
  overflow:hidden;
}

/* ---------- reduced motion: every animation of this file stops ---------- */

@media (prefers-reduced-motion:reduce){
  .siam-pulse-dot::after,
  .siam-fade-text,
  .siam-copy-box{
    animation:none;
  }
  .siam-copy-box{
    transition:none;
  }
}