/* lightlunchmedia.com coming soon page. Layout styles are inline in index.html; this file holds fonts, states and motion. */
:root{--accent:#CC1F68;--tint:#F3FDFE}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
[hidden]{display:none !important}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.field input:focus-visible,.field textarea:focus-visible{outline:none}
button:disabled{cursor:default;opacity:.85}
.armed.reveal-all .grp .reveal{opacity:1;transform:none}
.armed.reveal-all .grp .line-h,.armed.reveal-all .grp .line-v{transform:none}
@font-face{font-family:'Dalven Goofler';src:url(../fonts/DalvenGoofler-Regular.woff2) format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Dalven Goofler';src:url(../fonts/DalvenGoofler-Italic.woff2) format('woff2');font-weight:400;font-style:italic;font-display:swap}
body{margin:0}
a{color:#000000}
a:hover{color:var(--accent)}
a.flink{color:#C9C9C9}a.flink:hover{color:#FFFFFF}
.btn{transition:filter .15s ease,transform .15s ease}
.btn:hover{filter:brightness(1.1)}
.btn:active{transform:scale(.98)}
.card{transition:border-color .18s ease}
a.card:hover{border-color:#8F8F8F}
.card .arr{transition:transform .18s ease}
.card:hover .arr{transform:translateX(4px)}
.field{transition:border-color .15s ease,box-shadow .15s ease}
.field:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px rgba(0,0,0,.06)}
.field input,.field textarea{outline:none}
::placeholder{color:#767676}
.enter{animation:enterX .9s cubic-bezier(.02,.69,.48,1) both}
.armed .grp .reveal{opacity:0;transform:translateY(24px)}
.armed .grp.in .reveal{opacity:1;transform:none;transition:opacity .6s cubic-bezier(.02,.69,.48,1),transform .6s cubic-bezier(.02,.69,.48,1)}
.line-v{transform-origin:top}
.armed .grp .line-h{transform:scaleX(0)}
.armed .grp .line-v{transform:scaleY(0)}
.armed .grp.in .line-h,.armed .grp.in .line-v{transform:none;transition:transform .7s cubic-bezier(.02,.69,.48,1)}
.spin{animation:spin .7s linear infinite}
.pop{animation:pop .32s cubic-bezier(.2,.9,.3,1.2) both}
.fade{animation:fade .3s ease both}
@keyframes enterX{from{opacity:0;transform:translateX(-10px)}to{opacity:1;transform:none}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes pop{from{transform:scale(.6);opacity:0}to{transform:scale(1);opacity:1}}
@keyframes fade{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
/* Below this width the connecting lines are hidden, so the M needs its own space above the cards. */
@media (max-width:1120px){.tree{display:none}.tree-root{margin-bottom:32px}}
/* Division cards and footer logos: fixed column counts so a row never ends with one item on its own. */
.cards{grid-template-columns:repeat(4,minmax(0,1fr)) !important}
.fbrands{grid-template-columns:repeat(4,minmax(0,1fr)) !important}
@media (max-width:1120px){.cards{grid-template-columns:repeat(2,minmax(0,1fr)) !important}}
@media (max-width:900px){.fdiv{border-left:0 !important;padding-left:0 !important}}
@media (max-width:600px){.cards{grid-template-columns:minmax(0,1fr) !important}.fbrands{grid-template-columns:repeat(2,minmax(0,1fr)) !important}}
@media (prefers-reduced-motion:reduce){.enter,.spin,.pop,.fade{animation:none}.btn,.card,.card .arr,.field{transition:none}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}