/* Homepage-only styles for EduMinds home2. Keep selectors scoped to this page. */ /* Caridad caps direct page-content children at --vamtam-site-max-width. Let only the front-page Elementor canvas use the full viewport; keep its inner .em-wrap containers responsible for readable content widths. */ body.home .the-content-parent > .elementor{ width:100%!important;max-width:none!important;margin-left:0!important;margin-right:0!important } .em-home{ --forest:#102a1b;--green:#23843b;--ink:#24352b;--muted:#657268;--gold:#d9a441; --ivory:#f0ebdd;--sage:#e3ebe2;--paper:#fbfaf5;--line:#dce3d9; width:100%!important;max-width:none!important;margin:0!important;padding:0!important; color:var(--ink);background:var(--paper);font-family:var(--em-font-body,Arial,sans-serif);overflow:hidden } .em-home,.em-home *{box-sizing:border-box} /* Remove Elementor's implicit container inset and root seams. Named components below own all intentional padding and spacing. */ .em-home.e-con{gap:0!important;--gap:0px;--row-gap:0px;--column-gap:0px} .em-home .e-con{padding:0;gap:16px;--padding-top:0px;--padding-right:0px;--padding-bottom:0px;--padding-left:0px} .em-home .elementor-widget{min-width:0;margin-bottom:0} .em-home .elementor-widget-container{box-sizing:border-box} .em-home .em-section{width:100%;padding:76px 0} .em-home .em-eyebrow{display:flex;align-items:center;gap:10px;font:700 11px/1.35 var(--em-font-body,Arial,sans-serif);letter-spacing:.17em;text-transform:uppercase;color:var(--green)} .em-home .em-eyebrow:before{content:"";display:inline-block;flex:0 0 26px;height:1px;background:currentColor;opacity:.75} /* Make the approved heading font win over Elementor's per-widget typography defaults. */ .em-home .elementor-widget-heading h1,.em-home .em-hero-copy h1,.em-home .elementor-widget-heading h2,.em-home .em-section-heading h2,.em-home .elementor-widget-heading h3{ font-family:var(--em-font-heading,"Newsreader",Georgia,serif)!important;font-weight:500!important; color:var(--forest);letter-spacing:-.035em;line-height:1.06;margin-top:0;margin-bottom:0 } .em-home .elementor-widget-heading h1,.em-home .em-hero-copy h1{font-size:clamp(56px,5.3vw,76px)!important;letter-spacing:-.045em!important;line-height:1.02!important} .em-home .elementor-widget-heading h2,.em-home .em-section-heading h2{font-size:clamp(36px,4vw,56px)!important;letter-spacing:-.035em!important;line-height:1.06!important} .em-home .elementor-widget-heading h3{font-size:22px!important;font-weight:600!important;line-height:1.2!important} .em-home .elementor-widget-text-editor{font:400 17px/1.65 var(--em-font-body,Arial,sans-serif)!important;letter-spacing:0!important;color:var(--muted)} .em-home .elementor-widget-text-editor .elementor-widget-container{font:inherit!important;color:inherit} .em-home .elementor-widget-text-editor p{font:inherit!important;letter-spacing:inherit!important;color:inherit} .em-home p{font:400 17px/1.65 var(--em-font-body,Arial,sans-serif);color:var(--muted);margin:0 0 16px} .em-home .em-link-icon{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;vertical-align:middle;margin-left:8px} .em-home a{transition:color .2s,background-color .2s,transform .2s} /* The active Vamtam header/footer remain available everywhere else. Hide only their global templates on this homepage draft; the draft contains its own header/footer. */ body.page-id-988331 .elementor-location-header,body.page-id-988331 .elementor-location-footer{display:none!important} .em-home #em-footer-involved{scroll-margin-top:24px} /* Reference-inspired hero: editorial copy first, wide rectangular photograph below. */ .em-home .em-hero{padding:40px 0 0;background:var(--ivory)} .em-home .em-hero-grid{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:40px!important} .em-home .em-hero-copy{width:100%;max-width:none;gap:20px} .em-home .em-hero-copy h1{max-width:1060px;margin:0} .em-home .em-hero-support{width:46%;max-width:530px;margin-left:auto;gap:18px} .em-home .em-hero-copy h1 em{position:relative;font-style:normal;color:var(--green);font-weight:500;text-decoration:none} .em-home .em-hero-copy h1 em:after{content:"";position:absolute;left:0;right:12%;bottom:-.08em;height:5px;border-top:1px solid currentColor;border-radius:999px;background:linear-gradient(90deg,currentColor 0%,rgba(35,132,59,.24) 68%,transparent 100%);opacity:.45;transform:rotate(-1deg);pointer-events:none} .em-home .em-hero-copy .elementor-widget-text-editor{max-width:none;font-size:18px!important;line-height:1.6!important} .em-home .em-actions{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:0} .em-home .em-hero-visual{width:100vw!important;max-width:100vw!important;flex:0 0 auto!important;min-height:0!important;gap:0!important;padding:0!important;margin-left:calc((100% - 100vw)/2)!important;margin-right:0!important;overflow:hidden} .em-home .em-slider{position:relative;width:100%;height:clamp(480px,50vw,680px);min-height:480px} .em-home.em-hero-fit .em-slider{height:var(--em-hero-fit-height)!important;min-height:var(--em-hero-fit-height)!important} .em-home .em-slide{position:absolute;inset:0;opacity:0;overflow:hidden;transition:opacity .9s ease;pointer-events:none} .em-home .em-slide.is-active{opacity:1;pointer-events:auto} .em-home .em-slide img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 40%;border-radius:0!important} .em-home .em-slide.is-active img,.em-home .em-slide.is-leaving img{animation:em-hero-grow var(--em-hero-grow-duration,8s) linear both;transform-origin:center 42%} .em-home .em-slider-widget.is-paused .em-slide img{animation-play-state:paused} @keyframes em-hero-grow{from{transform:scale(1)}to{transform:scale(1.06)}} .em-home .em-slide:after{content:"";position:absolute;z-index:0;inset:50% 0 0;background:linear-gradient(transparent,#102a1b5c);border-radius:0!important;pointer-events:none} .em-home .em-slide-caption{position:absolute;z-index:1;left:max(24px,calc((100vw - 1228px)/2));bottom:22px;color:white;font:600 13px/1.4 var(--em-font-body,Arial,sans-serif);text-shadow:0 1px 5px #0008} .em-home .em-dots{position:absolute;z-index:2;width:104px;height:42px;pointer-events:none;opacity:.28} .em-home .em-dots circle{fill:#647c67} .em-home .em-dots-left{top:-19px;left:0} .em-home .em-dots-right{right:0;bottom:-19px} .em-home .em-intro{padding:34px 0;background:#fff;border-bottom:1px solid var(--line)} .em-home .em-intro-row{display:grid;grid-template-columns:1fr 2.1fr;align-items:start;gap:40px} .em-home .em-intro .elementor-widget-text-editor{width:100%;max-width:none;margin:0;color:var(--muted);font:400 17px/1.65 var(--em-font-body,Arial,sans-serif)!important} .em-home .em-intro .elementor-widget-text-editor strong{display:block;margin:0 0 8px;color:var(--forest);font:500 clamp(27px,3vw,36px)/1.12 var(--em-font-heading,"Newsreader",Georgia,serif)!important;letter-spacing:-.025em} .em-home .em-intro-label{display:flex;align-items:center;gap:10px;padding-top:7px;color:var(--green);font:600 12px/1.4 var(--em-font-body,Arial,sans-serif);letter-spacing:.12em;text-transform:uppercase} .em-home .em-intro-label:before{content:"";width:26px;height:1px;background:currentColor;flex:none} .em-home .em-section-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-bottom:20px} .em-home .em-section-heading .em-section-summary{max-width:370px} .em-home .em-section-heading h2{margin-top:10px} .em-home .em-pillars{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;border:0} .em-home .em-pillar{position:relative;isolation:isolate;padding:28px 24px;margin:0;border:0;gap:12px;background:var(--em-area-bg,#f6dea0);color:var(--forest);border-radius:4px} .em-home .em-pillar:nth-child(2){--em-area-bg:#cce8d6} .em-home .em-pillar:nth-child(3){--em-area-bg:#d4e5f5} .em-home .em-pillar:nth-child(4){--em-area-bg:#f6d3c8} .em-home .em-pillar-play{position:absolute!important;inset:0!important;z-index:3;width:100%!important;height:100%!important;margin:0!important;padding:0!important;min-height:0!important;border:0!important;border-radius:inherit!important;background:transparent!important;box-shadow:none!important;cursor:pointer;-webkit-tap-highlight-color:transparent} .em-home .em-pillar-play:before,.em-home .em-pillar-play:after{content:none!important;display:none!important} .em-home .em-pillar-play:focus-visible{outline:2px solid var(--green)!important;outline-offset:4px} .em-home .em-pillar.is-activated{outline:2px solid var(--green);outline-offset:3px} .em-home .em-pillar-sparks{position:absolute;inset:0;z-index:4;overflow:hidden;border-radius:inherit;pointer-events:none} .em-home .em-pillar-spark{position:absolute;display:block;width:7px;height:7px;pointer-events:none;border-radius:50%} .em-home .em-pillar-spark.is-star{border-radius:0;clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%)} .em-home .em-icon{width:44px;height:44px;display:grid;place-items:center;margin-bottom:8px;border-radius:50%;background:#ffffff80;color:var(--forest)} .em-home .em-icon svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round} .em-home .em-pillar h3{font-family:var(--em-font-heading,"Newsreader",Georgia,serif)!important;font-size:24px!important;font-weight:600!important;margin:0} .em-home .em-pillar .elementor-widget-text-editor{font-size:15px!important;line-height:1.6!important;margin:0;color:var(--ink)} .em-home .em-about{background:var(--sage);padding:0} .em-home .em-about-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%!important;max-width:none!important;margin:0;gap:0;align-items:stretch} .em-home .em-about-images{position:relative;height:auto;min-height:480px;align-self:stretch;overflow:hidden} .em-home .em-about-images .em-photo-main{position:absolute!important;inset:0;width:100%!important;height:100%!important;margin:0!important} .em-home .em-about-images .em-photo-main :is(.elementor-widget-container,a,picture){display:block;width:100%;height:100%} .em-home .em-about-images .em-photo-main img{position:absolute;inset:0;display:block;width:100%!important;max-width:none!important;height:100%!important;min-height:0;object-fit:cover;object-position:center;border-radius:0!important} .em-home .em-about-copy{padding:76px max(68px,calc((100vw - 1228px)/2)) 76px 64px;align-self:center} .em-home .em-checks{display:grid;grid-template-columns:1fr 1fr;gap:12px 18px;margin:22px 0} .em-home .em-check{font:500 12px/1.5 var(--em-font-body,Arial,sans-serif);color:var(--forest)} .em-home .em-check:before{content:'✓';display:inline-grid;place-items:center;width:19px;height:19px;margin-right:8px;border-radius:50%;background:#cbdaca;color:var(--green);font-weight:800} .em-home .em-work-grid{display:grid;grid-template-columns:1.15fr .85fr .85fr;gap:16px} .em-home .em-work-card{position:relative;min-height:320px;overflow:hidden;background:#dce5da} .em-home .em-work-card:first-child{min-height:390px} .em-home .em-work-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:0!important;transition:transform .6s} .em-home .em-work-card:hover img{transform:scale(1.035)} .em-home .em-work-card:after{content:"";position:absolute;inset:35% 0 0;background:linear-gradient(transparent,#102a1be0)} .em-home .em-work-card-content{position:absolute;z-index:2;left:21px;right:18px;bottom:22px;color:white} .em-home .em-work-card-content .em-card-label{font:650 10px/1.4 var(--em-font-body,Arial,sans-serif);letter-spacing:.13em;text-transform:uppercase;color:#e4c273} .em-home .em-work-card-content h3{font-family:var(--em-font-heading,"Newsreader",Georgia,serif)!important;color:white!important;font-size:24px!important;font-weight:500!important;margin:8px 0} .em-home .em-work-card-content .elementor-widget-text-editor{font-size:14px!important;line-height:1.5!important;color:#f2f5ef;margin:0} .em-home .em-work-cta{display:flex;justify-content:flex-start;margin-top:20px} .em-home.em-motion-ready .em-reveal{opacity:0;transform:translateY(12px)} .em-home.em-motion-ready .em-reveal.is-visible{animation:em-reveal .6s ease both} .em-home.em-motion-ready .em-pillar.em-reveal.is-visible{animation-name:em-pillar-enter;animation-duration:.7s;animation-delay:var(--em-pillar-delay,0ms)} .em-home .em-pillar:nth-child(2){--em-pillar-delay:90ms} .em-home .em-pillar:nth-child(3){--em-pillar-delay:180ms} .em-home .em-pillar:nth-child(4){--em-pillar-delay:270ms} @keyframes em-reveal{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}} @keyframes em-pillar-enter{0%{opacity:0;transform:translateY(22px) scale(.985)}75%{opacity:1;transform:translateY(-3px) scale(1)}100%{opacity:1;transform:none}} @media(max-width:1024px){ .em-home .em-section{padding:68px 0} .em-home .elementor-widget-heading h1,.em-home .em-hero-copy h1{font-size:clamp(48px,6.8vw,68px)!important} .em-home .em-hero{padding:34px 0 0} .em-home .em-slider{height:clamp(400px,54vw,570px);min-height:400px} .em-home .em-about{padding:0} .em-home .em-about-copy{padding:68px 32px 68px 34px} .em-home .em-pillars{grid-template-columns:repeat(2,minmax(0,1fr))} .em-home .em-hero-support{width:54%;max-width:530px} .em-home .em-work-grid{grid-template-columns:repeat(2,minmax(0,1fr))} .em-home .em-work-card:first-child{grid-row:span 2;min-height:500px}} @media(max-width:920px){ .em-home .em-about-grid{grid-template-columns:1fr} .em-home .em-about-images{height:clamp(360px,62vw,540px);min-height:0} .em-home .em-about-copy{padding:54px 32px}} @media(max-width:640px){ .em-home .em-section{padding:54px 0} .em-home .em-hero{padding:30px 0 0} .em-home .em-hero-grid{gap:28px!important} .em-home .em-hero-copy{max-width:100%;gap:18px} .em-home .em-hero-support{width:100%;max-width:none;margin:0;gap:18px} .em-home .elementor-widget-heading h1,.em-home .em-hero-copy h1{font-size:clamp(40px,11.2vw,50px)!important;line-height:1.04!important;letter-spacing:-.04em!important} .em-home .elementor-widget-heading h2,.em-home .em-section-heading h2{font-size:clamp(30px,7.8vw,36px)!important;line-height:1.08!important} .em-home .elementor-widget-heading h3{font-size:20px!important} .em-home .em-hero-copy h1{margin:0} .em-home .em-hero-copy .elementor-widget-text-editor{font-size:16px!important;line-height:1.6!important} .em-home .em-actions{gap:14px;margin-top:0} .em-home .elementor-widget-button .elementor-button{padding:13px 16px!important;font-size:14px!important} .em-home .em-hero-visual{width:100vw!important;max-width:100vw!important;flex:0 0 auto!important;padding:0!important;margin-left:calc((100% - 100vw)/2)!important} .em-home .em-slider{height:clamp(280px,73vw,390px);min-height:280px} .em-home .em-slide img{object-position:center 42%} .em-home .em-slide-caption{left:18px;bottom:16px;font-size:12px} .em-home .em-dots{width:78px;height:32px} .em-home .em-dots-left{top:-12px} .em-home .em-dots-right{bottom:-12px} .em-home .em-intro{padding:28px 0} .em-home .em-intro-row{grid-template-columns:1fr;gap:16px} .em-home .em-intro .elementor-widget-text-editor{font-size:16px!important;line-height:1.6!important} .em-home .em-intro .elementor-widget-text-editor strong{font-size:27px!important;margin-bottom:6px} .em-home .em-intro-label{font-size:10px} .em-home .em-section-heading{display:block;margin-bottom:24px} .em-home .em-section-heading .em-section-summary{margin-top:12px;max-width:100%;font-size:16px!important;line-height:1.6!important} .em-home .em-pillars{grid-template-columns:1fr;gap:16px} .em-home .em-pillar{padding:26px 24px;margin:0;min-height:0;gap:12px} .em-home .em-pillar:nth-child(n){--em-pillar-delay:0ms} .em-home .em-pillar h3{font-size:27px!important} .em-home .em-pillar .elementor-widget-text-editor{font-size:16px!important} .em-home .em-icon{width:44px;height:44px;margin-bottom:6px} .em-home .em-about{padding:0} .em-home .em-about-grid{grid-template-columns:1fr;gap:0} .em-home .em-about-images{height:clamp(300px,90vw,440px);min-height:0} .em-home .em-about-copy{padding:40px 18px} .em-home .em-about-copy .elementor-widget-text-editor{font-size:16px!important} .em-home .em-checks{gap:10px 12px;margin:18px 0} .em-home .em-check{font-size:13px} .em-home .em-work-grid{grid-template-columns:1fr 1fr;gap:10px} .em-home .em-work-card,.em-home .em-work-card:first-child{min-height:210px} .em-home .em-work-card:first-child{grid-column:1/-1;grid-row:auto;min-height:270px} .em-home .em-work-card-content{left:14px;right:12px;bottom:15px} .em-home .em-work-card-content h3{font-size:20px!important} .em-home .em-work-card-content .elementor-widget-text-editor{font-size:13px!important} .em-home .em-work-cta{justify-content:flex-start}} @media(prefers-reduced-motion:reduce){.em-home *, .em-home *:before,.em-home *:after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important} .em-home.em-motion-ready .em-reveal{opacity:1;transform:none} .em-home .em-slide img{animation:none!important;transform:none!important}} /* Core values strip: rendered from the existing Home2 introduction section. */ .em-home .em-beliefs.e-con{ width:100%!important;max-width:none!important;align-self:stretch;gap:0!important; --gap:0px;--row-gap:0px;--column-gap:0px; padding:28px 0 32px!important;background:var(--forest,#102a1b);overflow:hidden } .em-home .em-beliefs-eyebrow{ display:flex;align-items:center;gap:12px;margin:0 0 18px;padding:0; color:#b9dcc1;font:700 12px/1.35 var(--em-font-body,Arial,sans-serif); letter-spacing:.17em;text-transform:uppercase } .em-home .em-beliefs-eyebrow:before{ content:"";width:32px;height:1px;background:currentColor;flex:none } .em-home .em-beliefs-marquee{ display:flex;width:100%;overflow:hidden;padding:7px 0; mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent); -webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent) } .em-home .em-beliefs-track{ display:flex;flex:none;width:max-content; animation:em-beliefs-slide var(--em-beliefs-duration,30s) linear infinite } .em-home .em-beliefs-set{display:flex;flex:none;align-items:center} .em-home .em-beliefs-pill{ display:inline-flex;align-items:center;gap:10px;flex:none;white-space:nowrap; margin:0 10px;padding:12px 23px 12px 18px;border-radius:12px; background:var(--em-belief-bg);color:var(--em-belief-fg); font:600 clamp(17px,2vw,22px)/1.3 var(--em-font-body,Arial,sans-serif); transform:rotate(var(--em-belief-tilt)); transition:transform .25s cubic-bezier(.3,1.8,.5,1) } .em-home .em-beliefs-pill:hover{transform:rotate(0) scale(1.09)} .em-home .em-beliefs-pill svg{ width:23px;height:23px;flex:none;fill:none;stroke:currentColor; stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round } .em-home .em-beliefs-pill:hover svg{animation:em-beliefs-wiggle .5s ease-in-out} .em-home .em-beliefs-sr{ position:absolute!important;width:1px;height:1px;padding:0;margin:-1px; overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0 } @keyframes em-beliefs-slide{to{transform:translateX(-50%)}} @keyframes em-beliefs-wiggle{ 25%{transform:rotate(-16deg) scale(1.1)} 60%{transform:rotate(12deg) scale(1.1)} } @media(max-width:640px){ .em-home .em-beliefs.e-con{padding:24px 0 28px!important} .em-home .em-beliefs-eyebrow{margin-bottom:14px;font-size:10px} .em-home .em-beliefs-marquee{padding:5px 0} .em-home .em-beliefs-pill{padding:11px 19px 11px 15px;margin:0 7px} .em-home .em-beliefs-pill svg{width:21px;height:21px}} @media(prefers-reduced-motion:reduce){ .em-home .em-beliefs-marquee{mask-image:none;-webkit-mask-image:none;padding:0} .em-home .em-beliefs-track{display:block;width:100%;animation:none!important} .em-home .em-beliefs-set{display:flex;flex-wrap:wrap;gap:10px} .em-home .em-beliefs-pill{margin:0;transform:none} .em-home .em-beliefs-pill:hover,.em-home .em-beliefs-pill:hover svg{transform:none;animation:none}} /* EduMinds scrapbook About section, powered by EduMinds Content. */ .em-home .em-about { display: block !important; padding: 0 !important; gap: 0 !important; overflow: hidden !important; background: #e3eae0 !important; background-image: radial-gradient( rgba(20,41,29,.09) 1.2px, transparent 1.4px ) !important; background-size: 24px 24px !important; } .ema { --ea-ink: var(--forest, #102a1b); --ea-body: var(--muted, #657268); --ea-green: var(--green, #23843b); --ea-sun: #f5dc9f; --ea-mint: #cde8d8; font-family: var(--em-font-body, "Geist", system-ui, sans-serif); color: var(--ea-ink); } .ema, .ema * { box-sizing: border-box; } .em-home .em-about .ema-grid { width: 100% !important; max-width: 1100px !important; margin: 0 auto !important; padding: 72px 24px 80px !important; display: grid !important; grid-template-columns: minmax(0, 1fr) !important; gap: 64px !important; align-items: center !important; } @media (min-width: 900px){ .em-home .em-about .ema-grid { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr) !important; gap: 72px !important; }} .ema-board { position: relative; width: 100%; max-width: 600px; aspect-ratio: 1 / 1.34; margin: 0 auto; isolation: isolate; } .ema-fig { position: absolute !important; margin: 0 !important; background: #fff; padding: 8px 8px var(--pb, 8px) !important; border-radius: 3px; box-shadow: 0 12px 24px rgba(20,41,29,.2); width: var(--w); left: var(--x); top: var(--y); rotate: var(--r); transform-origin: 50% 0; opacity: 0; transform: translateY(-110px) scale(.9); transition: transform .9s cubic-bezier(.3,1.5,.5,1) var(--d), opacity .4s var(--d), box-shadow .8s ease, rotate .8s ease; } .ema-in .ema-fig { opacity: 1; transform: none; animation: ema-swing var(--sd) ease-in-out infinite; animation-delay: calc(var(--d) + .9s); } @keyframes ema-swing { 0%, 100% { rotate: calc(var(--r) - 1.3deg); } 50% { rotate: calc(var(--r) + 1.3deg); } } .ema-photo { position: relative; width: 100%; aspect-ratio: var(--ratio); overflow: hidden; border-radius: 2px; } .em-home .em-about .ema-photo img { position: absolute !important; display: block !important; margin: 0 !important; width: var(--iw) !important; height: var(--ih) !important; max-width: none !important; left: var(--ix) !important; top: var(--iy) !important; object-fit: fill !important; border-radius: 0 !important; } .em-home .em-about .ema-fig figcaption { margin: 0 !important; padding: 6px 0 0 !important; text-align: center !important; font: 600 clamp(17px, 2.4vw, 22px)/1.1 "Caveat", cursive !important; color: var(--ea-green) !important; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; } .ema-pin { position: absolute; z-index: 3; top: -9px; left: 50%; width: 20px; height: 20px; margin-left: -10px; border-radius: 50%; background: radial-gradient( circle at 35% 30%, rgba(255,255,255,.75) 0 12%, var(--pin) 15% ); box-shadow: 0 4px 5px rgba(0,0,0,.28); transform: scale(0); transition: transform .4s cubic-bezier(.3,2.4,.5,1) calc(var(--d) + .7s); } .ema-tape { position: absolute; z-index: 3; top: -12px; left: 50%; width: 74px; height: 22px; margin-left: -37px; background: rgba(245,220,159,.9); rotate: -3deg; transform: scale(0); transition: transform .4s cubic-bezier(.3,2.4,.5,1) calc(var(--d) + .7s); } .ema-tape.mint { background: rgba(180,222,200,.92); rotate: 4deg; } .ema-in .ema-pin, .ema-in .ema-tape { transform: scale(1); } .ema-note { position: absolute; z-index: 2; width: 24%; aspect-ratio: 1; right: 1%; top: 76%; background: var(--ea-sun); padding: 12px 10px; font: 600 clamp(15px, 2.2vw, 21px)/1.15 "Caveat", cursive; color: var(--ea-ink); rotate: 5deg; box-shadow: 0 8px 14px rgba(20,41,29,.18); opacity: 0; transform: scale(.4) rotate(-20deg); transition: transform .7s cubic-bezier(.3,1.9,.5,1) 1.6s, opacity .3s 1.6s; } .ema-note::before { content: ""; position: absolute; top: -10px; left: 50%; width: 54px; height: 18px; margin-left: -27px; background: rgba(255,255,255,.65); rotate: -4deg; } .ema-in .ema-note { opacity: 1; transform: none; } .ema-copy { min-width: 0; } .em-home .em-about .ema-copy p:not(.ema-eyebrow) { font: 400 17px/1.65 var(--em-font-body, "Geist", system-ui, sans-serif) !important; color: var(--ea-body) !important; margin: 0 0 16px !important; max-width: 540px; } .em-home .em-about .ema-copy p.ema-eyebrow { display: flex; align-items: center; gap: 10px; font: 700 11px/1.35 var(--em-font-body, "Geist", system-ui, sans-serif) !important; color: var(--ea-green) !important; letter-spacing: .17em !important; text-transform: uppercase; margin: 0 0 12px !important; } .em-home .em-about .ema-copy p.ema-eyebrow::before { content: ""; width: 26px; height: 1px; background: currentColor; opacity: .75; flex: none; } .em-home .em-about .ema-copy h2 { font: 500 clamp(32px, 4vw, 48px)/1.12 var(--em-font-heading, "Newsreader", Georgia, serif) !important; color: var(--ea-ink) !important; letter-spacing: -.02em !important; margin: 0 0 18px !important; padding: 0 !important; } @media (max-width: 767px){ .em-home .em-about .ema-copy p:not(.ema-eyebrow) { font-size: 16px !important; line-height: 1.6 !important; }} .ema-grow { position: relative; display: inline-block; } .ema-grow svg { position: absolute; left: 0; bottom: -10px; width: 100%; height: 12px; overflow: visible; } .ema-grow path { fill: none; stroke: var(--ea-green); stroke-width: 3.5; stroke-linecap: round; stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset 1s ease 1.2s; } .ema-in .ema-grow path { stroke-dashoffset: 0; } .ema-highlight { color: var(--ea-ink); background: linear-gradient( transparent 62%, var(--ea-sun) 62%, var(--ea-sun) 92%, transparent 92% ) no-repeat; background-size: 0 100%; transition: background-size .9s ease 1.8s; } .ema-in .ema-highlight { background-size: 100% 100%; } .ema-copy > * { opacity: 0; transform: translateY(20px); transition: opacity .6s, transform .7s cubic-bezier(.3,1.3,.5,1); transition-delay: calc(var(--n, 0) * .12s); } .ema-in .ema-copy > * { opacity: 1; transform: none; } .em-home .em-about .ema-checks { list-style: none !important; margin: 26px 0 30px !important; padding: 0 !important; display: grid !important; grid-template-columns: repeat(auto-fit, minmax(min(190px, 100%), 1fr)) !important; gap: 12px !important; } @media (min-width: 760px){ .em-home .em-about .ema-checks { gap: 16px !important; }} .em-home .em-about .ema-checks li { display: flex !important; align-items: center; gap: 10px; background: #fff; border-radius: 12px !important; margin: 0 !important; padding: 12px 14px !important; font: 500 15px/normal var(--em-font-body, "Geist", system-ui, sans-serif) !important; color: var(--ea-ink); box-shadow: 0 3px 0 rgba(20,41,29,.1); transform: scale(0) rotate(var(--r)); transition: transform .5s cubic-bezier(.3,1.7,.5,1) calc(1.1s + var(--i) * .15s), translate .32s cubic-bezier(.3,1.7,.5,1), scale .32s cubic-bezier(.3,1.7,.5,1), box-shadow .25s ease; } .em-home .em-about .ema-checks li:hover { translate: 0 -4px; scale: 1.02; box-shadow: 0 6px 0 rgba(20,41,29,.13); } .em-home .em-about .ema-checks li.em-about-pill-bounce { animation: em-about-pill-click-bounce .46s cubic-bezier(.2,1.4,.4,1); } @keyframes em-about-pill-click-bounce { 0%, 100% { translate: 0 0; } 45% { translate: 0 -5px; } 72% { translate: 0 -1px; } } .em-home .em-about .ema-in .ema-checks li { transform: rotate(var(--r)); } .ema-tick { width: 28px; height: 28px; border-radius: 50%; background: var(--about-focus-color, var(--ea-mint)); display: grid; place-items: center; flex: none; } .em-home .em-about .ema-checks .ema-tick { border-radius: 50% !important; background-color: var(--about-focus-color, var(--ea-mint)) !important; } .ema-tick svg { width: 16px; height: 16px; fill: none; stroke: var(--ea-ink); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; } .ema-tick.has-focus-icon path { stroke-dasharray: none; stroke-dashoffset: 0; transition: none; } .ema-tick path { stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset .4s ease calc(1.4s + var(--i) * .15s); } .ema-in .ema-tick path { stroke-dashoffset: 0; } .ema-in .ema-fig.is-lifted { transform: translateY(-8px) scale(1.06); z-index: 40; transition-delay: 0s; animation-play-state: paused; box-shadow: 0 20px 36px rgba(16,42,27,.3); } .em-home .em-about .ema-in .ema-board .ema-fig.is-hovered { transform: translateY(-10px) scale(1.08) !important; rotate: 0deg !important; z-index: 50 !important; transition-delay: 0s !important; animation: none !important; box-shadow: 0 22px 40px rgba(16,42,27,.32) !important; cursor: pointer; } .ema-in .ema-fig:focus-visible { z-index: 50; outline: 3px solid var(--ea-green); outline-offset: 5px; } @media (hover: hover){ .em-home .em-about .ema-in .ema-checks li:hover { transform: rotate(var(--r)); translate: 0 -4px; scale: 1.02; box-shadow: 0 6px 0 rgba(20,41,29,.13); transition-delay: 0s; }} @media (prefers-reduced-motion: reduce){ .ema * { animation: none !important; transition: none !important; } .ema-fig, .ema-note, .ema-copy > *, .ema-checks li { opacity: 1 !important; transform: none !important; } .ema-pin, .ema-tape { transform: none !important; } .ema-highlight { background-size: 100% 100% !important; } .ema-grow path, .ema-tick path { stroke-dashoffset: 0 !important; }}