/* MM Mobiles Arena — Soft Navy Blue theme (same design language as the
   MM Coaching Academy site). Mobile-first, 100% responsive. Inter for
   headings + body, Roboto Mono for labels, eyebrows and small details. */
:root{
  --bg:#EEF3F9; --bg2:#EAF0F8; --surface:#FFFFFF;
  --navy:#122A4A; --navy-deep:#16283F; --navy-grad:#1B3A5C;
  --ink:#33475F; --muted:#64748B; --faint:#94A3B8;
  --accent:#2563EB; --accent-dark:#1D4ED8; --sky:#38BDF8; --sky-soft:#E0F2FE;
  --amber:#F59E0B; --border:#D8E2F0; --border-soft:#E4EBF5;
  --chip-bg:#DBEAFE; --chip-text:#1E40AF;
  --radius:16px; --radius-sm:10px;
  --shadow:0 4px 18px rgba(18,42,74,.08);
  --shadow-lg:0 12px 32px rgba(18,42,74,.14);
  --heading:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --label:"Roboto Mono","Courier New",monospace;
  --sans:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box}
html,body{overflow-x:clip}
@supports not (overflow:clip){body{overflow-x:hidden}}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);
  font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
iframe,video{max-width:100%}
td,.sources a,.source-box a,#compare-share a,.breadcrumb,.card-specs{overflow-wrap:anywhere}
a{color:var(--accent);text-decoration:none}
a:hover{color:var(--accent-dark);text-decoration:underline}
h1,h2,h3{font-family:var(--heading);font-weight:800;color:var(--navy);line-height:1.18;
  letter-spacing:-.015em;margin:0 0 .5em;overflow-wrap:break-word}
h1{font-size:2.4rem} h2{font-size:1.9rem} h3{font-size:1.4rem;font-weight:700}
p{margin:0 0 1em}
::selection{background:var(--sky);color:var(--navy)}
:focus-visible{outline:3px solid var(--sky);outline-offset:2px;border-radius:4px}
.container{max-width:1180px;margin:0 auto;padding:0 18px}
.label{font-family:var(--label);font-size:.72rem;font-weight:500;letter-spacing:.22em;
  text-transform:uppercase;color:var(--accent)}
.muted{color:var(--muted)}
.small{font-size:.86rem}

/* Header — sticky glassy soft navy */
.site-header{position:sticky;top:0;z-index:50;
  background:linear-gradient(135deg,rgba(22,40,63,.97),rgba(27,58,92,.97));
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);color:#fff;
  border-bottom:1px solid rgba(255,255,255,.08);
  box-shadow:0 4px 18px rgba(18,42,74,.25)}
.header-inner{display:flex;align-items:center;justify-content:space-between;
  gap:12px;padding:12px 18px;max-width:1180px;margin:0 auto;flex-wrap:wrap}
.brand{font-family:var(--heading);font-weight:800;font-size:1.7rem;letter-spacing:-.02em;
  color:#fff;line-height:1;text-decoration:none;white-space:nowrap}
.brand:hover{text-decoration:none;color:#fff}
.brand span{color:var(--sky);font-style:italic}
.main-nav{display:flex;gap:6px;flex-wrap:wrap}
.main-nav a{color:#DCE6EF;font-size:.92rem;font-weight:500;padding:12px 12px;
  border-radius:8px;min-height:44px;display:flex;align-items:center}
.main-nav a:hover,.main-nav a.active{color:#fff;background:rgba(255,255,255,.1);
  text-decoration:none}
.main-nav a.active{color:var(--sky)}
.nav-toggle{display:none;background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.4);color:#fff;
  border-radius:10px;font-size:1.3rem;line-height:1;cursor:pointer;
  width:44px;height:44px;align-items:center;justify-content:center;flex:none}

/* Hero — soft navy gradient with subtle dot pattern */
.hero{background:radial-gradient(circle at 85% 15%,rgba(56,189,248,.22),transparent 42%),
  radial-gradient(circle at 8% 90%,rgba(37,99,235,.28),transparent 46%),
  linear-gradient(135deg,#16283F 0%,#1B3A5C 58%,#1E4E8C 100%);
  color:#fff;padding:44px 0 36px;border-radius:0 0 28px 28px}
.hero .label{color:var(--sky)}
.hero h1{color:#fff;font-size:clamp(2.6rem,7vw,4.6rem);margin:.1em 0 .15em}
.hero h1 em{font-style:italic;color:var(--sky)}
.hero p.lede{font-size:1.15rem;max-width:640px;color:#C9D8E6}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:18px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;
  background:linear-gradient(135deg,var(--navy-deep),var(--navy-grad));color:#fff;
  font-weight:700;padding:11px 22px;border-radius:10px;border:1px solid transparent;
  cursor:pointer;font-size:.95rem;font-family:var(--sans);min-height:44px;
  box-shadow:0 4px 14px rgba(18,42,74,.25);
  transition:transform .15s ease,box-shadow .15s ease,background .15s ease}
.btn:hover{background:linear-gradient(135deg,var(--navy-grad),var(--accent));color:#fff;
  text-decoration:none;transform:translateY(-1px);
  box-shadow:0 8px 20px rgba(37,99,235,.35)}
.btn-ghost{background:transparent;color:var(--navy);border:1.5px solid var(--border);
  box-shadow:none}
.btn-ghost:hover{background:var(--bg2);color:var(--navy);border-color:var(--accent);
  box-shadow:none;transform:none}
/* Ghost button on the dark hero: light outline instead of dark. */
.hero .btn-ghost{background:rgba(255,255,255,.08);color:#fff;
  border:1.5px solid rgba(255,255,255,.55)}
.hero .btn-ghost:hover{background:rgba(255,255,255,.16);border-color:#fff;color:#fff}

/* Sections & grids */
.section{padding:34px 0}
.section-head{display:flex;align-items:baseline;justify-content:space-between;
  gap:12px;flex-wrap:wrap;margin-bottom:18px}
.section-head h2{margin:0}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(240px,100%),1fr));gap:18px}
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);
  overflow:hidden;display:flex;flex-direction:column;box-shadow:var(--shadow);
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:#BFD3F2}
.card a.card-link{color:var(--ink)}
.card a.card-link:hover{text-decoration:none}
.card-media{aspect-ratio:1/1;background:var(--bg2);display:flex;
  align-items:center;justify-content:center;overflow:hidden}
.card-media img{width:100%;height:100%;object-fit:contain}
.card-body{padding:14px 16px 16px}
.card-body h3{font-size:1.25rem;margin:0 0 4px}
.card-body h3 a{color:var(--navy)}
.card-body h3 a:hover{color:var(--accent);text-decoration:none}
.card-specs{font-size:.86rem;color:var(--muted);margin:6px 0 0}
.tag{display:inline-block;font-family:var(--label);font-size:.62rem;letter-spacing:.14em;
  text-transform:uppercase;background:var(--chip-bg);color:var(--chip-text);
  border:1px solid #BFDBFE;padding:3px 8px;
  border-radius:99px;margin-bottom:8px}
.tag.rumored{background:#FEF3C7;color:#92400E;border-color:#FDE68A}

/* Branded placeholder (no image available) */
.ph-placeholder{background:linear-gradient(160deg,#1B3A5C,#122A4A);color:#EEF3F9;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:10px;text-align:center;padding:20px;width:100%;height:100%}
.ph-silhouette{width:64px;height:120px;border:3px solid #EEF3F9;border-radius:14px;
  position:relative;opacity:.9}
.ph-silhouette::before{content:"";position:absolute;top:8px;left:50%;transform:translateX(-50%);
  width:22px;height:5px;border-radius:3px;background:#EEF3F9;opacity:.7}
.ph-silhouette::after{content:"";position:absolute;bottom:10px;left:50%;transform:translateX(-50%);
  width:26px;height:26px;border-radius:50%;border:2px solid var(--sky)}
.ph-placeholder .ph-name{font-family:var(--heading);font-weight:600;font-size:1.1rem;line-height:1.2}
.ph-placeholder .ph-mark{font-family:var(--label);font-size:.6rem;letter-spacing:.26em;
  text-transform:uppercase;color:#9FB8D4}

/* Brand tiles */
.brand-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(150px,100%),1fr));gap:14px}
.brand-tile{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);
  padding:20px 14px;text-align:center;color:var(--ink);box-shadow:var(--shadow);
  transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease}
.brand-tile:hover{text-decoration:none;border-color:var(--accent);transform:translateY(-2px);
  box-shadow:var(--shadow-lg)}
.brand-tile strong{font-family:var(--heading);font-weight:700;font-size:1.35rem;
  display:block;color:var(--navy)}
.brand-tile span{font-size:.84rem;color:var(--muted)}

/* Ads — clipped, never causes horizontal overflow */
.ad-slot{margin:26px 0;text-align:center;overflow:hidden;max-width:100%}
.ad-label{display:block;font-family:var(--label);font-size:.6rem;letter-spacing:.26em;
  text-transform:uppercase;color:var(--faint);margin-bottom:6px}
.ad-box{min-height:90px;background:var(--surface);border:1px dashed var(--border);
  border-radius:8px;display:flex;align-items:center;justify-content:center;
  max-width:100%;overflow:hidden}
.ad-box iframe,.ad-box img,.ad-box ins{max-width:100%!important}
.sticky-bar{position:fixed;left:0;right:0;bottom:0;z-index:60;background:var(--navy);
  color:#EEF3F9;display:none;padding:6px 52px 8px 10px;text-align:center}
.sticky-bar .ad-label{color:var(--faint)}
.sticky-bar .revbid-mobile-3477{max-width:100%;overflow:hidden}
.sticky-close{position:absolute;top:2px;right:4px;background:none;border:1px solid var(--faint);
  color:#EEF3F9;border-radius:50%;width:44px;height:44px;cursor:pointer;font-size:1.2rem;line-height:1}
@media (max-width:767px){.sticky-bar{display:block} body{padding-bottom:96px}}

/* Phone page */
.breadcrumb{font-family:var(--label);font-size:.82rem;color:var(--muted);margin:18px 0 6px}
.breadcrumb a{color:var(--muted)}
.phone-layout{display:grid;grid-template-columns:1fr;gap:28px}
@media (min-width:960px){.phone-layout{grid-template-columns:minmax(0,1fr) 300px}}
.phone-hero{display:grid;grid-template-columns:1fr;gap:20px;margin:10px 0 6px}
@media (min-width:640px){.phone-hero{grid-template-columns:320px 1fr}}
/* Phone photos are mostly portrait renders (39% of heroes are portrait,
   median aspect 1:1, some as tall as 0.32 w/h): a 3/4 contain box shows the
   whole phone — the old 4/3 cover box cropped every portrait photo to a
   middle slice, which is why all photos looked like identical slabs.
   News images share this class and get the same no-crop rule. */
.phone-media{border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;
  background:var(--bg2);aspect-ratio:3/4;box-shadow:var(--shadow)}
.phone-media img{width:100%;height:100%;object-fit:contain}
.phone-media .ph-placeholder{min-height:100%}
/* Phone photo: the main image is a button that opens the lightbox. */
.phone-media-btn{display:block;width:100%;height:100%;padding:0;border:none;
  background:none;cursor:zoom-in;position:relative}
.phone-media-btn:focus-visible{outline:3px solid var(--accent);outline-offset:-3px}
.phone-media-btn img{display:block}
.enlarge-hint{position:absolute;right:10px;bottom:10px;background:rgba(18,42,74,.85);
  color:#fff;font-family:var(--label);font-size:.62rem;letter-spacing:.14em;
  text-transform:uppercase;padding:6px 10px;border-radius:999px;pointer-events:none}
/* Thumbnail strip (only on phones with extra gallery photos). */
.thumb-strip{display:flex;gap:10px;flex-wrap:wrap;margin:12px 0 4px}
.thumb{width:64px;height:64px;min-width:44px;min-height:44px;padding:3px;
  border:2px solid var(--border);border-radius:10px;background:var(--bg2);
  cursor:pointer;overflow:hidden}
.thumb img{width:100%;height:100%;object-fit:contain;display:block}
.thumb.active{border-color:var(--accent)}
.thumb:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
/* Lightbox: full-size photo viewer (z-index above sticky header + sticky ad bar). */
.lightbox{position:fixed;inset:0;z-index:100;background:rgba(13,25,43,.94);
  display:none;align-items:center;justify-content:center;flex-direction:column;
  padding:16px}
.lightbox.open{display:flex}
.lightbox .lb-img{max-width:min(94vw,1200px);max-height:78vh;object-fit:contain;
  border-radius:8px;background:#000}
.lb-caption{color:#EEF3F9;font-size:.92rem;margin-top:14px;text-align:center;
  max-width:min(94vw,1200px)}
.lb-close{position:absolute;top:14px;right:14px;width:44px;height:44px;
  border-radius:50%;border:1px solid rgba(255,255,255,.4);
  background:rgba(18,42,74,.7);color:#fff;font-size:1.5rem;line-height:1;cursor:pointer}
.lb-nav{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;
  border-radius:50%;border:1px solid rgba(255,255,255,.4);
  background:rgba(18,42,74,.7);color:#fff;font-size:1.5rem;line-height:1;cursor:pointer}
.lb-prev{left:12px}
.lb-next{right:12px}
.lb-close:hover,.lb-nav:hover{background:var(--accent);border-color:var(--accent)}
.lb-close:focus-visible,.lb-nav:focus-visible{outline:2px solid #fff;outline-offset:2px}
@media (max-width:640px){
  .lb-nav{top:auto;bottom:76px;transform:none}
  .lb-prev{left:16px}
  .lb-next{right:16px}
}
.key-specs{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);
  padding:18px 20px;box-shadow:var(--shadow)}
.key-specs dl{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(130px,100%),1fr));
  gap:14px;margin:14px 0 0}
.key-specs dt{font-family:var(--label);font-size:.62rem;letter-spacing:.18em;
  text-transform:uppercase;color:var(--muted)}
.key-specs dd{margin:2px 0 0;font-weight:600;color:var(--navy)}
.spec-table{width:100%;border-collapse:collapse;margin:10px 0 26px;font-size:.95rem}
.spec-table th{text-align:left;font-family:var(--label);font-size:.68rem;
  letter-spacing:.2em;text-transform:uppercase;color:#fff;background:var(--navy);
  padding:10px 12px}
.spec-table td{padding:9px 12px;border-bottom:1px solid var(--border-soft);vertical-align:top}
.spec-table td:first-child{width:34%;color:var(--muted)}
.spec-table tr:nth-child(even) td{background:var(--bg2)}
.sidebar .ad-box{min-height:600px}
/* The 300x600 skyscraper sidebar is desktop-only: below the two-column
   breakpoint it would be a 600px-tall box on a single-column page, and the
   300px creative overflows a 320px viewport. Mobile already has the
   leaderboard + sticky bar. */
@media (max-width:959px){.sidebar{display:none}}
.sources{font-size:.9rem}
.faq-item{border:1px solid var(--border);border-radius:var(--radius);padding:14px 18px;
  margin-bottom:10px;background:var(--surface);box-shadow:var(--shadow)}
.faq-item h3{font-size:1.15rem;margin-bottom:4px;color:var(--navy)}
.faq-item p{margin:0;color:var(--muted)}

/* Finder & compare */
.filters{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);
  padding:18px;margin:18px 0 24px;display:grid;gap:14px;box-shadow:var(--shadow);
  grid-template-columns:repeat(auto-fit,minmax(min(180px,100%),1fr))}
.filters label{display:block;font-family:var(--label);font-size:.68rem;
  letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:5px}
.filters input,.filters select{width:100%;padding:12px 14px;border:1.5px solid var(--border);
  border-radius:10px;background:#F8FAFC;color:var(--ink);font-size:1rem;font-family:var(--sans);
  min-height:44px}
.filters input:focus,.filters select:focus{outline:none;border-color:var(--accent);
  background:#fff;box-shadow:0 0 0 4px rgba(37,99,235,.14)}
.filters .check-row{display:flex;align-items:center;gap:8px}
.filters .check-row input{width:auto}
.filters .check-row input[type="checkbox"]{width:22px;height:22px;accent-color:var(--accent)}
.brand-checks{display:flex;flex-wrap:wrap;gap:8px}
.brand-checks label{display:flex;align-items:center;gap:6px;font-family:var(--sans);
  font-size:.9rem;letter-spacing:0;text-transform:none;color:var(--navy);
  background:var(--surface);border:1px solid var(--border);border-radius:99px;padding:12px 14px;cursor:pointer}
.brand-checks label:hover{border-color:var(--accent);color:var(--accent)}
.brand-checks input{width:auto;margin:0}
.compare-picks{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(200px,100%),1fr));gap:14px;margin:18px 0}
.compare-picks label{display:block;font-family:var(--label);font-size:.68rem;
  letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:5px}
.compare-picks select{width:100%;padding:12px 14px;border:1.5px solid var(--border);
  border-radius:10px;background:#F8FAFC;color:var(--ink);font-size:1rem;min-height:44px}
.compare-picks select:focus{outline:none;border-color:var(--accent);
  background:#fff;box-shadow:0 0 0 4px rgba(37,99,235,.14)}
.compare-table{width:100%;border-collapse:collapse;font-size:.92rem;margin:10px 0 26px;min-width:540px}
.compare-table th,.compare-table td{padding:9px 10px;border-bottom:1px solid var(--border-soft);
  vertical-align:top;text-align:left}
.compare-table th{background:var(--bg2);color:var(--navy);font-family:var(--heading);font-weight:700;font-size:1.05rem}
.compare-table td:first-child{color:var(--muted);width:130px}
.compare-table tr:nth-child(even) td{background:#F8FAFC}
.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.scroll-hint{display:none;font-size:.86rem;color:var(--muted);margin:0 0 8px}
@media (max-width:767px){.scroll-hint{display:block}}
.empty-state{background:var(--surface);border:1px dashed var(--border);border-radius:var(--radius);
  padding:34px 20px;text-align:center;color:var(--muted)}

/* News */
.news-card h3{font-size:1.3rem}
.news-meta{font-size:.84rem;color:var(--muted);margin:4px 0 8px}
.article{max-width:760px}
.article h1{font-size:2.5rem}
.article .news-meta{margin:8px 0 18px}
.article-body p{font-size:1.05rem}
.article-body h2{margin-top:1.4em}
.source-box{border-top:1px solid var(--border);margin-top:28px;padding-top:16px;font-size:.92rem}

/* Trust pages */
.prose{max-width:780px}
.prose h2{margin-top:1.6em}
.prose ul{margin:0 0 1em;padding-left:22px}
.prose li{margin-bottom:.4em}
.sitemap-list{columns:2;column-gap:32px}
.sitemap-list li{break-inside:avoid;margin-bottom:4px}
@media (max-width:640px){.sitemap-list{columns:1}}

/* About page — founder hero */
.about-hero{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);
  padding:28px 24px;display:grid;grid-template-columns:1fr;gap:24px;margin:18px 0 28px;
  box-shadow:var(--shadow)}
@media (min-width:720px){.about-hero{grid-template-columns:280px 1fr;padding:36px;gap:36px;
  align-items:center}}
.founder-photo{position:relative;max-width:320px}
.founder-photo::before{content:"";position:absolute;inset:-10px;border-radius:22px;
  background:linear-gradient(135deg,var(--accent),var(--sky));opacity:.9;z-index:0}
.founder-photo img{position:relative;z-index:1;width:100%;height:auto;border-radius:16px;
  border:4px solid #fff;box-shadow:var(--shadow-lg)}
.about-hero h1{color:var(--navy);margin:.15em 0 .2em}
.about-hero .label{color:var(--accent)}
.founder-role{font-family:var(--label);font-size:.72rem;letter-spacing:.2em;
  text-transform:uppercase;color:var(--muted);margin-bottom:14px}
.about-hero p{color:var(--muted)}
.founder-quote{font-size:1.15rem;color:var(--navy);border-left:3px solid var(--sky);
  padding-left:14px;margin:18px 0 0}
.quality-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr));
  gap:14px;margin:18px 0 28px}
.quality-card{background:var(--surface);border:1px solid var(--border);border-top:3px solid var(--sky);
  border-radius:var(--radius);padding:20px;box-shadow:var(--shadow)}
.quality-card h3{font-size:1.1rem;margin-bottom:6px;margin-top:0}
.quality-card p{margin:0;font-size:.94rem;color:var(--muted)}
.mission-list{list-style:none;margin:0 0 1em;padding:0}
.mission-list li{padding:10px 0 10px 28px;border-bottom:1px solid var(--border-soft);position:relative}
.mission-list li::before{content:"";position:absolute;left:2px;top:18px;width:10px;
  height:10px;background:var(--accent);border-radius:2px}

/* Footer — deep soft navy */
.site-footer{background:linear-gradient(180deg,#16283F,#122A4A);color:#C9D8E6;
  margin-top:44px;padding:40px 0 22px}
.footer-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(180px,100%),1fr));gap:24px}
.site-footer h4{font-family:var(--label);font-size:.72rem;font-weight:500;letter-spacing:.22em;
  text-transform:uppercase;color:#fff;margin:0 0 12px}
.site-footer ul{list-style:none;margin:0;padding:0}
.site-footer li{margin-bottom:6px}
.site-footer a{color:#C9D8E6;display:flex;align-items:center;padding:10px 0;min-height:44px}
.site-footer a:hover{color:var(--sky);text-decoration:none}
.footer-note{margin-top:30px;padding-top:18px;border-top:1px solid rgba(255,255,255,.14);
  font-size:.85rem;text-align:center;color:#8FA6B8}

/* Mobile nav */
@media (max-width:860px){
  .nav-toggle{display:flex}
  .main-nav{display:none;flex-direction:column;width:100%;padding-bottom:12px}
  .main-nav.open{display:flex;border-top:1px solid rgba(255,255,255,.14);padding-top:8px}
  .main-nav.open a{display:flex;padding:12px 10px;min-height:44px}
  .header-inner{flex-wrap:wrap}
}
/* Spec tables stack label/value rows on narrow screens — no sideways scroll. */
@media (max-width:640px){
  .spec-table tbody tr{display:block;border-bottom:1px solid var(--border-soft)}
  .spec-table tbody td{display:block;width:100%!important;border-bottom:none;padding:3px 12px}
  .spec-table tbody td:first-child{padding-top:10px;font-family:var(--label);
    font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
  .spec-table tbody td:last-child{padding-bottom:10px}
  .filters{grid-template-columns:1fr}
  .filters .btn{width:100%}
}
@media (max-width:480px){
  h1{font-size:2rem}
  .hero{padding:32px 0 22px}
  .hero h1{font-size:2.3rem}
  .article h1{font-size:2rem}
  .brand{font-size:1.4rem}
  .about-hero{padding:24px 18px}
  .phone-hero{grid-template-columns:1fr}
}
@media (max-width:719px){
  .founder-photo{margin:0 auto}
}