/* Coastal Stays footer (09): replica of the client comp coastal-stays-footer-perfect-html/design.png.
   Generated by /root/sandpiper-cfooter/gen.py from params.json - edit params, not this file.
   Frame 1900 like every section above; --u = frame / 1672 (same unit as the Good Sam section).
   The plate is the comp with all type and UI painted out (LaMa), plus 200 comp px of sky above it that dissolves into the
   page cream with an irregular edge, and a soft fade on both sides, so there is no horizontal or vertical seam.
   "Coastal Stays." / "Lasting Memories." use the hero's Classic Resort pairing (Bauer Bodoni + Snell Roundhand). */
@font-face{font-family:"CSF Bodoni";src:url("../fonts/library/bauer-bodoni/bauer-bodoni-400.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"CSF Snell";src:url("../fonts/library/snell-roundhand/snell-roundhand-400.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"CSF News";src:url("../fonts/hero/newsreader-var.woff2") format("woff2");font-weight:200 800;font-display:swap}
@font-face{font-family:"CSF Mont";src:url("../fonts/hero/montserrat-var.woff2") format("woff2");font-weight:100 900;font-display:swap}

.csf{--navy:#0b2a60;--head:#073b57;--sand:#917658;--gold:#a0722e;position:relative;z-index:1;width:100%;margin:0;overflow:hidden;background:transparent;text-rendering:geometricPrecision;-webkit-font-smoothing:antialiased}
.csf__stage{position:relative;width:min(100%,1900px);margin:0 auto;aspect-ratio:1672/1181;container-type:inline-size;--u:calc(100cqw / 1672)}
.csf__plate{position:absolute;inset:0;display:block;width:100%;height:100%;max-width:none;object-fit:fill;pointer-events:none;user-select:none;-webkit-user-drag:none}
.csf__stage :where(h2,h3,p,ul,li,address){margin:0;padding:0;list-style:none;font-style:normal;font-weight:inherit}
.csf__photo-copy,.csf__title,.csf__lead,.csf__col,.csf__col ul,.csf__col address,.csf__partners{position:static}
.csf__run,.csf__rule,.csf__icon,.csf__social,.csf__logo,.csf__partner,.csf__swash,.csf__hit{position:absolute;z-index:2}
.csf__run{display:block;white-space:nowrap;line-height:1;color:var(--navy);font-family:"CSF News",Georgia,serif;font-optical-sizing:auto;text-decoration:none}
.csf__run--head{font-family:"CSF Bodoni",Georgia,serif;font-weight:400}
.csf__run--script{font-family:"CSF Snell",Georgia,serif;font-weight:400}
.csf__run--lead1{font-family:"CSF News",Georgia,serif;font-weight:450}
.csf__run--lead2{font-family:"CSF News",Georgia,serif;font-weight:450}
.csf__run--ql{font-family:"CSF News",Georgia,serif;font-weight:450}
.csf__run--l_home{font-family:"CSF News",Georgia,serif;font-weight:420}
.csf__run--l_about{font-family:"CSF News",Georgia,serif;font-weight:420}
.csf__run--l_amen{font-family:"CSF News",Georgia,serif;font-weight:420}
.csf__run--l_rates{font-family:"CSF News",Georgia,serif;font-weight:420}
.csf__run--l_gallery{font-family:"CSF News",Georgia,serif;font-weight:420}
.csf__run--l_contact{font-family:"CSF News",Georgia,serif;font-weight:420}
.csf__run--ri{font-family:"CSF News",Georgia,serif;font-weight:450}
.csf__run--addr1{font-family:"CSF News",Georgia,serif;font-weight:420}
.csf__run--addr2{font-family:"CSF News",Georgia,serif;font-weight:420}
.csf__run--phone{font-family:"CSF News",Georgia,serif;font-weight:420}
.csf__run--email{font-family:"CSF News",Georgia,serif;font-weight:420}
.csf__run--fu{font-family:"CSF News",Georgia,serif;font-weight:450}
.csf__run--powered{font-family:"CSF Mont",Georgia,serif;font-weight:500}
.csf__run--proud{font-family:"CSF Mont",Georgia,serif;font-weight:500}
.csf__run--accept{font-family:"CSF Mont",Georgia,serif;font-weight:500}
.csf__head{color:var(--head)}
.csf__script{color:var(--sand);transform:rotate(-1.5deg);transform-origin:0 50%;-webkit-text-stroke:calc(.2 * var(--u)) currentColor}
.csf__label{text-transform:uppercase}
.csf__col a.csf__run:hover{text-decoration:underline;text-underline-offset:calc(3 * var(--u))}
.csf__rule{display:block;background:var(--gold)}
.csf__icon{display:grid;place-items:center;border-radius:50%;background:#9d682a;color:#fff}
.csf__icon svg{width:56%;height:56%}
.csf__social{display:grid;place-items:center;border-radius:50%;background:#063158;color:#fff;transition:background-color .2s ease,transform .2s ease}
.csf__social svg{width:56%;height:56%}
.csf__social:hover{background:#0b5a86;transform:translateY(calc(-2 * var(--u)))}
.csf__logo{display:block;overflow:hidden;border-radius:calc(9 * var(--u));line-height:0}
.csf__logo img{display:block;width:100%;height:100%;object-fit:cover}
.csf__partner{display:block;object-fit:contain}
.csf__partner img{display:block;width:100%;height:100%;object-fit:contain}
.csf__tile{position:absolute;z-index:2;display:block;overflow:hidden;border-radius:calc(4 * var(--u));background:#fff}
.csf__tile img{position:absolute;display:block;max-width:none}
.csf__social--fb svg{width:70%;height:70%}
.csf__swash{display:block;pointer-events:none}
.csf__pair,.csf__cards{display:contents}
.csf__hit{display:block;z-index:3}
.csf :focus-visible{outline:2px solid var(--navy);outline-offset:3px;border-radius:4px}
@media (prefers-reduced-motion:reduce){.csf__social{transition:none}}

/* ---------- below 1100: stacked footer (the comp's type would fall under 9px) ---------- */
@media (max-width:1100px){
  .csf__stage{--u:1px;aspect-ratio:auto;display:grid;grid-template-columns:minmax(0,1fr);padding:0 var(--m,48px) 30px;background:linear-gradient(to bottom,rgba(248,239,230,0) 0,rgba(248,239,230,0) 520px,#f8efe6 640px)}
  .csf__plate{position:absolute;inset:0 auto auto -85px;width:1296px;height:auto;aspect-ratio:1672/1181;-webkit-mask-image:linear-gradient(to bottom,#000 0,#000 520px,transparent 640px);mask-image:linear-gradient(to bottom,#000 0,#000 520px,transparent 640px)}
  .csf .csf__run,.csf .csf__rule,.csf .csf__icon,.csf .csf__social,.csf .csf__logo,.csf .csf__partner,.csf .csf__tile,.csf .csf__hit{position:relative!important;left:auto!important;top:auto!important}
  .csf__swash,.csf__hit{display:none!important}
  .csf__photo-copy{position:relative;z-index:2;padding:190px 0 0;min-height:560px}
  .csf__title{display:block}
  .csf .csf__head{font-size:clamp(52px,9vw,84px)!important;line-height:1}
  .csf .csf__script{margin:.1em 0 0 .3em;font-size:clamp(46px,8.2vw,76px)!important;line-height:1.05}
  .csf__lead{margin-top:22px}
  .csf .csf__lead .csf__run{font-size:clamp(17px,2.3vw,22px)!important;line-height:1.4;white-space:normal;display:inline}
  .csf__lead .csf__run--lead1::after{content:"";display:block}
  .csf__logo{grid-area:logo;width:130px!important;height:125px!important}
  .csf__col{position:relative;display:flex;flex-direction:column;align-items:flex-start}
  .csf__col .csf__rule{margin:10px 0 14px}
  .csf__col ul{display:flex;flex-direction:column;gap:6px}
  .csf__col--info address{display:grid;grid-template-columns:44px 1fr;column-gap:14px;row-gap:12px;align-items:center}
  .csf__col--info .csf__run--addr1{grid-column:2;grid-row:1}
  .csf__col--info .csf__run--addr2{grid-column:2;grid-row:1;margin-top:1.45em}
  .csf__col--info .csf__icon{grid-column:1}
  .csf__col--info address{grid-auto-rows:minmax(40px,auto)}
  .csf__col--info .csf__run--addr1,.csf__col--info .csf__run--addr2{align-self:start}
  .csf__col--info .csf__run--phone,.csf__col--info .csf__run--email{align-self:center}
  .csf__col--social{display:grid;grid-template-columns:repeat(3,auto);justify-content:start;align-content:start;column-gap:18px}
  .csf__col--social h3,.csf__col--social .csf__rule{grid-column:1 / -1}
  .csf__band{display:contents}
  .csf__partners{position:relative;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px 20px;margin-top:34px;padding-top:24px;border-top:1px solid rgba(11,42,96,.18)}
  .csf__partners>*{flex:none}
  .csf__pair{display:flex;align-items:center;gap:16px}
  .csf__cards{display:flex;gap:12px}
  .csf__stage{grid-template-columns:auto minmax(0,1fr) minmax(0,1.4fr) auto;grid-template-areas:"copy copy copy copy" "logo links info social" "partners partners partners partners";column-gap:40px;row-gap:34px}
  .csf__photo-copy{grid-area:copy}
  .csf__col--links{grid-area:links} .csf__col--info{grid-area:info} .csf__col--social{grid-area:social} .csf__partners{grid-area:partners}
}
@media (max-width:960px){
  .csf__stage{grid-template-columns:minmax(0,auto) minmax(0,1fr);grid-template-areas:"copy copy" "logo links" "info social" "partners partners";column-gap:40px}
}
@media (max-width:760px){
  .csf__stage{--m:24px;grid-template-columns:auto minmax(0,1fr);grid-template-areas:"copy copy" "logo links" "info info" "social social" "partners partners";column-gap:28px}
  .csf__plate{left:-95px}
  .csf__photo-copy{padding-top:170px;min-height:540px}
  .csf__partners{flex-direction:column;align-items:flex-start}
}
