/* Section 02 "Coastal living for a simpler kind of happier." fixes (2026-09-25). Loads after coastal-living-900.css.
   - Plate: assets/img/coastal-living-fix/plate.webp = the pool plate with the baked button oval painted out and every
     pixel outside the stat panel dissolved into the page cream by the slot's bottom edge (no horizontal cut line);
     the panel itself and its drop shadow are untouched / re-drawn on the cream. Built by /root/sandpiper-coast-fix/plate/build.py.
   - Lead: client spec (Newsreader 500 24/1.35, -.012em, #0b4b69, max 560, margin 30 0 0 2) in --lp = 1px at the 1900 frame.
   - Button: sits on the lead's left edge, 36px under the lead's 4 lines; the oval is now CSS and wears the stat panel's
     material (panel cream fill, warm-tan hairline, white inner highlight, soft warm shadow); chevron is an equal-armed SVG. */

/* Keep the section's requested top padding explicit at every viewport width. */
.ix-sec{padding-top:150px}

.coast{--lp:calc(100cqw / 1900)}

.coast__lead{
  margin:calc(30 * var(--lp)) 0 0 calc(2 * var(--lp));
  width:calc(560 * var(--lp));
  max-width:calc(560 * var(--lp));
  color:#0b4b69;
  font:500 calc(24 * var(--lp))/1.35 "CSF News",Georgia,serif;
  letter-spacing:-.012em;
}

/* lead top (372u) + margin 30 + 4 lines x 32.4 + 36 gap */
.coast__more{
  left:calc(148.4 * var(--ux) + 2 * var(--lp));
  top:calc(372 * var(--u) + 195.6 * var(--lp));
  width:calc(243 * var(--ux));
  height:calc(56 * var(--u));
  box-sizing:border-box;
  font-family:"CSF News",Georgia,serif;
  /* 8.2u top padding drops the flex-centred label 4.1u so its cap-to-baseline ink centres in the oval, level with the chevron */
  padding:calc(8.2 * var(--u)) calc(50 * var(--ux)) 0 calc(33 * var(--ux));
  background:#fcf8f0;
  border:calc(1.35 * var(--u)) solid #dcc6ad;
  box-shadow:inset 0 calc(1 * var(--u)) 0 rgba(255,255,255,.75),0 calc(2 * var(--u)) calc(7 * var(--u)) rgba(150,112,72,.12);
}
.coast__more:hover{background:#f6efe3}

.coast__more::after{
  right:calc(29 * var(--ux));
  top:50%;
  width:calc(8 * var(--u));
  height:calc(14 * var(--u));
  border:0;
  background:currentColor;
  transform:translateY(-50%);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 14'%3E%3Cpath d='M1 1l6 6-6 6' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/100% 100% no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 14'%3E%3Cpath d='M1 1l6 6-6 6' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/100% 100% no-repeat;
}
