/* SECTION 8 · FOOTER */
.foot{position:relative;background:#FFFFFF;color:#1A1A1A;border-radius:0;overflow:hidden;padding:120px clamp(24px,8vw,130px) 80px;min-height:560px;box-sizing:border-box}
.foot-wm{position:absolute;left:-3%;bottom:-9%;width:106%;height:auto;filter:invert(1);opacity:.045;pointer-events:none;-webkit-mask-image:linear-gradient(#000 40%,transparent 96%);mask-image:linear-gradient(#000 40%,transparent 96%)}
@media (max-width:900px), (orientation:portrait) and (max-width:1100px){.foot{padding-bottom:calc(38.2vw + 112px) !important}.foot-wm{bottom:96px}} /* the big watermark sits under the links, 96px clear of iPhone Safari's floating address bar */
.foot-grid{position:relative;display:flex;flex-wrap:wrap;justify-content:space-between;gap:48px;margin-top:150px}
.foot-cols{display:flex;flex-wrap:wrap;gap:clamp(32px,6vw,96px)}
.foot-col{display:flex;flex-direction:column;gap:14px;min-width:120px}
.foot-col b{font-size:17px;font-weight:600;color:#1A1A1A;margin-bottom:4px}
.foot-col a{font-size:17px;color:#5B6470;text-decoration:none}
.foot-col a:hover{color:#1A1A1A}
/* Laptops and sideways tablets: the big logo fills the footer from its top edge at every width, not only on very wide screens. */
@media (min-width:901px) and (orientation:landscape),(min-width:1101px){.foot{min-height:0;padding-top:clamp(72px,calc(35vw - 340px),120px)}.foot-grid{margin-top:clamp(0px,calc(35vw - 460px),150px)}}
/* Tablets only: the logo block and the links. Sideways, the brand and the links share one row; upright, the logo and socials share a line and the links spread across the width, so the right half is not left empty. */
@media (min-width:901px) and (max-width:1060px) and (orientation:landscape){.foot-grid{flex-wrap:nowrap}.foot-cols{flex-wrap:nowrap;gap:32px}}
@media (max-width:900px),(orientation:portrait) and (max-width:1100px){
  .foot-cols{width:100%;justify-content:space-between}
  .foot-grid>div:first-child{width:100%;min-height:0 !important;flex-direction:row !important;flex-wrap:wrap;justify-content:space-between !important;align-items:center;gap:14px 24px !important}
  .foot-grid>div:first-child>div{display:contents !important}
  .foot-grid>div:first-child>div>div:first-child{margin:0 -12px 0 0 !important}
  .foot-grid>div:first-child>div>div:last-child{flex-basis:100%}
  .foot-grid>div:first-child>img{align-self:center !important}
}
/* Phones: the logo and socials share a line and the links sit in three columns, so the footer stays short. */
@media (max-width:599px),(orientation:landscape) and (max-height:500px){
  .foot{padding:36px 20px min(28vw,130px) !important;min-height:0}
  .foot-grid{gap:24px;margin-top:0 !important}
  .foot-cols{flex-wrap:nowrap;gap:10px}
  .foot-col{min-width:0;gap:0}
  .foot-col b{font-size:15px;margin-bottom:2px}
  .foot-col a{display:flex;align-items:center;min-height:36px;font-size:14px}
  .foot-wm{bottom:-8vw !important}
}
.soc{width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;border-radius:12px;color:#5B6470}
.soc:hover{color:#1A1A1A;background:#F4F5F6}
@media (max-width:760px){.foot-grid{margin-top:60px}}