/* Landing page refinement with Impeccable, 2026-09-24.
   Edfy tokens, type roles, approved illustrations and button rules remain authoritative. */
@font-face{font-family:'IBM Plex Sans';src:url('/public/assets/edfy-site-20260914/fonts/plex-400.ttf');font-weight:400;font-display:swap}
@font-face{font-family:'IBM Plex Sans';src:url('/public/assets/edfy-site-20260914/fonts/plex-500.ttf');font-weight:500;font-display:swap}
@font-face{font-family:'IBM Plex Sans';src:url('/public/assets/edfy-site-20260914/fonts/plex-600.ttf');font-weight:600;font-display:swap}
@font-face{font-family:'IBM Plex Sans';src:url('/public/assets/edfy-site-20260914/fonts/plex-700.ttf');font-weight:700;font-display:swap}
:root{color-scheme:light;--page-max:1200px;--gutter:clamp(20px,5vw,80px);--ease:cubic-bezier(.22,1,.36,1);--hairline:rgba(124,100,101,.24)}
*{box-sizing:border-box}
html{scroll-padding-top:104px;scrollbar-color:var(--color-base-400) var(--color-bg)}
body{margin:0;background:var(--color-bg);color:var(--color-text-strong);font-family:var(--font-body);font-size:1rem;line-height:1.55;-webkit-font-smoothing:antialiased}
button{font:inherit}a{color:inherit;text-decoration:none}button,summary{cursor:pointer}
img{display:block;max-width:100%;height:auto}h1,h2,h3,p{margin:0}
h1,h2,h3{font-family:var(--font-heading);font-weight:700;overflow-wrap:anywhere;hyphens:none;text-wrap:balance}
p{color:var(--color-text);overflow-wrap:anywhere;hyphens:none;text-wrap:pretty}
a,button,summary{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--color-base-700);outline-offset:6px;border-radius:6px}
::selection{background:var(--color-base-200);color:var(--color-text-strong)}
.wrap{width:min(var(--page-max),calc(100% - var(--gutter)*2));margin-inline:auto}
.section{padding-block:clamp(72px,8vw,112px)}
.section h2{font-size:clamp(2rem,4vw,3.25rem);line-height:1.12;letter-spacing:-.025em}
.section h2 span{color:var(--color-base-600)}
.section h3{font-size:1.5rem;line-height:1.25;letter-spacing:-.015em}
.section-copy{font-size:1.125rem;line-height:1.65;max-width:48ch;margin-top:24px}
.skip-link{position:fixed;left:20px;top:-100px;z-index:100;background:var(--color-surface);border:2px solid var(--color-text-strong);padding:12px 20px;border-radius:12px}
.skip-link:focus{top:12px}
.site-header{position:sticky;top:0;z-index:40;background:var(--color-bg);border-bottom:1px solid var(--hairline)}
.header-inner{width:min(1360px,calc(100% - var(--gutter)*2));min-height:80px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:inline-flex;align-items:center;flex-shrink:0;min-height:64px}
.brand img{width:144px;height:auto}
.desktop-nav{display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:8px 24px;font-weight:500;min-width:0}
.desktop-nav>a{display:inline-flex;align-items:center;min-height:44px;padding-block:12px}
.desktop-nav>a:hover{color:var(--color-base-600)}
.desktop-nav>a.separate-offer{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;border-left:1px solid var(--hairline);padding-left:24px}
.separate-offer small{display:block;font-size:.875rem;font-weight:400;color:var(--color-text);line-height:1.4}
.desktop-nav .register-link{padding:10px 16px;border:1px solid var(--color-base-300);box-shadow:2px 2px 0 var(--color-base-300);border-radius:12px}
.mobile-menu{display:none}
.hero{padding-top:clamp(44px,5vw,72px)}
.hero-copy{display:grid;grid-template-columns:1.35fr 1fr;gap:clamp(28px,4vw,64px);align-items:center}
.hero h1{font-size:clamp(3rem,5.5vw,5rem);letter-spacing:-.03em;line-height:1.08}
.hero h1 span{color:var(--color-base-600)}
.hero-copy{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);align-items:center}
.hero-message .hero-intro{padding-top:24px}
.hero-message .hero-intro>p{max-width:45ch}
.hero-message .hero-intro>.hero-access-note{font-size:14px;line-height:1.55;margin-top:20px;max-width:58ch}
.hero-work-sample{padding:28px;border:1px solid var(--color-base-200);border-radius:20px;background:var(--color-surface);transform:rotate(1deg)}
.hero-work-sample__context{display:flex;align-items:center;gap:16px;margin-bottom:24px}
.hero-work-sample__context img{width:60px;height:60px;object-fit:contain}
.hero-work-sample__context strong{display:block;font:24px/1.2 var(--font-heading)}
.hero-work-sample__context span{display:block;color:var(--color-text);margin-top:4px}
.hero-work-sample__row{display:flex;justify-content:space-between;gap:16px;padding:16px 0;border-top:1px solid var(--hairline)}
.hero-work-sample__row>span:last-child{font-size:14px;font-weight:600;color:var(--color-text)}
.hero-work-sample>p{font-size:14px;margin-top:16px}
.hero-work-sample>.text-link{margin-top:12px}
@media(max-width:759px){.hero-copy{grid-template-columns:1fr}.hero-work-sample{transform:none;padding:20px}.hero-message .hero-intro>p{font-size:18px}.hero-message .hero-actions{gap:12px;margin-top:20px}}
.hero-intro{min-width:0;padding-block:8px}
.hero-intro>p{max-width:40ch;font-size:1.25rem;line-height:1.6}
.hero-intro .hero-value{font-family:var(--font-heading);font-size:1.5rem;font-weight:700;line-height:1.3;color:var(--color-text-strong);margin-bottom:16px;text-wrap:balance}
.hero-actions{display:flex;align-items:center;gap:24px;flex-wrap:wrap;margin-top:28px;padding-bottom:8px}
.brand-button{--button-line:var(--color-base-300);display:inline-flex;align-items:center;justify-content:center;min-height:48px;max-width:100%;padding:12px 20px;border:1px solid var(--button-line);border-radius:12px;background:var(--color-primary);color:var(--color-text-strong);box-shadow:3px 3px 0 var(--button-line);font-size:1rem;font-weight:600;line-height:1.4;text-align:center;transition:transform 120ms var(--ease),box-shadow 120ms var(--ease),background 160ms ease}
.brand-button:hover{background:var(--color-base-200)}
.brand-button:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--button-line)}
.brand-button.secondary{--button-line:var(--color-base-700);background:transparent}
.brand-button.secondary:hover{background:var(--color-base-100)}
.text-link{display:inline-flex;align-items:center;gap:12px;min-height:44px;font-weight:500;line-height:1.45;text-decoration:underline;text-decoration-color:var(--color-base-400);text-underline-offset:6px;text-decoration-thickness:1px}
.text-link:hover{text-decoration-color:currentColor}
.text-link span{flex-shrink:0}
.hero-illustration{width:100%;aspect-ratio:1926/817;margin-top:48px;overflow:hidden}
.hero-illustration img{width:100%;height:100%;object-fit:cover}
.area-overview{padding-block:36px 0}
.area-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px}
.area-links>a{position:relative;min-width:0;padding:20px 36px 24px 0;border-bottom:1px solid var(--hairline)}
.area-links h2{font-size:1.5rem;line-height:1.25}
.area-links p{margin-top:8px;font-size:1rem;max-width:28ch}
.audience{font-size:1rem;font-weight:500;color:var(--color-base-700);margin-top:12px}
.area-links .audience{font-size:1rem;margin-top:4px;color:var(--color-base-700)}
.area-arrow{position:absolute;right:4px;top:24px;font-size:1.4rem;color:var(--color-base-700)}
.area-links>a:hover{border-color:var(--color-base-600)}
.teaching{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,8vw,112px);align-items:start}
.teaching-lead>.brand-button{margin-top:28px}
.access-note{font-size:1rem;max-width:40ch;margin-top:20px}
.teaching-topics{border-top:1px solid var(--hairline)}
.teaching-topic{display:grid;grid-template-columns:40px 1fr;gap:12px 24px;padding:28px 0;border-bottom:1px solid var(--hairline)}
.teaching-topic img{width:32px;height:32px;grid-row:1/3;justify-self:center}
.teaching-topic .school2,.teaching-topic .books{width:40px;height:40px}
.teaching-topic h3{font-size:1.375rem;align-self:center}
.teaching-topic p{grid-column:2;max-width:40ch}
.learning{background:var(--color-base-150);width:calc(100% - 40px);margin-inline:auto;border-radius:28px}
.learning>.wrap{width:min(var(--page-max),calc(100% - var(--gutter)*2));display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,8vw,112px);align-items:center}
.learning-heading .section-copy{max-width:40ch;color:var(--color-base-700)}
.catalog-link{margin-top:28px}
.learning-path{list-style:none;padding:0;margin:0;display:grid;gap:32px}
.learning-path>li{position:relative;display:grid;grid-template-columns:56px 1fr;gap:8px 24px}
.path-track{grid-row:1/3}
.path-node{width:56px;height:56px;display:grid;place-items:center;border-radius:20px;background:var(--color-bg)}
.path-node img{width:28px;height:28px}
.path-node .books{width:32px;height:32px}
.path-node .save{width:24px;height:24px}
.path-line{position:absolute;left:27px;top:68px;height:calc(100% - 44px);width:1px;background:var(--color-base-300)}
.learning-path h3{padding-top:2px;font-size:1.375rem}
.learning-path p{max-width:38ch;color:var(--color-base-700)}
.apps-heading{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,8vw,112px);align-items:start;margin-bottom:48px}
.apps-heading .section-copy{margin-top:0}
.availability{margin-top:24px;padding-top:20px;border-top:1px solid var(--hairline)}
.availability strong{display:block;font-weight:600;margin-bottom:8px}
.availability p{font-size:1rem;line-height:1.55}
.tool-collection{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.tool{min-width:0}
/* Approved IOS-07 card artwork + name; marketing descriptions sit outside the link/card. */
.tool-card{display:block;padding:16px 16px 24px;border-radius:28px;background:var(--color-surface)}
.tool-art{display:flex;align-items:center;justify-content:center;aspect-ratio:1.45;width:100%;border-radius:20px;overflow:hidden}
.tool-art img{width:88%;height:100%;object-fit:contain;opacity:1}
.tool-card.chalk .tool-art{background:#f1e7e9}
.tool-card.mauve .tool-art{background:#bdabc7}
.tool-card.vanilla .tool-art{background:#f8e299}
.tool-card.mauve img{transform:scale(1.18)}
.tool-card h3{margin:20px 12px 0;font-size:1.5rem}
.tool-card:hover h3{text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:1px}
.tool-description{padding:20px 12px 0}
.tool-description p{line-height:1.65}
.tool-description .tool-purpose{font-weight:600;color:var(--color-text-strong);margin-bottom:8px}
.tool-description .text-link{margin-top:12px}
.app-conditions{display:grid;grid-template-columns:1fr 1fr;gap:32px 64px;border-top:1px solid var(--hairline);margin-top:48px;padding-top:32px}
.app-conditions>div{min-width:0}
.app-conditions h3{font-size:1.125rem;margin-bottom:12px}
.app-conditions p{max-width:52ch}
.scovox-note{display:flex;justify-content:space-between;align-items:center;gap:16px 32px;border-top:1px solid var(--hairline);margin-top:48px;padding-top:24px}
.scovox-note .text-link{flex-shrink:0}
.trust{padding-block:32px 64px;border-top:1px solid var(--hairline)}
.trust h2{font-size:1.5rem;line-height:1.3;margin-bottom:24px}
.trust-details{display:grid;grid-template-columns:1fr 1fr;gap:32px 64px}
.trust-details>div{min-width:0}
.trust h3{font-size:1.125rem;margin-bottom:8px}
.trust p{max-width:52ch}
.trust .text-link{margin-top:12px}
.trust-links{display:flex;flex-wrap:wrap;gap:0 24px}
.closing{text-align:center;background:var(--color-surface);border-top:1px solid var(--hairline)}
.closing h2{font-size:clamp(2.5rem,5.5vw,4.5rem);line-height:1.1}
.closing p{margin:24px auto 0;font-size:1.125rem;max-width:48ch}
.closing .hero-actions{justify-content:center}
.site-footer{padding-block:32px}
.footer-top{display:flex;justify-content:space-between;align-items:center;gap:32px}
.footer-top nav{display:flex;gap:8px 24px;flex-wrap:wrap}
.footer-top nav a{display:inline-flex;align-items:center;min-width:44px;min-height:44px;padding-block:12px}
.footer-top nav a:hover{text-decoration:underline;text-underline-offset:5px}
.footer-bottom{display:flex;justify-content:space-between;gap:24px;align-items:center;border-top:1px solid var(--hairline);margin-top:24px;padding-top:20px;font-size:.875rem;color:var(--color-base-600)}
.motion-toggle{display:inline-flex;align-items:center;gap:16px;min-height:44px;background:none;border:0;padding:8px 0;color:var(--color-base-700);font-size:.875rem}
.motion-toggle:disabled{cursor:default}
.motion-toggle>span{font-size:1.125rem}
.social-links{display:inline-flex;align-items:center;gap:8px;flex-shrink:0}
.social-link{display:grid;width:44px;height:44px;min-height:44px;padding:0;place-items:center;color:var(--color-base-600)}
.social-link:hover{color:var(--color-text-strong)}
.social-link>span{display:block;width:28px;height:28px;background:currentColor;mask:var(--social-icon) no-repeat center/contain;-webkit-mask:var(--social-icon) no-repeat center/contain}
.social-link--instagram{--social-icon:url('/public/assets/icons/edfy/social_media_icons/instagram.svg')}
.social-link--youtube{--social-icon:url('/public/assets/icons/edfy/social_media_icons/youtube.svg')}
.error-page{max-width:640px;margin:15vh auto;padding:24px}.error-page h1{font-size:2rem}.error-page p{margin-block:20px}.error-page a{display:inline-flex;min-height:44px;text-decoration:underline}
@supports(backdrop-filter:blur(16px)){.site-header{background:rgba(248,243,241,.96);backdrop-filter:blur(16px)}}
@media(min-width:980px){.edfy-page[data-motion=on] .hero-copy{animation:arrive 650ms var(--ease) both}@keyframes arrive{from{transform:translateY(12px)}to{transform:translateY(0)}}}
@media(max-width:1199px){
  .desktop-nav{display:none}.mobile-menu{display:block}
  .mobile-menu summary{display:flex;align-items:center;gap:16px;min-height:48px;padding:8px 0 8px 16px;list-style:none;font-weight:500}
  .mobile-menu summary::-webkit-details-marker{display:none}
  .menu-symbol{display:flex;flex-direction:column;gap:6px;width:22px}
  .menu-symbol i{display:block;background:currentColor;height:1px;width:22px}
  .mobile-menu[open] .menu-symbol i:first-child{transform:translateY(3.5px) rotate(45deg)}
  .mobile-menu[open] .menu-symbol i:last-child{transform:translateY(-3.5px) rotate(-45deg)}
  .mobile-menu nav{position:absolute;top:100%;left:0;right:0;max-height:calc(100dvh - 80px);overflow-y:auto;background:var(--color-bg);border-bottom:1px solid var(--hairline);padding:16px var(--gutter) 24px;display:grid;gap:4px;box-shadow:0 18px 24px rgba(47,29,31,.08)}
  .mobile-menu nav>a{display:flex;align-items:center;padding:12px 0;min-height:48px}
  .mobile-menu nav>a.login-link{border-top:1px solid var(--hairline);margin-top:8px;padding-top:16px}
  .mobile-menu nav>a.register-link{justify-self:start;margin-top:4px;padding:12px 16px;border:1px solid var(--color-base-300);box-shadow:2px 2px 0 var(--color-base-300);border-radius:12px}
  .mobile-menu nav>a.separate-offer{display:block;border-top:1px solid var(--hairline);margin-top:8px}
  .mobile-menu nav .social-links{padding-block:8px}
  .hero h1{font-size:clamp(3rem,5.5vw,4rem)}
  .hero-intro>p{font-size:1.125rem}
  .hero-actions{gap:16px 24px}
  .area-links{gap:28px}
  .tool-collection{gap:20px}
}
/* Intermediate widths get their own composition, not compressed desktop columns. */
@media(min-width:760px) and (max-width:1099px){
  .apps-heading{grid-template-columns:1fr;gap:28px}
  .apps-heading>div:last-child{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:start}
  .availability{margin:0;padding:0;border:0}
  .tool-collection{grid-template-columns:1fr;gap:32px}
  .tool{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:32px;align-items:center}
  .tool-description{padding:0;max-width:44ch}
}
@media(min-width:760px) and (max-width:959px){
  .hero-copy{grid-template-columns:1fr;gap:28px;align-items:start}
  .hero h1{font-size:3.5rem}
  .hero-intro{padding:0;max-width:60ch}
  .hero-intro>p{max-width:none}
  .teaching,.learning>.wrap{grid-template-columns:1fr;gap:40px}
  .section-copy,.learning-heading .section-copy{max-width:54ch}
  .teaching-topic p,.learning-path p{max-width:58ch}
}
@media(max-width:759px){
  html{scroll-padding-top:96px}.header-inner{min-height:72px}.brand img{width:128px}
  .hero-copy{grid-template-columns:1fr;gap:24px}
  .hero h1{font-size:clamp(2.5rem,7.8vw,3.5rem);max-width:17ch}
  .hero-intro{padding:0}.hero-intro>p{font-size:1.125rem;max-width:42ch}
  .hero-actions{margin-top:24px;gap:16px 24px}
  .hero-illustration{aspect-ratio:1.25/1;margin-top:36px}.hero-illustration img{object-position:86% 50%}
  .area-overview{padding-top:16px}.area-links{grid-template-columns:1fr;gap:0}
  .area-links>a{display:grid;grid-template-columns:minmax(90px,.65fr) 1fr;align-items:center;gap:20px;padding-block:20px;padding-right:28px}
  .area-links h2{font-size:1.25rem}.area-links p{margin:0;max-width:none}.area-arrow{top:50%;transform:translateY(-50%)}
  .teaching{grid-template-columns:1fr;gap:36px}
  .teaching-topic{padding-block:24px;gap:12px 20px}
  .learning{width:calc(100% - 24px);border-radius:20px}
  .learning>.wrap{width:calc(100% - 40px);grid-template-columns:1fr;gap:40px}
  .learning-path>li{gap:8px 20px}
  .apps-heading{grid-template-columns:1fr;gap:24px;margin-bottom:36px}
  .tool-collection{grid-template-columns:1fr;gap:36px}
  .tool{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:center}
  .tool-card{padding:12px 12px 20px;border-radius:20px}.tool-art{border-radius:12px}
  .tool-card h3{margin:16px 4px 0;font-size:1.25rem}
  .tool-description{padding:0}.tool-description p{font-size:1rem}
  .scovox-note{align-items:flex-start;flex-direction:column;gap:8px;margin-top:36px}
  .trust-details{grid-template-columns:1fr}
  .app-conditions{grid-template-columns:1fr;gap:28px;margin-top:36px;padding-top:28px}
  .closing h2{font-size:clamp(2.25rem,7vw,3.5rem)}
  .footer-top{flex-direction:column;align-items:flex-start;gap:20px}
  .footer-bottom{align-items:flex-start;flex-direction:column;gap:8px}
  .mobile-menu nav{max-height:calc(100dvh - 72px)}
}
@media(max-width:479px){
  .tool{grid-template-columns:1fr;gap:20px}
  .tool-card{padding:16px 16px 24px}
  .tool-card h3{margin:20px 8px 0;font-size:1.5rem}
  .tool-description{padding-inline:8px}
  .section{padding-block:64px}
  .hero .hero-actions{align-items:flex-start;gap:12px 20px}
}
@media(max-width:359px){
  .area-links>a{grid-template-columns:1fr;gap:8px;padding-right:32px}
  .learning-path>li{grid-template-columns:40px 1fr;column-gap:16px}
  .path-node{width:40px;height:44px;border-radius:12px}.path-node img{width:24px;height:24px}.path-node .books{width:28px;height:28px}.path-node .save{width:22px;height:22px}
  .path-line{left:19px;top:56px;height:calc(100% - 32px)}
  .learning-path h3,.teaching-topic h3{font-size:1.25rem}
}
@media(prefers-reduced-transparency:reduce){.site-header{background:var(--color-bg);backdrop-filter:none}}
@media(prefers-contrast:more){p{color:var(--color-base-800)}.site-header{background:var(--color-bg);backdrop-filter:none}:root{--hairline:var(--color-base-600)}}
.edfy-page[data-motion=off] *,.edfy-page[data-motion=off] *::before,.edfy-page[data-motion=off] *::after{animation:none!important;transition:none!important}
.edfy-page[data-motion=off] .brand-button:active{transform:none}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.brand-button:active{transform:none!important}}
@media print{.site-header,.motion-toggle,.mobile-menu{display:none}.section{padding-block:28px}.edfy-page *{animation:none!important}body{background:white}}

/* Existing widget artwork: same warm tonal treatment as the dashboard. */
.tool-art img{filter:grayscale(1) sepia(.45) saturate(.65)}
.web-tools > p { max-width:65ch; }
.web-tools-list { display:grid; grid-template-columns:1fr 1fr; gap:0 32px; margin-top:28px; }
.web-tools-list a { display:flex; align-items:center; gap:20px; padding:20px 0; border-top:1px solid var(--color-base-200,#ddcece); color:inherit; text-decoration:none; min-width:0; }
.web-tools-list a:hover strong { text-decoration:underline; text-underline-offset:4px; }
.web-tools-list img { width:56px; height:56px; object-fit:contain; flex:none; }
.web-tools-list a > span { display:grid; gap:4px; min-width:0; }
.web-tools-list strong { font-size:20px; }
@media(max-width:759px) { .web-tools-list { grid-template-columns:1fr; gap:0; } }
