/* FM.COM What I Do — four compact, colorful cards + centered photo dialogs. */
.fmwhat,.fmwhat *{box-sizing:border-box}
.fmwhat{padding:0 0 clamp(23px,3vw,40px);font-family:'Poppins',sans-serif;color:#fff}
.fmwhat__header{border-top:1px solid rgba(255,255,255,.18);padding:35px 0 23px}
.fmwhat__header h2{font:700 clamp(31px,4.35vw,49px)/1.15 'Poppins',sans-serif!important;color:#fff!important;letter-spacing:-.043em;padding:0!important;margin:0 0 13px!important}
.fmwhat__intro{max-width:680px;font:400 13px/1.8 'Poppins',sans-serif!important;color:#dce3fc!important;padding:0!important;margin:0!important}
.fmwhat__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px;align-items:stretch}
.fmwhat__item{--what-accent:#bcf4a2;--what-rgb:188,244,162;min-width:0;border:1px solid rgba(255,255,255,.22);border-radius:15px;background:rgba(255,255,255,.065);transition:transform .23s ease,background .23s ease,border-color .23s ease,box-shadow .23s ease}
.fmwhat__item--facilitation,.fmwhat__modal--facilitation{--what-accent:#e0b9ff;--what-rgb:224,185,255}
.fmwhat__item--projects,.fmwhat__modal--projects{--what-accent:#9cdeff;--what-rgb:156,222,255}
.fmwhat__item--creative,.fmwhat__modal--creative{--what-accent:#ffbc91;--what-rgb:255,188,145}
.fmwhat__item:hover,.fmwhat__item:focus-within{transform:translateY(-4px) scale(1.014);border-color:rgba(var(--what-rgb),.69);background:rgba(var(--what-rgb),.115);box-shadow:0 15px 33px rgba(9,20,73,.22)}
.fmwhat__trigger{display:block!important;position:relative;width:100%!important;min-height:176px!important;cursor:pointer!important;padding:18px 16px!important;margin:0!important;text-align:left!important;box-shadow:none!important;background:transparent!important;border:0!important;border-radius:14px!important;color:#fff!important;font-family:'Poppins',sans-serif!important;appearance:none!important}
.fmwhat__trigger:hover{background:transparent!important}
.fmwhat__trigger:focus-visible{outline:3px solid #fff57c!important;outline-offset:3px!important}
.fmwhat__icon{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border:1px solid rgba(214,197,255,.35);border-radius:11px;color:#e9dcff;background:rgba(214,197,255,.08);margin-bottom:16px;transition:color .23s ease,border-color .23s ease,background .23s ease,transform .23s ease}
.fmwhat__icon svg{display:block;max-width:27px;max-height:27px}
.fmwhat__item:hover .fmwhat__icon,.fmwhat__item:focus-within .fmwhat__icon{color:var(--what-accent);background:rgba(var(--what-rgb),.13);border-color:rgba(var(--what-rgb),.53);transform:scale(1.08)}
.fmwhat__body{display:block;padding-right:8px}
.fmwhat__name{display:block;color:#fff!important;font:600 14px/1.4 'Poppins',sans-serif!important;letter-spacing:-.018em;margin:0 0 9px!important;padding:0!important}
.fmwhat__description{display:block;color:#dce5ff!important;font:400 11.8px/1.55 'Poppins',sans-serif!important;margin:0!important;padding:0!important}
.fmwhat__arrow{display:flex;position:absolute;top:24px;right:15px;align-items:center;justify-content:center;color:#d9e4ff;transition:transform .22s ease,color .22s ease}
.fmwhat__item:hover .fmwhat__arrow,.fmwhat__item:focus-within .fmwhat__arrow{color:var(--what-accent);transform:translateX(3px)}

/* Native dialog enters the browser top layer, above the whole homepage. */
dialog.fmwhat__modal{
  --what-accent:#bcf4a2;
  --what-rgb:188,244,162;
  box-sizing:border-box!important;
  position:fixed!important;
  inset:0!important;
  width:min(940px,calc(100vw - 32px))!important;
  max-width:940px!important;
  max-height:min(88dvh,720px)!important;
  /* Fixed inset:0 + height:auto stretched the dialog to 88dvh, leaving a huge empty area.
     Fit-content makes the box hug its text and image, with max-height preserving scrolling. */
  height:fit-content!important;
  min-height:0!important;
  margin:auto!important;
  padding:0!important;
  overflow:auto!important;
  border:1px solid rgba(255,255,255,.40)!important;
  border-radius:19px!important;
  background:linear-gradient(125deg,#183681 0%,#2545B6 100%)!important;
  color:#fff!important;
  box-shadow:0 30px 110px rgba(4,11,35,.60)!important;
  font-family:'Poppins',sans-serif!important;
}
.fmwhat__modal::backdrop{background:rgba(3,10,33,.72)!important;backdrop-filter:blur(11px);-webkit-backdrop-filter:blur(11px)}
.fmwhat__modal[open]{display:block!important;animation:fmwhat-appear .19s ease-out both}
@keyframes fmwhat-appear{from{opacity:.5;transform:translateY(10px) scale(.987)}to{opacity:1;transform:none}}
.fmwhat__modal-shell{position:relative;min-width:0}
.fmwhat__modal-inner{display:grid;grid-template-columns:minmax(0,1.13fr) minmax(0,1fr);gap:24px;align-items:center;padding:clamp(22px,3vw,37px)}
.fmwhat__modal-text{min-width:0;padding-right:3px}
.fmwhat__modal-icon{display:flex;align-items:center;justify-content:center;width:52px;height:52px;border:1px solid rgba(var(--what-rgb),.6);border-radius:14px;background:rgba(var(--what-rgb),.12);color:var(--what-accent);margin:0 0 20px}
.fmwhat__modal-icon svg{width:29px;height:29px}
.fmwhat__modal-eyebrow{font:600 10px/1.5 'Poppins',sans-serif!important;letter-spacing:.14em;text-transform:uppercase;color:var(--what-accent)!important;margin:0 0 7px!important}
.fmwhat__modal-title{font:700 clamp(25px,3vw,36px)/1.18 'Poppins',sans-serif!important;letter-spacing:-.035em;color:#fff!important;margin:0 0 15px!important;padding:0!important}
.fmwhat__modal-summary{font:500 13px/1.65 'Poppins',sans-serif!important;color:#eef3ff!important;margin:0 0 20px!important}
.fmwhat__modal-description{font:400 13px/1.85 'Poppins',sans-serif!important;color:#e0e9ff!important;margin:0!important}
.fmwhat__modal-figure{position:relative;align-self:stretch;display:flex;align-items:center;justify-content:center;min-width:0;margin:0!important;padding:0!important;overflow:hidden;border-radius:15px;border:1px solid rgba(255,255,255,.20);background:rgba(10,27,75,.25)}
.fmwhat__modal-photo{display:block!important;width:100%!important;height:auto!important;max-width:100%!important;max-height:490px!important;object-fit:contain!important;object-position:center center!important;margin:auto!important;padding:0!important;box-shadow:none!important;border:none!important;border-radius:13px!important}
.fmwhat__modal-close{position:absolute!important;top:14px!important;right:14px!important;z-index:3;display:flex!important;align-items:center;justify-content:center;width:38px!important;height:38px!important;min-width:38px!important;min-height:38px!important;margin:0!important;padding:0!important;border:1px solid rgba(255,255,255,.55)!important;border-radius:50%!important;background:rgba(9,25,68,.85)!important;color:#fff!important;font:400 27px/1 'Poppins',sans-serif!important;cursor:pointer!important;transition:background .15s ease}
.fmwhat__modal-close:hover{background:#3457b7!important}
.fmwhat__modal-close:focus-visible{outline:3px solid #fff57c!important;outline-offset:3px!important}

@media(max-width:980px){.fmwhat__grid{grid-template-columns:repeat(2,minmax(0,1fr))}.fmwhat__trigger{min-height:161px!important}}
@media(max-width:700px){
  .fmwhat__modal-inner{grid-template-columns:1fr;gap:18px;padding:21px 17px 18px}
  .fmwhat__modal-icon{width:43px;height:43px;margin-bottom:12px}
  .fmwhat__modal-icon svg{width:26px;height:26px}
  .fmwhat__modal-title{font-size:25px!important;padding-right:30px!important}
  .fmwhat__modal-summary{margin-bottom:13px!important}
  .fmwhat__modal-description{font-size:12px!important;line-height:1.75!important}
  .fmwhat__modal-figure{align-self:auto;min-height:120px}
  .fmwhat__modal-photo{max-height:37dvh!important}
  .fmwhat__modal-close{top:9px!important;right:9px!important}
}
@media(max-width:620px){
 .fmwhat{padding-bottom:24px}.fmwhat__header{padding:30px 0 21px}
 .fmwhat__intro{font-size:12px!important}.fmwhat__grid{grid-template-columns:1fr;gap:10px}
 .fmwhat__trigger{display:flex!important;align-items:flex-start;gap:14px;min-height:0!important;padding:16px 40px 17px 15px!important}
 .fmwhat__icon{flex:none;width:38px;height:38px;margin:0}
 .fmwhat__icon svg{width:24px;height:24px}
 .fmwhat__name{font-size:14px!important;margin:1px 0 5px!important}
 .fmwhat__description{font-size:11.5px!important}
 .fmwhat__arrow{top:25px;right:13px}
 dialog.fmwhat__modal{width:calc(100vw - 20px)!important;max-height:92dvh!important;border-radius:14px!important}
}
@media(prefers-reduced-motion:reduce){.fmwhat__item,.fmwhat__icon,.fmwhat__arrow,.fmwhat__modal-close{transition:none!important}.fmwhat__item:hover,.fmwhat__item:focus-within{transform:none!important}.fmwhat__item:hover .fmwhat__icon,.fmwhat__item:focus-within .fmwhat__icon{transform:none!important}.fmwhat__modal[open]{animation:none!important}}