/* Rules every page in /site needs, in one place.
 *
 * Twelve pages link sawa.css and eight carry their own stylesheet inline, so
 * these rules lived in nine copies. They were byte-identical in all nine, which
 * is the only reason this file could be lifted out without changing a single
 * pixel — but identical today is not a guarantee, and a footer change had to be
 * made nine times to stay that way.
 *
 * Loaded BEFORE sawa.css and before any page's inline <style>, so a page can
 * still override anything here.
 */

/* footer */
footer{background:var(--teal-800);color:var(--cream);padding:84px 0 36px}
.fgrid{display:grid;grid-template-columns:1.7fr 1fr 1fr 1fr;gap:46px}
footer .logo{color:var(--cream)}
footer .logo .nm i{color:var(--gold)}
.fblurb{color:rgba(247,243,234,.62);font-size:.95rem;margin-top:20px;max-width:25rem}
.fcol h4{font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-bottom:18px}
.fcol a{display:block;color:rgba(247,243,234,.72);font-size:.94rem;padding:7px 0;transition:color .3s var(--ease)}
.fcol a:hover{color:var(--cream)}
/* Three columns so the copyright sits dead centre no matter how wide the
   socials are: the first stays empty, the line takes the middle, the socials
   are pushed to the right. Placement is by column, not source order. */
.fbot{border-top:1px solid rgba(247,243,234,.13);margin-top:54px;padding-top:26px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:18px;font-size:.85rem;color:rgba(247,243,234,.56)}
.fbot>span{grid-column:2;text-align:center}
.fbot .socials{grid-column:3;justify-self:end}
.fbot a{color:rgba(247,243,234,.56);transition:color .3s}
.fbot a:hover{color:var(--cream)}
.socials{display:flex;gap:11px}
.socials a,.socials .soon{width:38px;height:38px;border-radius:11px;border:1px solid rgba(247,243,234,.18);display:grid;place-items:center;transition:all .4s var(--ease)}
/* Inert placeholder until real profile URLs exist — muted so it doesn't read as a working link. */
.socials .soon{opacity:.42;cursor:default}
.socials a:hover{background:var(--gold);color:var(--teal);border-color:var(--gold)}
.socials svg{width:17px;height:17px}

/* scroll reveal — the observer that adds .in lives in /assets/sawa.js */
.rv{opacity:0;transform:translateY(40px);filter:blur(8px);transition:opacity .9s var(--ease-2),transform .9s var(--ease-2),filter .9s var(--ease-2)}
.rv.in{opacity:1;transform:none;filter:none}
[data-d="1"]{transition-delay:.08s}[data-d="2"]{transition-delay:.16s}[data-d="3"]{transition-delay:.24s}[data-d="4"]{transition-delay:.32s}

@media(max-width:960px){
  .fgrid{grid-template-columns:1fr 1fr;gap:34px}
}
@media(max-width:760px){
  .fgrid{grid-template-columns:1fr;gap:30px}
  /* The bar stacks by collapsing to one column, and the copyright stays
     centred over the socials. */
  .fbot{grid-template-columns:1fr;justify-items:center}
  .fbot>span,.fbot .socials{grid-column:1;justify-self:center}
}
@media(prefers-reduced-motion:reduce){
  .rv{opacity:1;transform:none;filter:none}
}