:root{--bg:#05070d;--ink:#0c1220;--muted:#5f6d82;--line:rgba(255,255,255,.16);--blue:#45d6ff;--cyan:#7cf4ff;--violet:#8f8cff;--amber:#ffc45a;--gold:#ffdc8a;--soft:#f6f8fc;--shadow:0 28px 80px rgba(7,15,31,.16)}*{box-sizing:border-box}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:linear-gradient(180deg,#05070d 0,#08111f 18%,#f7f9fd 40%,#fff)}a{text-decoration:none;color:inherit}.nav{position:fixed;top:18px;left:50%;transform:translateX(-50%);width:min(1120px,calc(100% - 32px));height:64px;z-index:10;display:flex;align-items:center;justify-content:space-between;border:1px solid rgba(255,255,255,.18);background:rgba(7,12,22,.64);backdrop-filter:blur(24px);border-radius:22px;padding:0 18px;color:white;box-shadow:0 20px 70px rgba(0,0,0,.30),0 0 60px rgba(69,214,255,.08)}.brand{display:flex;align-items:center;gap:10px;font-weight:800;letter-spacing:-.035em}.mark,.app-icon{display:grid;place-items:center;background:linear-gradient(135deg,var(--cyan),var(--blue) 45%,var(--amber));color:white;box-shadow:0 14px 42px rgba(69,214,255,.24)}.mark{width:34px;height:34px;border-radius:12px}.app-icon{width:58px;height:58px;border-radius:18px;font-weight:900}.app-icon span{font-size:18px}.nav nav{display:flex;gap:24px;font-size:14px;color:rgba(255,255,255,.78)}.nav nav a:hover{color:white}.actions{display:flex;gap:10px}.in,#menu{width:36px;height:36px;border-radius:12px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.1);color:white;display:grid;place-items:center;font-weight:800}#menu{display:none;font-size:20px}#panel{position:fixed;z-index:9;right:16px;top:92px;width:260px;background:rgba(10,15,28,.9);backdrop-filter:blur(22px);border:1px solid rgba(255,255,255,.18);border-radius:22px;padding:14px;color:white;box-shadow:0 24px 70px rgba(0,0,0,.34)}#panel a{display:block;padding:14px;border-radius:14px;color:rgba(255,255,255,.86)}.hero{min-height:850px;padding:160px 24px 96px;color:white;background:radial-gradient(circle at 18% 24%,rgba(69,214,255,.30),transparent 25%),radial-gradient(circle at 76% 13%,rgba(255,196,90,.22),transparent 25%),radial-gradient(circle at 64% 75%,rgba(143,140,255,.18),transparent 30%),linear-gradient(145deg,#05070d,#0b1626 54%,#050b14);position:relative}.hero:after{content:"";position:absolute;inset:auto -10% -18% -10%;height:330px;background:linear-gradient(180deg,transparent,#f7f9fd 72%)}.hero-inner{position:relative;z-index:1;width:min(1120px,100%);margin:0 auto;display:grid;grid-template-columns:1.05fr .95fr;gap:42px;align-items:center}.eyebrow{display:inline-flex;gap:9px;align-items:center;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.08);padding:9px 12px;border-radius:999px;color:rgba(255,255,255,.78);font-size:14px}.dot{width:8px;height:8px;border-radius:50%;background:#9cffd0;box-shadow:0 0 20px #9cffd0}h1{font-size:clamp(46px,7vw,84px);line-height:.94;letter-spacing:-.075em;margin:22px 0 20px}.hero p,.page-hero p{font-size:clamp(18px,2.1vw,23px);line-height:1.55;color:rgba(255,255,255,.74);max-width:720px}.btns{display:flex;gap:14px;margin-top:32px;flex-wrap:wrap}.button{display:inline-flex;border-radius:16px;padding:14px 19px;font-weight:800}.primary{background:white;color:#08101e}.secondary{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);color:white}.visual{height:520px;position:relative}.float{position:absolute;width:238px;min-height:168px;border-radius:28px;padding:18px;background:linear-gradient(150deg,rgba(255,255,255,.18),rgba(255,255,255,.06));border:1px solid rgba(255,255,255,.20);backdrop-filter:blur(18px);box-shadow:0 30px 70px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.10);animation:float 6s ease-in-out infinite}.float h3{margin:12px 0 8px;font-size:21px;letter-spacing:-.04em}.float p{font-size:13px;color:rgba(255,255,255,.65);margin:0}.float:nth-child(1){left:34%;top:0}.float:nth-child(2){left:2%;top:105px;animation-delay:.8s}.float:nth-child(3){right:0;top:150px;animation-delay:1.4s}.float:nth-child(4){left:22%;bottom:48px;animation-delay:2s}.float:nth-child(5){right:18%;bottom:0;animation-delay:2.8s}@keyframes float{50%{translate:0 -16px}}.section{padding:86px 24px}.inner{width:min(1120px,100%);margin:0 auto}.head{display:flex;align-items:end;justify-content:space-between;gap:32px;margin-bottom:30px}h2{font-size:clamp(34px,4vw,56px);line-height:1;letter-spacing:-.065em;margin:0}.intro{color:var(--muted);font-size:18px;line-height:1.55;max-width:700px}.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.three{grid-template-columns:repeat(3,1fr)}.card{border:1px solid rgba(15,23,42,.09);border-radius:28px;background:rgba(255,255,255,.86);box-shadow:var(--shadow);padding:22px;position:relative;overflow:hidden}.card h3{font-size:22px;line-height:1.08;letter-spacing:-.045em;margin:18px 0 10px}.card p{color:#627087;line-height:1.48;margin:0 0 18px}.card small{display:block;color:#7a8598;margin-bottom:16px}.pill{position:absolute;right:18px;top:18px;font-size:12px;font-weight:800;color:#435067;background:#eef3fb;border-radius:999px;padding:7px 10px}.link{font-weight:800;color:#174ea6}.kicker{color:#174ea6;font-weight:900;text-transform:uppercase;letter-spacing:.12em;font-size:12px}.soft{background:#f7f9fd}.dark{background:radial-gradient(circle at 18% 8%,rgba(255,196,90,.14),transparent 26%),linear-gradient(135deg,#05070d,#0b1626);color:white}.dark .intro{color:rgba(255,255,255,.68)}.bundle{display:grid;grid-template-columns:1fr 1.2fr;gap:26px;align-items:center;background:linear-gradient(145deg,rgba(255,255,255,.13),rgba(255,255,255,.06));border:1px solid rgba(255,255,255,.14);color:white}.bundle p{color:rgba(255,255,255,.72)}.art{min-height:240px;border-radius:24px;background:radial-gradient(circle at 30% 30%,rgba(255,196,90,.46),transparent 28%),radial-gradient(circle at 70% 55%,rgba(69,214,255,.40),transparent 34%),linear-gradient(135deg,rgba(255,255,255,.13),rgba(255,255,255,.04));border:1px solid rgba(255,255,255,.12);display:grid;place-items:center;font-size:56px;font-weight:900;letter-spacing:-.08em}.page{padding:150px 24px 90px;background:#f7f9fd;min-height:70vh}.page-inner{width:min(980px,100%);margin:0 auto}.page-hero{margin-bottom:42px}.page-hero h1{color:#0c1220}.page-hero p{color:#637084}.detail{display:grid;grid-template-columns:1fr .7fr;gap:32px;align-items:center}.mock{height:450px;border-radius:44px;background:linear-gradient(160deg,#0c1220,#24314d);box-shadow:0 34px 90px rgba(6,13,27,.26);border:8px solid #111827;display:grid;place-items:center;color:white;text-align:center;padding:30px}.mock .app-icon{margin:auto;width:96px;height:96px;border-radius:28px}.faq{display:grid;gap:14px;margin-top:26px}.faq details{background:white;border:1px solid rgba(15,23,42,.08);border-radius:20px;padding:18px 20px;box-shadow:0 12px 34px rgba(15,23,42,.06)}.faq summary{font-weight:800;cursor:pointer}.faq p{color:#637084;line-height:1.55}.studio{border-radius:34px;padding:42px;background:radial-gradient(circle at 12% 10%,rgba(69,214,255,.16),transparent 28%),radial-gradient(circle at 90% 0%,rgba(255,196,90,.12),transparent 26%),linear-gradient(135deg,#05070d,#0b1626);color:white;display:grid;grid-template-columns:1fr .65fr;gap:30px;box-shadow:0 34px 90px rgba(6,13,27,.18)}.studio p{color:rgba(255,255,255,.72);font-size:18px;line-height:1.6}.trust span{display:block;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.11);padding:14px 16px;border-radius:16px;margin:10px 0;color:rgba(255,255,255,.8)}footer{display:grid;grid-template-columns:1.7fr repeat(3,1fr);gap:30px;width:min(1120px,calc(100% - 48px));margin:0 auto;padding:58px 0 70px;border-top:1px solid rgba(15,23,42,.09)}footer p{color:var(--muted)}footer a:not(.brand){display:block;color:#657185;margin:10px 0}@media(max-width:900px){.nav nav,.in{display:none}#menu{display:grid}.hero-inner,.detail,.studio,.bundle{grid-template-columns:1fr}.grid,.three{grid-template-columns:1fr 1fr}.visual{height:430px}.float{width:210px}footer{grid-template-columns:1fr 1fr}}@media(max-width:620px){.grid,.three{grid-template-columns:1fr}.head{display:block}.visual{display:none}.hero{min-height:auto;padding-top:132px}.nav{top:10px;width:calc(100% - 20px)}footer{grid-template-columns:1fr}}

/* v2 refinements: graphite glass + electric blue + amber */
.nav{
  height:58px;
  border-radius:20px;
}
.page{
  padding-top:138px;
}
.card{
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.card:hover{
  transform:translateY(-4px);
  border-color:rgba(69,214,255,.22);
  box-shadow:0 34px 90px rgba(7,15,31,.20);
}
.float{
  transition:transform .22s ease, border-color .22s ease;
}
.float:hover{
  border-color:rgba(255,196,90,.34);
}
.button.primary{
  box-shadow:0 18px 50px rgba(69,214,255,.13);
}
.link{
  color:#075aa8;
}
.hero:before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px),
    linear-gradient(180deg,rgba(255,255,255,.025) 1px,transparent 1px);
  background-size:72px 72px;
  mask-image:linear-gradient(180deg,rgba(0,0,0,.48),transparent 70%);
  pointer-events:none;
}


/* v3 cleanup: user-facing studio language */
.trust span strong{
  display:block;
  color:#fff;
  font-size:15px;
  margin-bottom:4px;
}
.trust span{
  line-height:1.35;
}


/* v5 information architecture upgrade */
.app-row,.article-row{
  display:grid;
  align-items:center;
  gap:14px;
  background:rgba(255,255,255,.84);
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 14px 34px rgba(15,23,42,.06);
  border-radius:22px;
  padding:14px;
  transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease;
}
.app-row:hover,.article-row:hover,.support-line:hover{
  transform:translateY(-2px);
  border-color:rgba(69,214,255,.22);
  box-shadow:0 18px 44px rgba(15,23,42,.10);
}
.app-row{grid-template-columns:auto 1fr auto;}
.app-row .app-icon{width:46px;height:46px;border-radius:14px}
.app-row strong{display:block;font-size:16px;letter-spacing:-.02em}
.app-row small{display:block;color:#6b768a;margin-top:3px}
.app-row em{font-style:normal;font-size:12px;color:#556277;background:#edf3fb;border-radius:999px;padding:7px 10px}
.editorial-split{
  display:grid;
  grid-template-columns:.88fr 1.12fr;
  gap:26px;
  align-items:start;
  margin:34px 0 42px;
}
.spotlight{
  min-height:430px;
  border-radius:34px;
  padding:30px;
  background:
    radial-gradient(circle at 16% 12%,rgba(69,214,255,.18),transparent 28%),
    radial-gradient(circle at 92% 5%,rgba(255,196,90,.16),transparent 30%),
    linear-gradient(135deg,#05070d,#0b1626);
  color:white;
  box-shadow:0 34px 90px rgba(6,13,27,.22);
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}
.spotlight p{color:rgba(255,255,255,.72);line-height:1.6;font-size:17px}
.spotlight h2{font-size:clamp(32px,4vw,52px)}
.compact-list{display:grid;gap:12px}
.category-pills{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:22px 0 10px;
}
.category-pills a,.topic-pill{
  border:1px solid rgba(15,23,42,.09);
  background:white;
  box-shadow:0 10px 24px rgba(15,23,42,.05);
  color:#243047;
  padding:10px 13px;
  border-radius:999px;
  font-weight:800;
  font-size:13px;
}
.catalog-block{
  margin-top:44px;
  border-radius:34px;
  background:#fff;
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 22px 60px rgba(15,23,42,.08);
  overflow:hidden;
}
.catalog-head{
  padding:24px 26px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  background:linear-gradient(180deg,#fff,#f7f9fd);
  border-bottom:1px solid rgba(15,23,42,.08);
}
.catalog-head h2{font-size:30px}
.catalog-grid{
  padding:20px;
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:12px;
}
.bundle-list{display:grid;gap:18px;margin-top:30px}
.bundle-panel{
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:22px;
  padding:24px;
  border-radius:30px;
  background:rgba(255,255,255,.88);
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 20px 55px rgba(15,23,42,.08);
}
.bundle-badge{
  width:96px;height:96px;border-radius:28px;
  display:grid;place-items:center;
  color:white;font-weight:950;font-size:27px;letter-spacing:-.06em;
  background:
    radial-gradient(circle at 28% 22%,rgba(255,220,138,.75),transparent 30%),
    linear-gradient(135deg,#45d6ff,#0b7bd3 50%,#ffc45a);
  box-shadow:0 20px 44px rgba(69,214,255,.18);
}
.bundle-copy h3{font-size:28px;letter-spacing:-.045em;margin:8px 0 8px}
.bundle-copy p{color:#627087;line-height:1.5;margin:0 0 9px}
.bundle-copy small{color:#7a8598}
.guide-feature-grid{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:18px;
  margin:30px 0 34px;
}
.feature-guide{
  border-radius:34px;
  padding:28px;
  min-height:250px;
  background:
    radial-gradient(circle at 85% 8%,rgba(69,214,255,.17),transparent 30%),
    linear-gradient(135deg,#fff,#f7f9fd);
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 24px 70px rgba(15,23,42,.08);
}
.feature-guide:first-child{
  background:
    radial-gradient(circle at 14% 12%,rgba(255,196,90,.18),transparent 28%),
    radial-gradient(circle at 90% 6%,rgba(69,214,255,.18),transparent 30%),
    linear-gradient(135deg,#07101d,#0d1a2d);
  color:white;
}
.feature-guide:first-child p{color:rgba(255,255,255,.72)}
.feature-guide h3{font-size:30px;letter-spacing:-.045em;margin:14px 0 12px}
.feature-guide p{color:#627087;line-height:1.55}
.article-row{
  grid-template-columns:170px 1fr 150px;
  color:#1a2435;
}
.article-row span{font-size:13px;font-weight:850;color:#1765a8}
.article-row strong{font-size:16px}
.article-row em{font-style:normal;color:#7a8598;text-align:right;font-size:13px}
.topic-strip{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:16px 0 32px;
}
.support-hero-panel{
  border-radius:34px;
  padding:30px;
  background:
    radial-gradient(circle at 15% 12%,rgba(69,214,255,.16),transparent 30%),
    radial-gradient(circle at 90% 0%,rgba(255,196,90,.14),transparent 28%),
    linear-gradient(135deg,#05070d,#0b1626);
  color:white;
  box-shadow:0 34px 90px rgba(6,13,27,.22);
  margin-bottom:30px;
}
.support-hero-panel p{color:rgba(255,255,255,.72);line-height:1.55;font-size:18px;max-width:720px}
.support-columns{
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:22px;
  align-items:start;
}
.support-box{
  border-radius:30px;
  background:#fff;
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 20px 55px rgba(15,23,42,.08);
  padding:24px;
}
.support-box h2{font-size:30px;margin-bottom:14px}
.support-line{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:14px 0;
  border-bottom:1px solid rgba(15,23,42,.08);
}
.support-line:last-child{border-bottom:none}
.support-line span{color:#657287;font-size:13px}
@media(max-width:900px){
  .editorial-split,.guide-feature-grid,.support-columns{grid-template-columns:1fr}
  .bundle-panel{grid-template-columns:auto 1fr}
  .bundle-panel .link{grid-column:2}
  .catalog-grid{grid-template-columns:1fr}
  .article-row{grid-template-columns:1fr}
  .article-row em{text-align:left}
}
@media(max-width:620px){
  .bundle-panel{grid-template-columns:1fr}
  .bundle-panel .link{grid-column:auto}
  .bundle-badge{width:78px;height:78px;border-radius:22px;font-size:22px}
}


/* v6 homepage upgrade: less card grid, more product showcase */
.home-showcase-section{
  padding-top:92px;
}
.home-showcase{
  display:grid;
  grid-template-columns:1.12fr .88fr;
  gap:20px;
  align-items:stretch;
}
.showcase-main{
  min-height:420px;
  border-radius:38px;
  padding:32px;
  color:white;
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:28px;
  align-items:center;
  background:
    radial-gradient(circle at 15% 12%,rgba(69,214,255,.22),transparent 30%),
    radial-gradient(circle at 92% 5%,rgba(255,196,90,.20),transparent 30%),
    linear-gradient(135deg,#05070d,#0b1626);
  box-shadow:0 34px 90px rgba(6,13,27,.22);
  border:1px solid rgba(255,255,255,.10);
  overflow:hidden;
  position:relative;
}
.showcase-main:after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px),
    linear-gradient(180deg,rgba(255,255,255,.025) 1px,transparent 1px);
  background-size:56px 56px;
  mask-image:linear-gradient(90deg,rgba(0,0,0,.45),transparent 80%);
  pointer-events:none;
}
.showcase-main-copy,.showcase-device{
  position:relative;
  z-index:1;
}
.showcase-main h3{
  font-size:clamp(40px,5vw,64px);
  line-height:.95;
  letter-spacing:-.07em;
  margin:12px 0 16px;
}
.showcase-main p{
  color:rgba(255,255,255,.74);
  font-size:18px;
  line-height:1.55;
}
.showcase-main .button.secondary{
  border-color:rgba(255,255,255,.18);
}
.showcase-device{
  min-height:330px;
  border-radius:34px;
  background:
    radial-gradient(circle at 26% 20%,rgba(69,214,255,.18),transparent 32%),
    linear-gradient(155deg,rgba(255,255,255,.13),rgba(255,255,255,.04));
  border:1px solid rgba(255,255,255,.15);
  backdrop-filter:blur(18px);
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  text-align:center;
  padding:28px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 24px 70px rgba(0,0,0,.20);
}
.showcase-device .app-icon{
  width:92px;
  height:92px;
  border-radius:28px;
  margin-bottom:22px;
}
.showcase-device strong{
  font-size:28px;
  letter-spacing:-.045em;
}
.showcase-device span{
  color:rgba(255,255,255,.64);
  margin-top:8px;
  line-height:1.4;
}
.showcase-side{
  display:grid;
  gap:16px;
}
.showcase-small{
  min-height:128px;
  display:grid;
  grid-template-columns:auto 1fr;
  column-gap:16px;
  align-items:start;
  border-radius:28px;
  padding:20px;
  background:rgba(255,255,255,.86);
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 22px 60px rgba(15,23,42,.08);
  transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease;
}
.showcase-small:hover{
  transform:translateY(-3px);
  border-color:rgba(69,214,255,.24);
  box-shadow:0 28px 70px rgba(15,23,42,.12);
}
.showcase-small .app-icon{
  grid-row:1 / span 3;
}
.showcase-small h3{
  font-size:23px;
  line-height:1.05;
  letter-spacing:-.04em;
  margin:8px 0 8px;
}
.showcase-small p{
  color:#627087;
  line-height:1.42;
  margin:0;
}
.home-mini-list{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:12px;
  margin-top:18px;
}
.home-mini-app{
  display:grid;
  grid-template-columns:auto 1fr;
  align-items:center;
  gap:12px;
  padding:14px;
  border-radius:22px;
  background:rgba(255,255,255,.76);
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 14px 34px rgba(15,23,42,.06);
}
.home-mini-app .app-icon{
  width:44px;
  height:44px;
  border-radius:14px;
}
.home-mini-app strong{
  display:block;
  font-size:15px;
  letter-spacing:-.025em;
}
.home-mini-app small{
  display:block;
  color:#6b768a;
  margin-top:2px;
}
.home-mini-app em{
  grid-column:1 / -1;
  font-style:normal;
  color:#1765a8;
  font-size:12px;
  font-weight:850;
}
.home-bundles .head{
  align-items:center;
}
.bundle-chip-row{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:14px;
}
.bundle-chip{
  min-height:132px;
  border-radius:28px;
  padding:20px;
  background:
    radial-gradient(circle at 80% 10%,rgba(255,196,90,.16),transparent 34%),
    linear-gradient(145deg,rgba(255,255,255,.12),rgba(255,255,255,.05));
  border:1px solid rgba(255,255,255,.14);
  box-shadow:0 24px 70px rgba(0,0,0,.18);
  color:white;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  transition:transform .22s ease,border-color .22s ease;
}
.bundle-chip:hover{
  transform:translateY(-3px);
  border-color:rgba(255,196,90,.28);
}
.bundle-chip strong{
  font-size:21px;
  line-height:1.05;
  letter-spacing:-.04em;
}
.bundle-chip span{
  color:rgba(255,255,255,.64);
  font-weight:700;
  font-size:13px;
}
.home-category-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
}
.home-category-chip{
  display:block;
  padding:18px 20px;
  border-radius:24px;
  background:#fff;
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 16px 40px rgba(15,23,42,.06);
}
.home-category-chip strong{
  display:block;
  font-size:19px;
  letter-spacing:-.035em;
  margin-bottom:6px;
}
.home-category-chip span{
  display:block;
  color:#657287;
  line-height:1.42;
}
.home-guide-editorial{
  display:grid;
  grid-template-columns:.95fr 1.05fr;
  gap:22px;
  align-items:stretch;
}
.home-guide-feature{
  border-radius:36px;
  padding:30px;
  color:white;
  background:
    radial-gradient(circle at 15% 12%,rgba(255,196,90,.20),transparent 30%),
    radial-gradient(circle at 90% 4%,rgba(69,214,255,.18),transparent 30%),
    linear-gradient(135deg,#07101d,#0d1a2d);
  box-shadow:0 30px 80px rgba(15,23,42,.18);
}
.home-guide-feature h2{
  margin:16px 0;
}
.home-guide-feature p{
  color:rgba(255,255,255,.72);
  line-height:1.55;
  font-size:17px;
}
.home-guide-list{
  border-radius:36px;
  padding:24px;
  background:#fff;
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 22px 60px rgba(15,23,42,.08);
}
.compact-head{
  margin-bottom:18px;
}
.compact-head h2{
  font-size:34px;
}
.guide-line{
  display:grid;
  grid-template-columns:150px 1fr;
  gap:16px;
  padding:16px 0;
  border-top:1px solid rgba(15,23,42,.08);
  align-items:center;
}
.guide-line span{
  color:#1765a8;
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.12em;
  font-weight:900;
}
.guide-line strong{
  font-size:17px;
  letter-spacing:-.025em;
}
@media(max-width:1000px){
  .home-showcase,.home-guide-editorial,.showcase-main{
    grid-template-columns:1fr;
  }
  .bundle-chip-row,.home-mini-list{
    grid-template-columns:repeat(2,1fr);
  }
}
@media(max-width:700px){
  .home-category-grid,.bundle-chip-row,.home-mini-list{
    grid-template-columns:1fr;
  }
  .guide-line{
    grid-template-columns:1fr;
    gap:6px;
  }
  .showcase-main{
    padding:24px;
  }
}


/* v7 product and bundle detail page upgrade */
.page-inner.wide{
  width:min(1120px,100%);
}
.app-hero-v7,.bundle-hero-v7{
  display:grid;
  grid-template-columns:1fr .82fr;
  gap:34px;
  align-items:center;
  margin-bottom:42px;
}
.app-hero-copy h1,.bundle-hero-v7 h1{
  font-size:clamp(44px,6vw,76px);
  line-height:.95;
  letter-spacing:-.075em;
  margin:14px 0 18px;
  color:#0c1220;
}
.app-hero-copy p,.bundle-hero-v7 p{
  font-size:20px;
  color:#5f6d82;
  line-height:1.6;
  max-width:720px;
}
.app-hero-product,.bundle-art-v7{
  min-height:460px;
  border-radius:42px;
  position:relative;
  overflow:hidden;
  display:grid;
  place-items:center;
  background:
    radial-gradient(circle at 22% 18%,rgba(69,214,255,.22),transparent 30%),
    radial-gradient(circle at 88% 4%,rgba(255,196,90,.20),transparent 30%),
    linear-gradient(135deg,#05070d,#0b1626);
  box-shadow:0 34px 90px rgba(6,13,27,.22);
  border:1px solid rgba(255,255,255,.10);
}
.product-orb{
  position:absolute;
  width:260px;
  height:260px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(69,214,255,.24),transparent 62%);
  filter:blur(4px);
}
.product-card-main{
  position:relative;
  z-index:1;
  width:min(300px,80%);
  min-height:330px;
  border-radius:36px;
  background:linear-gradient(155deg,rgba(255,255,255,.16),rgba(255,255,255,.05));
  border:1px solid rgba(255,255,255,.16);
  backdrop-filter:blur(20px);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  color:white;
  padding:28px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 24px 70px rgba(0,0,0,.22);
}
.product-card-main .app-icon{
  width:96px;
  height:96px;
  border-radius:28px;
  margin-bottom:22px;
}
.product-card-main strong{
  font-size:32px;
  letter-spacing:-.05em;
  line-height:1.05;
}
.product-card-main span{
  margin-top:12px;
  color:rgba(255,255,255,.68);
  font-weight:800;
}
.app-story-grid{
  display:grid;
  grid-template-columns:1.25fr .75fr;
  gap:22px;
  margin:36px 0;
}
.app-story-main,.app-use-panel{
  border-radius:34px;
  background:#fff;
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 22px 60px rgba(15,23,42,.08);
  padding:28px;
}
.app-story-main h2,.screenshot-section h2,.app-bottom-grid h2{
  font-size:clamp(30px,4vw,48px);
  letter-spacing:-.06em;
}
.app-story-main p,.app-use-panel p{
  color:#627087;
  line-height:1.58;
  font-size:17px;
}
.feature-list{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:12px;
  list-style:none;
  padding:0;
  margin:24px 0 0;
}
.feature-list li{
  background:#f6f8fc;
  border:1px solid rgba(15,23,42,.07);
  border-radius:18px;
  padding:14px 15px;
  color:#23304a;
  font-weight:750;
}
.app-use-panel h3{
  font-size:28px;
  letter-spacing:-.05em;
  margin:0 0 18px;
}
.use-tags{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.use-tags span{
  background:linear-gradient(180deg,#fff,#f6f8fc);
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 10px 24px rgba(15,23,42,.05);
  color:#243047;
  padding:10px 13px;
  border-radius:999px;
  font-weight:800;
  font-size:13px;
}
.screenshot-section{
  margin:46px 0;
}
.shot-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}
.shot-card{
  min-height:420px;
  border-radius:34px;
  background:
    radial-gradient(circle at 20% 10%,rgba(69,214,255,.12),transparent 30%),
    linear-gradient(180deg,#fff,#f6f8fc);
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 24px 70px rgba(15,23,42,.08);
  display:grid;
  place-items:center;
  padding:24px;
}
.shot-phone{
  width:min(220px,100%);
  height:360px;
  border-radius:34px;
  background:linear-gradient(160deg,#0c1220,#24314d);
  border:8px solid #111827;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  color:white;
  text-align:center;
  padding:22px;
}
.shot-phone .app-icon{
  width:72px;
  height:72px;
  border-radius:22px;
  margin-bottom:20px;
}
.shot-phone strong{
  font-size:26px;
  letter-spacing:-.05em;
}
.shot-phone span{
  color:rgba(255,255,255,.62);
  margin-top:8px;
}
.app-bottom-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
  margin:46px 0;
}
.app-faq{
  margin-bottom:40px;
}
.bundle-art-v7 span{
  width:190px;
  height:190px;
  border-radius:46px;
  display:grid;
  place-items:center;
  color:white;
  font-weight:950;
  font-size:56px;
  letter-spacing:-.08em;
  background:
    radial-gradient(circle at 28% 22%,rgba(255,220,138,.75),transparent 30%),
    linear-gradient(135deg,#45d6ff,#0b7bd3 50%,#ffc45a);
  box-shadow:0 26px 70px rgba(69,214,255,.22);
}
@media(max-width:900px){
  .app-hero-v7,.bundle-hero-v7,.app-story-grid,.app-bottom-grid{
    grid-template-columns:1fr;
  }
  .shot-grid{
    grid-template-columns:1fr;
  }
  .app-hero-product,.bundle-art-v7{
    min-height:360px;
  }
}
@media(max-width:620px){
  .feature-list{
    grid-template-columns:1fr;
  }
  .app-story-main,.app-use-panel,.support-box{
    padding:22px;
  }
}

/* v9 real links + portfolio breadth */
.portfolio-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:28px 0 34px}
.portfolio-summary div{border-radius:26px;padding:20px;background:#fff;border:1px solid rgba(15,23,42,.08);box-shadow:0 16px 40px rgba(15,23,42,.06)}
.portfolio-summary strong{display:block;font-size:34px;line-height:1;letter-spacing:-.055em}
.portfolio-summary span{display:block;margin-top:6px;color:#657287;font-weight:750}
.catalog-wide-note{grid-column:1 / -1;padding:24px;border-radius:28px;background:radial-gradient(circle at 92% 0%,rgba(69,214,255,.14),transparent 30%),linear-gradient(180deg,#fff,#f6f8fc);border:1px solid rgba(15,23,42,.08)}
.catalog-wide-note h3{font-size:30px;letter-spacing:-.055em;margin:0 0 10px}
.catalog-wide-note p{color:#627087;line-height:1.55;max-width:760px}
.home-catalog-note{margin-top:18px;border-radius:26px;padding:18px 20px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:18px;background:rgba(255,255,255,.78);border:1px solid rgba(15,23,42,.08);box-shadow:0 16px 40px rgba(15,23,42,.06)}
.home-catalog-note strong{letter-spacing:-.025em}.home-catalog-note span{color:#657287;line-height:1.4}
@media(max-width:800px){.portfolio-summary,.home-catalog-note{grid-template-columns:1fr}}


/* v10 brand asset upgrade */
.mark,
.brand-mark{
  display:none;
}

.brand-symbol{
  width:34px;
  height:34px;
  border-radius:11px;
  display:grid;
  place-items:center;
  overflow:hidden;
  background:rgba(255,255,255,.96);
  box-shadow:0 12px 34px rgba(69,214,255,.18);
  flex:0 0 auto;
}

.brand-symbol img{
  width:82%;
  height:82%;
  object-fit:contain;
  display:block;
}

.nav .brand .brand-symbol{
  width:38px;
  height:38px;
  border-radius:13px;
}

.footer .brand-symbol,
.footer-brand .brand-symbol{
  width:34px;
  height:34px;
  border-radius:12px;
}

.brand-studio-panel{
  margin:34px 0;
  border-radius:36px;
  padding:34px;
  display:grid;
  grid-template-columns:.75fr 1.25fr;
  gap:34px;
  align-items:center;
  background:
    radial-gradient(circle at 14% 18%,rgba(69,214,255,.16),transparent 32%),
    radial-gradient(circle at 84% 0%,rgba(255,196,90,.14),transparent 30%),
    linear-gradient(135deg,#05070d,#0b1626);
  color:white;
  box-shadow:0 34px 90px rgba(6,13,27,.22);
  border:1px solid rgba(255,255,255,.10);
}

.brand-studio-panel h2{
  font-size:clamp(34px,4.8vw,58px);
  line-height:1;
  letter-spacing:-.065em;
  margin:12px 0 16px;
}

.brand-studio-panel p{
  color:rgba(255,255,255,.72);
  font-size:18px;
  line-height:1.6;
}

.brand-studio-art{
  min-height:290px;
  border-radius:32px;
  display:grid;
  place-items:center;
  background:
    radial-gradient(circle at 28% 20%,rgba(255,255,255,.20),transparent 28%),
    linear-gradient(155deg,rgba(255,255,255,.13),rgba(255,255,255,.04));
  border:1px solid rgba(255,255,255,.14);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 24px 70px rgba(0,0,0,.20);
}

.brand-studio-art img{
  width:min(220px,68%);
  height:auto;
  filter:drop-shadow(0 20px 38px rgba(0,0,0,.20));
}

@media(max-width:800px){
  .brand-studio-panel{
    grid-template-columns:1fr;
  }
}


/* v11 official App Store badge integration */
.app-store-badge-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:max-content;
  line-height:0;
  border-radius:12px;
  transition:transform .2s ease, filter .2s ease;
}

.app-store-badge-link:hover{
  transform:translateY(-2px);
  filter:brightness(1.06);
}

.app-store-badge{
  display:block;
  height:44px;
  width:auto;
}

.btns .app-store-badge-link{
  align-self:center;
}

.showcase-main .app-store-badge{
  height:46px;
}

.app-hero-v7 .app-store-badge,
.bundle-hero-v7 .app-store-badge{
  height:52px;
}

.bundle-actions{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:14px;
}

.bundle-actions .app-store-badge{
  height:38px;
}

@media(max-width:620px){
  .app-store-badge{
    height:42px;
  }
  .app-hero-v7 .app-store-badge,
  .bundle-hero-v7 .app-store-badge{
    height:48px;
  }
}


/* v12 corrected real app icon pass */
.app-icon.has-image{
  background:transparent;
  box-shadow:none;
  overflow:hidden;
  padding:0;
}

.app-icon.has-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  border-radius:inherit;
  box-shadow:0 12px 30px rgba(8,15,30,.18);
}

.float .app-icon.has-image img{
  box-shadow:0 18px 42px rgba(8,15,30,.22);
}

.app-row .app-icon.has-image img,
.home-mini-app .app-icon.has-image img,
.showcase-small .app-icon.has-image img{
  box-shadow:0 10px 24px rgba(8,15,30,.14);
}

.product-card-main .app-icon.has-image img{
  box-shadow:0 22px 54px rgba(8,15,30,.26);
}


/* v13 real blog / SEO article library */
.article-hero-v13{
  display:grid;
  grid-template-columns:1fr 330px;
  gap:30px;
  align-items:center;
  margin-bottom:44px;
}
.article-hero-v13 h1{
  font-size:clamp(42px,5.5vw,72px);
  line-height:.98;
  letter-spacing:-.07em;
  margin:14px 0 18px;
}
.article-hero-v13 p{
  font-size:20px;
  color:#5f6d82;
  line-height:1.55;
  max-width:780px;
}
.article-meta-row{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:18px;
}
.article-meta-row span{
  border-radius:999px;
  padding:9px 12px;
  background:#fff;
  border:1px solid rgba(15,23,42,.08);
  color:#5f6d82;
  font-weight:800;
  font-size:13px;
}
.article-app-card{
  border-radius:34px;
  padding:24px;
  background:
    radial-gradient(circle at 12% 12%,rgba(69,214,255,.16),transparent 30%),
    linear-gradient(180deg,#fff,#f7f9fd);
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 24px 70px rgba(15,23,42,.09);
}
.article-app-card .app-icon{
  width:82px;
  height:82px;
  border-radius:22px;
  margin-bottom:18px;
}
.article-app-card h2{
  font-size:30px;
  letter-spacing:-.05em;
  margin-bottom:8px;
}
.article-app-card p{
  color:#657287;
  line-height:1.45;
}
.article-content-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) 340px;
  gap:28px;
  align-items:start;
}
.article-body{
  border-radius:34px;
  padding:34px;
  background:#fff;
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 24px 70px rgba(15,23,42,.08);
}
.article-body h2{
  font-size:34px;
  margin:34px 0 12px;
}
.article-body h2:first-child{
  margin-top:0;
}
.article-body p,
.article-body li{
  color:#4f5f77;
  font-size:18px;
  line-height:1.7;
}
.article-body ol,
.article-body ul{
  padding-left:24px;
}
.article-callout{
  margin:34px 0;
  border-radius:28px;
  padding:24px;
  background:
    radial-gradient(circle at 92% 0%,rgba(255,196,90,.18),transparent 30%),
    linear-gradient(135deg,#07101d,#0d1a2d);
  color:white;
}
.article-callout h3{
  font-size:28px;
  letter-spacing:-.04em;
  margin:0 0 8px;
}
.article-callout p{
  color:rgba(255,255,255,.72);
}
.article-sidebar{
  display:grid;
  gap:18px;
  position:sticky;
  top:110px;
}
.article-sidebar .article-row{
  grid-template-columns:1fr;
}
.article-sidebar .article-row em{
  text-align:left;
}
@media(max-width:980px){
  .article-hero-v13,
  .article-content-grid{
    grid-template-columns:1fr;
  }
  .article-sidebar{
    position:static;
  }
}
@media(max-width:620px){
  .article-body{
    padding:24px;
  }
}


/* v14 preserved original SEO article content */
.legacy-article-content h2,
.legacy-article-content h3,
.legacy-article-content h4{
  margin-top:32px;
}

.legacy-article-content p,
.legacy-article-content li{
  color:#4f5f77;
  font-size:18px;
  line-height:1.72;
}

.legacy-article-content a{
  color:#075aa8;
  font-weight:800;
}

.legacy-article-content img{
  max-width:100%;
  height:auto;
  border-radius:22px;
  margin:18px 0;
}

.legacy-article-content table{
  width:100%;
  border-collapse:collapse;
  margin:22px 0;
}

.legacy-article-content th,
.legacy-article-content td{
  border:1px solid rgba(15,23,42,.12);
  padding:12px;
  text-align:left;
}

.legacy-article-content blockquote{
  margin:24px 0;
  padding:18px 22px;
  border-left:4px solid #45d6ff;
  background:#f6f8fc;
  border-radius:18px;
  color:#4f5f77;
}


/* v15 launch-readiness cleanup */
.disabled-button{
  cursor:not-allowed;
  opacity:.72;
  user-select:none;
}

a:focus-visible,
button:focus-visible,
summary:focus-visible{
  outline:3px solid rgba(69,214,255,.55);
  outline-offset:4px;
}

.article-body .faq details,
.app-faq details{
  scroll-margin-top:110px;
}


/* v16 mobile/iPhone polish pass */
html{scroll-behavior:smooth}
body{overflow-x:hidden}
img{max-width:100%}
#panel{max-height:calc(100vh - 112px);overflow:auto}

@media(max-width:900px){
  body{background:linear-gradient(180deg,#05070d 0,#08111f 12%,#f7f9fd 32%,#fff)}
  .nav{top:10px;height:58px;border-radius:20px;padding:0 14px}
  .nav .brand{min-width:0}
  .nav .brand span:last-child{font-size:17px}
  .hero{padding:118px 20px 74px;min-height:auto}
  .hero-inner{gap:28px}
  .hero p,.page-hero p{font-size:18px}
  .btns{gap:12px;margin-top:24px}
  .button{padding:13px 16px;border-radius:15px}
  .section{padding:64px 20px}
  .page{padding:118px 20px 70px}
  .page-inner,.inner,.page-inner.wide{width:100%}
  .head{align-items:start;margin-bottom:24px}
  .intro{font-size:17px}
}

@media(max-width:760px){
  h1{font-size:clamp(42px,13vw,64px);letter-spacing:-.07em}
  h2{font-size:clamp(32px,10vw,46px)}
  .eyebrow{font-size:13px;max-width:100%}

  .visual{display:block;height:auto;min-height:0}
  .float{position:relative;width:100%;min-height:0;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;margin:12px 0;animation:none;display:grid;grid-template-columns:auto 1fr;column-gap:14px;align-items:center;padding:15px;border-radius:22px}
  .float h3{margin:0 0 4px;font-size:18px}
  .float p{grid-column:2;font-size:12px}
  .float .app-icon{grid-row:1 / span 2;width:52px;height:52px;border-radius:15px}

  .home-showcase-section{padding-top:62px}
  .home-showcase{gap:16px}
  .showcase-main{min-height:auto;border-radius:30px;padding:24px;gap:22px}
  .showcase-main h3{font-size:clamp(38px,11vw,52px)}
  .showcase-main p{font-size:17px}
  .showcase-device{min-height:250px;border-radius:28px}
  .showcase-device .app-icon{width:82px;height:82px;border-radius:24px}
  .showcase-device strong{font-size:24px}
  .showcase-small{min-height:0;border-radius:24px;padding:17px}
  .showcase-small h3{font-size:21px}

  .home-mini-list{grid-template-columns:1fr;gap:10px}
  .home-mini-app{grid-template-columns:auto 1fr auto}
  .home-mini-app em{grid-column:auto;justify-self:end;font-size:11px}
  .home-catalog-note{align-items:start}
  .bundle-chip-row,.home-category-grid,.portfolio-summary{grid-template-columns:1fr}
  .bundle-chip{min-height:104px;border-radius:24px}

  .home-guide-editorial{gap:18px}
  .home-guide-feature,.home-guide-list,.studio,.brand-studio-panel{border-radius:30px;padding:24px}
  .guide-line{padding:14px 0}
  .guide-line strong{font-size:16px}
  .studio{gap:22px}
  .trust span{padding:13px 14px}

  footer{width:calc(100% - 40px);grid-template-columns:1fr;gap:22px;padding:44px 0 58px}
  footer a:not(.brand){margin:8px 0}
}

@media(max-width:620px){
  #panel{left:10px;right:10px;top:76px;width:auto;border-radius:20px}
  .nav{width:calc(100% - 20px)}
  .nav .brand-symbol{width:36px;height:36px}
  .actions{gap:8px}
  #menu{width:38px;height:38px}

  .hero{padding-left:18px;padding-right:18px}
  .hero p{font-size:17px}
  .btns{flex-direction:column;align-items:stretch}
  .btns .button,.btns .app-store-badge-link{width:100%;justify-content:center}

  .app-store-badge{height:42px}
  .showcase-main .app-store-badge,.app-hero-v7 .app-store-badge,.bundle-hero-v7 .app-store-badge{height:44px}
  .app-store-badge-link{max-width:100%}

  .app-hero-v7,.bundle-hero-v7{gap:24px;margin-bottom:32px}
  .app-hero-copy h1,.bundle-hero-v7 h1,.article-hero-v13 h1{font-size:clamp(38px,12vw,58px);line-height:.98}
  .app-hero-copy p,.bundle-hero-v7 p,.article-hero-v13 p{font-size:18px}
  .app-hero-product,.bundle-art-v7{min-height:300px;border-radius:32px}

  .product-card-main{min-height:260px;width:min(270px,88%);border-radius:30px}
  .product-card-main .app-icon{width:88px;height:88px}
  .product-card-main strong{font-size:28px}

  .app-story-grid,.app-bottom-grid,.support-columns,.article-content-grid{gap:16px}
  .app-story-main,.app-use-panel,.support-box,.article-body,.article-app-card{border-radius:26px;padding:22px}
  .feature-list{grid-template-columns:1fr}
  .feature-list li{border-radius:16px}

  .shot-card{min-height:330px;border-radius:28px}
  .shot-phone{height:290px;border-radius:30px}

  .article-hero-v13{gap:18px}
  .article-meta-row span{width:100%}
  .article-body h2{font-size:30px;margin-top:28px}
  .article-body p,.article-body li,.legacy-article-content p,.legacy-article-content li{font-size:17px;line-height:1.68}
  .article-sidebar{gap:14px}
  .article-sidebar .compact-list{gap:10px}
  .article-row{grid-template-columns:1fr;gap:6px;padding:14px}
  .article-row em{text-align:left}

  .catalog-head{display:block;padding:22px}
  .catalog-head h2{font-size:28px}
  .catalog-grid{padding:14px}
  .app-row{grid-template-columns:auto 1fr;padding:13px}
  .app-row em{grid-column:2;justify-self:start;margin-top:2px}
  .app-row .app-icon{width:48px;height:48px;border-radius:15px}
  .category-pills,.topic-strip{gap:8px}
  .category-pills a,.topic-pill{font-size:12px;padding:9px 11px}

  .support-hero-panel{border-radius:30px;padding:24px}
  .support-hero-panel h1{font-size:clamp(40px,12vw,58px)}
  .support-line{display:block;padding:14px 0}
  .support-line span{display:block;margin-top:4px}
}

@media(max-width:420px){
  .hero{padding-top:104px}
  h1{font-size:40px}
  .hero p,.page-hero p,.intro{font-size:16px}
  .float{padding:13px}
  .float .app-icon{width:48px;height:48px}
  .showcase-main,.home-guide-feature,.home-guide-list,.studio,.brand-studio-panel{padding:20px}
  .showcase-device{min-height:230px}
  .bundle-chip strong{font-size:19px}
  .article-body p,.article-body li,.legacy-article-content p,.legacy-article-content li{font-size:16px}
  footer{width:calc(100% - 32px)}
}


/* v16.1 iPhone homepage correction pass */
@media(max-width:760px){
  html,body{
    width:100%;
    max-width:100%;
    overflow-x:hidden;
  }

  body{
    background:#f7f9fd;
  }

  .hero{
    width:100%;
    box-sizing:border-box;
    overflow:hidden;
    padding:112px 18px 46px;
    background:
      radial-gradient(circle at 8% 12%,rgba(69,214,255,.22),transparent 28%),
      radial-gradient(circle at 90% 8%,rgba(255,196,90,.12),transparent 26%),
      linear-gradient(180deg,#05070d 0%,#08111f 100%);
  }

  .hero-inner{
    display:block;
    width:100%;
  }

  .hero h1{
    font-size:clamp(42px,12vw,58px);
    line-height:1.02;
    letter-spacing:-.075em;
    max-width:100%;
    margin-top:34px;
  }

  .hero p{
    font-size:17px;
    line-height:1.58;
    max-width:100%;
  }

  .hero .btns{
    margin-bottom:30px;
  }

  .hero .visual{
    margin-top:8px;
    display:grid;
    grid-template-columns:1fr;
    gap:12px;
  }

  .hero .float{
    transform:none!important;
    margin:0;
    width:100%;
    box-sizing:border-box;
    min-height:96px;
    border-radius:24px;
    background:
      linear-gradient(145deg,rgba(255,255,255,.13),rgba(255,255,255,.055));
    border:1px solid rgba(255,255,255,.16);
    box-shadow:0 18px 48px rgba(0,0,0,.22);
    backdrop-filter:blur(18px);
  }

  .hero .float:nth-child(n+4){
    display:none;
  }

  .hero .float p{
    max-height:38px;
    overflow:hidden;
    opacity:.72;
  }

  .hero .float .app-icon{
    width:58px;
    height:58px;
    border-radius:18px;
  }

  .home-showcase-section{
    padding:56px 18px;
    background:#f7f9fd;
  }

  .section{
    width:100%;
    box-sizing:border-box;
    overflow:hidden;
  }

  .section.dark,
  .home-bundles{
    width:100%;
    box-sizing:border-box;
    border-radius:0;
    padding-left:18px;
    padding-right:18px;
  }

  .home-bundles .inner,
  .home-showcase-section .inner,
  .section .inner{
    width:100%;
    max-width:100%;
  }

  .home-bundles{
    background:#050b16;
  }

  .home-bundles h2,
  .home-bundles p{
    max-width:100%;
  }

  .bundle-chip-row{
    gap:12px;
  }

  .bundle-chip{
    min-height:88px;
    padding:20px;
  }

  .bundle-chip strong{
    font-size:20px;
  }

  .home-category-section,
  .home-guides-section,
  .studio-section{
    background:#f7f9fd;
  }

  .section-title,
  .section-title.muted,
  .section-title.faded,
  .ghost-title,
  .muted-title,
  .big-fade,
  .home-showcase-section h2,
  .home-category-section h2,
  .home-guides-section h2{
    color:#0b1220!important;
    opacity:1!important;
    background:none!important;
    -webkit-text-fill-color:#0b1220!important;
    text-shadow:none!important;
  }

  .home-showcase-section .head h2,
  .home-showcase-section h2{
    font-size:clamp(34px,10vw,48px);
    line-height:1.02;
  }

  .showcase-main{
    width:100%;
    box-sizing:border-box;
    grid-template-columns:1fr;
  }

  .showcase-main,
  .showcase-small,
  .home-mini-app,
  .home-catalog-note{
    max-width:100%;
  }

  .showcase-device{
    display:none;
  }

  .showcase-main .btns{
    margin-top:20px;
  }

  .showcase-small{
    display:grid;
    grid-template-columns:auto 1fr;
    gap:14px;
    align-items:center;
  }

  .showcase-small p{
    grid-column:2;
  }

  .showcase-small .app-icon{
    grid-row:1 / span 3;
    width:58px;
    height:58px;
    border-radius:18px;
  }

  .home-mini-list{
    gap:12px;
  }

  .home-catalog-note{
    border-radius:24px;
    padding:18px;
  }

  .home-catalog-note a{
    margin-top:4px;
  }
}

@media(max-width:620px){
  .nav{
    left:16px;
    right:16px;
    width:auto;
    max-width:calc(100% - 32px);
    box-sizing:border-box;
  }

  #panel{
    left:16px;
    right:16px;
    width:auto;
    box-sizing:border-box;
  }

  .hero h1{
    font-size:clamp(40px,12.2vw,54px);
  }

  .hero .btns .button{
    min-height:56px;
  }

  .showcase-main h3{
    font-size:clamp(36px,10vw,48px);
  }

  .home-bundles h2{
    font-size:clamp(38px,11vw,52px);
  }

  .home-category-grid{
    gap:12px;
  }

  .category-card,
  .home-category-card{
    border-radius:24px;
  }
}

@media(max-width:420px){
  .hero{
    padding-left:16px;
    padding-right:16px;
  }

  .section,
  .home-showcase-section,
  .section.dark,
  .home-bundles{
    padding-left:16px;
    padding-right:16px;
  }

  .hero h1{
    font-size:40px;
  }

  .hero .float{
    min-height:90px;
    border-radius:22px;
  }

  .hero .float:nth-child(n+4){
    display:none;
  }

  .showcase-main{
    padding:20px;
  }
}


/* v16.2 iPhone nav + spacing correction */
@media(max-width:760px){
  /* Fix glass nav clipping/sideways shift on iPhone */
  .nav{
    position:sticky!important;
    top:12px!important;
    left:auto!important;
    right:auto!important;
    transform:none!important;
    width:calc(100% - 32px)!important;
    max-width:calc(100% - 32px)!important;
    margin:12px auto 0!important;
    box-sizing:border-box!important;
    z-index:1000!important;
  }

  .nav .brand{
    flex:1 1 auto;
  }

  .nav nav{
    display:none!important;
  }

  .actions{
    flex:0 0 auto;
  }

  #panel{
    position:fixed!important;
    top:82px!important;
    left:16px!important;
    right:16px!important;
    width:auto!important;
    max-width:calc(100% - 32px)!important;
    transform:none!important;
    box-sizing:border-box!important;
    z-index:1001!important;
  }

  /* Pull the hero back up now that nav is sticky, not floating over everything */
  .hero{
    margin-top:-82px;
    padding-top:130px;
    padding-bottom:34px;
  }

  .hero h1{
    margin-top:22px;
  }

  .hero .btns{
    margin-bottom:22px;
  }

  .hero .visual{
    gap:10px;
  }

  .hero .float{
    min-height:82px;
    padding:13px 14px;
  }

  .hero .float .app-icon{
    width:52px;
    height:52px;
  }

  .hero .float h3{
    font-size:18px;
  }

  .hero .float p{
    font-size:12px;
    line-height:1.35;
    max-height:34px;
  }

  /* Tighter homepage flow */
  .section,
  .home-showcase-section{
    padding-top:44px;
    padding-bottom:44px;
  }

  .home-showcase-section .head{
    margin-bottom:18px;
  }

  .home-showcase-section .head h2{
    margin-bottom:10px;
  }

  /* Restore a compact Export Calendar visual instead of hiding it */
  .showcase-device{
    display:grid!important;
    min-height:180px!important;
    border-radius:26px!important;
    margin-top:12px;
  }

  .showcase-device .app-icon{
    width:76px!important;
    height:76px!important;
    border-radius:22px!important;
  }

  .showcase-device strong{
    font-size:22px!important;
  }

  .showcase-device p{
    font-size:14px!important;
    line-height:1.35!important;
  }

  .showcase-main{
    padding:22px!important;
    gap:14px!important;
  }

  .showcase-main h3{
    margin-bottom:12px;
  }

  .showcase-main p{
    margin-bottom:14px;
  }

  .showcase-main .btns{
    margin-top:12px;
    gap:12px;
  }

  .showcase-small{
    padding:15px!important;
    border-radius:22px!important;
  }

  .home-mini-app{
    padding:14px!important;
    border-radius:22px!important;
  }

  .home-catalog-note{
    margin-top:12px!important;
  }

  .home-bundles{
    padding-top:48px!important;
    padding-bottom:48px!important;
  }

  .bundle-chip-row{
    margin-top:22px!important;
  }

  .home-category-section,
  .home-guides-section,
  .studio-section{
    padding-top:44px!important;
    padding-bottom:44px!important;
  }

  footer{
    margin-top:16px!important;
    padding-top:34px!important;
  }
}

@media(max-width:620px){
  .nav{
    width:calc(100% - 28px)!important;
    max-width:calc(100% - 28px)!important;
    margin-top:10px!important;
    border-radius:22px!important;
  }

  #panel{
    left:14px!important;
    right:14px!important;
    max-width:calc(100% - 28px)!important;
  }

  .hero{
    margin-top:-80px;
    padding-top:126px;
  }

  .hero h1{
    font-size:clamp(40px,11.5vw,52px);
  }

  .showcase-main .btns .button,
  .showcase-main .btns .app-store-badge-link{
    width:100%;
  }

  .showcase-device{
    min-height:165px!important;
  }
}

@media(max-width:420px){
  .nav{
    width:calc(100% - 24px)!important;
    max-width:calc(100% - 24px)!important;
  }

  #panel{
    left:12px!important;
    right:12px!important;
    max-width:calc(100% - 24px)!important;
  }

  .hero{
    margin-top:-78px;
    padding-top:122px;
    padding-bottom:30px;
  }

  .hero h1{
    font-size:39px;
  }

  .hero .float{
    min-height:78px;
  }

  .section,
  .home-showcase-section,
  .home-category-section,
  .home-guides-section,
  .studio-section{
    padding-top:38px!important;
    padding-bottom:38px!important;
  }

  .showcase-device{
    min-height:150px!important;
  }
}


/* v16.3 persistent mobile nav + hero badge + tighter footer */
@media(max-width:760px){
  /* Persistent mobile navigation */
  .nav{
    position:fixed!important;
    top:12px!important;
    left:50%!important;
    right:auto!important;
    transform:translateX(-50%)!important;
    width:calc(100% - 32px)!important;
    max-width:calc(100% - 32px)!important;
    margin:0!important;
    z-index:5000!important;
    -webkit-backdrop-filter:blur(22px);
    backdrop-filter:blur(22px);
  }

  #panel{
    position:fixed!important;
    top:82px!important;
    left:50%!important;
    right:auto!important;
    transform:translateX(-50%)!important;
    width:calc(100% - 32px)!important;
    max-width:calc(100% - 32px)!important;
    z-index:5001!important;
  }

  .hero{
    margin-top:0!important;
    padding-top:112px!important;
  }

  .page{
    padding-top:112px!important;
  }

  /* App Store badge in homepage hero */
  .hero-store-badge{
    margin:14px 0 22px;
    display:flex;
    align-items:center;
    justify-content:flex-start;
  }

  .hero-store-badge .app-store-badge{
    height:42px;
  }

  .hero-store-badge .app-store-badge-link{
    opacity:.96;
  }

  .hero .btns{
    margin-bottom:0!important;
  }

  /* Tighten mobile footer */
  footer{
    width:calc(100% - 32px)!important;
    margin:0 auto!important;
    padding:28px 0 calc(38px + env(safe-area-inset-bottom))!important;
    gap:18px!important;
    border-top:1px solid rgba(15,23,42,.08);
  }

  footer p{
    margin:10px 0 0!important;
    font-size:16px!important;
    line-height:1.35!important;
  }

  footer h4{
    margin:0 0 8px!important;
    font-size:16px!important;
  }

  footer a:not(.brand){
    margin:5px 0!important;
    font-size:16px!important;
  }

  footer > div{
    min-width:0;
  }

  .footer-brand{
    margin-bottom:0!important;
  }

  /* reduce excess airy gaps before footer */
  .studio-section,
  .home-guides-section,
  .home-category-section{
    padding-bottom:34px!important;
  }
}

@media(max-width:620px){
  .nav{
    top:10px!important;
    width:calc(100% - 28px)!important;
    max-width:calc(100% - 28px)!important;
  }

  #panel{
    top:78px!important;
    width:calc(100% - 28px)!important;
    max-width:calc(100% - 28px)!important;
  }

  .hero{
    padding-top:106px!important;
  }

  .page{
    padding-top:106px!important;
  }

  .hero-store-badge{
    justify-content:center;
  }
}

@media(max-width:420px){
  .nav{
    width:calc(100% - 24px)!important;
    max-width:calc(100% - 24px)!important;
  }

  #panel{
    width:calc(100% - 24px)!important;
    max-width:calc(100% - 24px)!important;
  }

  .hero-store-badge .app-store-badge{
    height:40px;
  }

  footer{
    width:calc(100% - 28px)!important;
    padding-top:24px!important;
  }
}


/* v16.4 desktop hero badge cleanup */
@media(min-width:761px){
  .hero-store-badge{
    display:none!important;
  }
}

@media(max-width:760px){
  .hero-store-badge{
    display:flex!important;
  }
}


/* v17 screenshot integration + product-page maturity */
.hero-shot-preview{
  position:absolute;
  right:24px;
  bottom:18px;
  width:min(220px,42%);
  z-index:1;
  transform:rotate(10deg);
  filter:drop-shadow(0 24px 48px rgba(6,12,24,.28));
}

.hero-shot-preview img{
  width:100%;
  height:auto;
  display:block;
  border-radius:26px;
  border:1px solid rgba(255,255,255,.46);
  box-shadow:0 24px 60px rgba(7,17,33,.24);
}

.product-card-main{
  position:relative;
  z-index:2;
}

.real-shot-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:22px;
}

.real-shot{
  padding:18px;
  border-radius:30px;
  background:
    radial-gradient(circle at 90% 0%,rgba(69,214,255,.08),transparent 28%),
    linear-gradient(180deg,#fff,#f8faff);
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 18px 54px rgba(15,23,42,.08);
}

.real-shot .shot-frame{
  display:flex;
  align-items:center;
  justify-content:center;
  padding:16px;
  border-radius:26px;
  min-height:520px;
  background:
    linear-gradient(180deg,#eef3fb,#f8fbff);
  border:1px solid rgba(15,23,42,.06);
  overflow:hidden;
}

.real-shot .shot-frame img{
  width:min(320px,100%);
  height:auto;
  display:block;
  border-radius:28px;
  box-shadow:0 18px 36px rgba(8,15,30,.18);
}

.real-shot .shot-meta{
  padding:16px 6px 6px;
}

.real-shot .shot-meta strong{
  display:block;
  font-size:20px;
  letter-spacing:-.03em;
  margin-bottom:8px;
}

.real-shot .shot-meta p{
  margin:0;
  color:#607086;
  line-height:1.5;
}

@media(max-width:1080px){
  .hero-shot-preview{
    width:min(190px,40%);
    right:14px;
    bottom:10px;
  }
  .real-shot .shot-frame{
    min-height:460px;
  }
}

@media(max-width:760px){
  .hero-shot-preview{
    position:relative;
    right:auto;
    bottom:auto;
    width:min(210px,72%);
    margin:0 auto 8px;
    transform:rotate(8deg);
  }

  .real-shot-grid{
    grid-template-columns:1fr;
    gap:16px;
  }

  .real-shot{
    padding:14px;
    border-radius:24px;
  }

  .real-shot .shot-frame{
    min-height:370px;
    padding:12px;
    border-radius:22px;
  }

  .real-shot .shot-frame img{
    width:min(270px,100%);
    border-radius:24px;
  }

  .real-shot .shot-meta{
    padding:14px 2px 2px;
  }

  .real-shot .shot-meta strong{
    font-size:18px;
    margin-bottom:6px;
  }

  .real-shot .shot-meta p{
    font-size:15px;
  }
}

@media(max-width:420px){
  .real-shot .shot-frame{
    min-height:330px;
  }
  .hero-shot-preview{
    width:min(190px,68%);
  }
}


/* v17.1 desktop screenshot polish */
@media(min-width:761px){
  .app-page .app-story-grid{
    margin-bottom:44px;
  }

  .app-page .screenshot-section{
    margin:58px 0 52px;
    padding-top:10px;
    scroll-margin-top:108px;
  }

  .app-page .screenshot-section .head{
    margin-bottom:26px;
  }

  .app-page .screenshot-section .intro{
    max-width:760px;
  }

  .app-page .real-shot-grid{
    gap:20px;
    align-items:start;
  }

  .app-page .real-shot{
    padding:16px;
    border-radius:28px;
    box-shadow:0 16px 46px rgba(15,23,42,.07);
  }

  .app-page .real-shot .shot-frame{
    min-height:470px;
    padding:18px 14px;
    border-radius:24px;
  }

  .app-page .real-shot .shot-frame img{
    width:min(285px,88%);
    border-radius:24px;
    box-shadow:0 14px 30px rgba(8,15,30,.15);
  }

  .app-page .real-shot .shot-meta{
    padding:14px 4px 4px;
  }

  .app-page .real-shot .shot-meta strong{
    font-size:19px;
    margin-bottom:7px;
  }

  .app-page .real-shot .shot-meta p{
    font-size:16px;
    line-height:1.45;
    max-width:40ch;
  }
}

@media(min-width:1081px){
  .app-page .real-shot .shot-frame{
    min-height:450px;
  }

  .app-page .real-shot .shot-frame img{
    width:min(272px,84%);
  }
}


/* v17.2 lightweight screenshot lightbox */
.shot-frame.is-clickable{
  cursor:zoom-in;
  position:relative;
}

.shot-frame.is-clickable::after{
  content:"View larger";
  position:absolute;
  right:14px;
  bottom:14px;
  border-radius:999px;
  padding:8px 11px;
  background:rgba(5,10,20,.68);
  color:white;
  font-size:12px;
  font-weight:850;
  letter-spacing:-.01em;
  opacity:0;
  transform:translateY(4px);
  transition:opacity .2s ease, transform .2s ease;
  backdrop-filter:blur(16px);
}

.shot-frame.is-clickable:hover::after,
.shot-frame.is-clickable:focus-within::after{
  opacity:1;
  transform:translateY(0);
}

.real-shot .shot-frame img[data-lightbox-src]{
  cursor:zoom-in;
}

.real-shot .shot-frame img[data-lightbox-src]:focus-visible{
  outline:3px solid rgba(69,214,255,.62);
  outline-offset:5px;
}

.screenshot-lightbox{
  position:fixed;
  inset:0;
  z-index:9000;
  display:grid;
  place-items:center;
  padding:34px;
  background:
    radial-gradient(circle at 20% 10%,rgba(69,214,255,.16),transparent 26%),
    radial-gradient(circle at 88% 8%,rgba(255,196,90,.10),transparent 26%),
    rgba(3,6,12,.84);
  backdrop-filter:blur(18px);
}

.screenshot-lightbox[hidden]{
  display:none;
}

.lightbox-inner{
  width:min(520px,92vw);
  max-height:88vh;
  display:grid;
  place-items:center;
}

.lightbox-inner img{
  display:block;
  width:auto;
  max-width:100%;
  max-height:88vh;
  border-radius:34px;
  box-shadow:0 34px 100px rgba(0,0,0,.48);
  border:1px solid rgba(255,255,255,.28);
  background:#101827;
}

.lightbox-close{
  position:fixed;
  top:22px;
  right:22px;
  width:44px;
  height:44px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.20);
  background:rgba(255,255,255,.11);
  color:white;
  font-size:30px;
  line-height:1;
  display:grid;
  place-items:center;
  cursor:pointer;
  backdrop-filter:blur(18px);
  z-index:9001;
}

.lightbox-close:hover{
  background:rgba(255,255,255,.18);
}

@media(max-width:760px){
  .shot-frame.is-clickable::after{
    opacity:1;
    transform:none;
    font-size:11px;
    right:10px;
    bottom:10px;
    padding:7px 10px;
  }

  .screenshot-lightbox{
    padding:18px;
  }

  .lightbox-inner{
    width:94vw;
    max-height:84vh;
  }

  .lightbox-inner img{
    max-height:84vh;
    border-radius:28px;
  }

  .lightbox-close{
    top:calc(14px + env(safe-area-inset-top));
    right:14px;
    width:42px;
    height:42px;
    border-radius:15px;
  }
}


/* v17.3 mobile screenshot polish */
@media(max-width:760px){
  /* Mobile does not need a persistent View larger chip; the image remains tappable. */
  .shot-frame.is-clickable::after{
    display:none!important;
  }

  /* The tilted screenshot preview works on desktop, but crowds the mobile app hero. */
  .app-page .hero-shot-preview{
    display:none!important;
  }

  .app-page .app-hero-product{
    min-height:300px!important;
    padding:22px!important;
  }

  .app-page .product-card-main{
    width:min(285px,88%)!important;
    min-height:255px!important;
  }

  .app-page .product-card-main .app-icon{
    width:86px!important;
    height:86px!important;
    margin-bottom:18px!important;
  }

  .app-page .product-card-main strong{
    font-size:28px!important;
  }

  .app-page .screenshot-section{
    margin-top:34px!important;
  }

  .app-page .real-shot{
    box-shadow:0 14px 42px rgba(15,23,42,.07);
  }

  .app-page .real-shot .shot-frame{
    min-height:350px;
  }
}

@media(max-width:420px){
  .app-page .app-hero-product{
    min-height:280px!important;
  }

  .app-page .product-card-main{
    min-height:235px!important;
  }

  .app-page .real-shot .shot-frame{
    min-height:320px;
  }
}


/* v18 app-page conversion + internal linking polish */
.conversion-grid{
  grid-template-columns:repeat(3,minmax(0,1fr));
}

.conversion-card,
.related-card{
  border-radius:28px;
  padding:24px;
  background:
    radial-gradient(circle at 92% 0%,rgba(69,214,255,.10),transparent 30%),
    linear-gradient(180deg,#fff,#f7f9fd);
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 18px 54px rgba(15,23,42,.07);
}

.conversion-card h3,
.related-card h3{
  font-size:24px;
  letter-spacing:-.045em;
  margin:0 0 10px;
}

.conversion-card p,
.related-card p{
  color:#627087;
  line-height:1.5;
  margin:0 0 16px;
}

.related-ecosystem{
  margin:46px 0;
  scroll-margin-top:112px;
}

.related-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
}

.related-card{
  background:
    radial-gradient(circle at 12% 10%,rgba(255,196,90,.10),transparent 30%),
    linear-gradient(180deg,#fff,#f8faff);
}

@media(max-width:900px){
  .conversion-grid,
  .related-grid{
    grid-template-columns:1fr;
  }

  .conversion-card,
  .related-card{
    border-radius:24px;
    padding:20px;
  }

  .conversion-card h3,
  .related-card h3{
    font-size:22px;
  }

  .related-ecosystem{
    margin:34px 0;
  }
}


/* v19 bundle visuals + bundle page maturity */
.bundle-hero-v19{
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(380px,.95fr);
  gap:44px;
  align-items:center;
  margin-bottom:58px;
}

.bundle-hero-copy h1{
  font-size:clamp(52px,6vw,86px);
  line-height:.95;
  letter-spacing:-.075em;
  max-width:900px;
  margin:24px 0;
}

.bundle-hero-copy p{
  max-width:760px;
  color:#607086;
  font-size:21px;
  line-height:1.55;
}

.bundle-visual-real{
  position:relative;
  min-height:430px;
  border-radius:40px;
  display:grid;
  place-items:center;
  overflow:hidden;
  background:
    radial-gradient(circle at 25% 20%,rgba(69,214,255,.32),transparent 35%),
    radial-gradient(circle at 78% 15%,rgba(255,196,90,.20),transparent 32%),
    linear-gradient(145deg,#07111f,#182334 48%,#07111f);
  border:1px solid rgba(255,255,255,.18);
  box-shadow:0 28px 80px rgba(15,23,42,.18);
}

.bundle-icon-cluster{
  width:min(300px,72%);
  aspect-ratio:1;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:20px;
  padding:34px;
  border-radius:44px;
  background:linear-gradient(145deg,rgba(255,255,255,.16),rgba(255,255,255,.06));
  border:1px solid rgba(255,255,255,.18);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 24px 70px rgba(0,0,0,.22);
  backdrop-filter:blur(22px);
}

.cluster-icon{
  display:grid;
  place-items:center;
  border-radius:26px;
  background:rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.14);
  transition:transform .18s ease, background .18s ease;
}

.cluster-icon:hover{
  transform:translateY(-3px);
  background:rgba(255,255,255,.20);
}

.cluster-icon img{
  width:74%;
  height:74%;
  object-fit:cover;
  border-radius:22px;
}

.bundle-cluster-label{
  position:absolute;
  left:26px;
  bottom:24px;
  right:26px;
  color:rgba(255,255,255,.74);
  font-weight:900;
  letter-spacing:-.03em;
  font-size:22px;
}

.bundle-included-v19,
.bundle-use-v19{
  margin:48px 0;
}

.bundle-app-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
}

.bundle-app-tile{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:18px;
  align-items:center;
  padding:20px;
  border-radius:28px;
  background:#fff;
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 18px 54px rgba(15,23,42,.07);
  text-decoration:none;
  color:#0b1220;
}

.bundle-app-icon{
  width:70px;
  height:70px;
  border-radius:21px;
  display:block;
  overflow:hidden;
  background:#f2f6fb;
}

.bundle-app-icon img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.bundle-app-tile strong{
  display:block;
  font-size:22px;
  letter-spacing:-.04em;
}

.bundle-app-tile em{
  display:block;
  margin-top:6px;
  color:#607086;
  font-style:normal;
  line-height:1.45;
}

.bundle-index-hero-v19{
  margin-bottom:36px;
}

.bundle-index-grid-v19{
  display:grid;
  gap:24px;
  margin:36px 0 62px;
}

.bundle-index-card-v19{
  display:grid;
  grid-template-columns:360px minmax(0,1fr);
  gap:28px;
  align-items:center;
  padding:22px;
  border-radius:36px;
  background:#fff;
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 24px 70px rgba(15,23,42,.08);
}

.bundle-index-card-v19 .bundle-visual-real{
  min-height:300px;
  border-radius:30px;
}

.bundle-index-card-v19 .bundle-icon-cluster{
  width:210px;
  gap:14px;
  padding:24px;
  border-radius:34px;
}

.bundle-index-card-v19 .bundle-cluster-label{
  font-size:16px;
  bottom:18px;
  left:20px;
  right:20px;
}

.bundle-index-card-body h2{
  font-size:42px;
  letter-spacing:-.06em;
  margin:12px 0;
}

.bundle-index-card-body p{
  color:#607086;
  max-width:760px;
  font-size:18px;
  line-height:1.55;
}

.mini-app-row{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:20px 0;
}

.mini-app-row span{
  display:flex;
  align-items:center;
  gap:8px;
  padding:8px 11px;
  border-radius:999px;
  background:#f4f7fb;
  color:#44536a;
  font-weight:800;
  font-size:13px;
}

.mini-app-row img{
  width:22px;
  height:22px;
  border-radius:7px;
}

.bundle-use-tags{
  margin-top:18px;
}

@media(max-width:900px){
  .bundle-hero-v19{
    grid-template-columns:1fr;
    gap:28px;
  }

  .bundle-hero-copy h1{
    font-size:clamp(42px,12vw,66px);
  }

  .bundle-hero-copy p{
    font-size:18px;
  }

  .bundle-visual-real{
    min-height:320px;
    border-radius:30px;
  }

  .bundle-icon-cluster{
    width:min(240px,72%);
    gap:14px;
    padding:24px;
    border-radius:34px;
  }

  .bundle-app-grid{
    grid-template-columns:1fr;
  }

  .bundle-index-card-v19{
    grid-template-columns:1fr;
    padding:18px;
    border-radius:30px;
  }

  .bundle-index-card-v19 .bundle-visual-real{
    min-height:260px;
  }

  .bundle-index-card-body h2{
    font-size:34px;
  }
}

@media(max-width:420px){
  .bundle-app-tile{
    padding:16px;
    border-radius:24px;
    gap:14px;
  }

  .bundle-app-icon{
    width:58px;
    height:58px;
    border-radius:18px;
  }

  .bundle-app-tile strong{
    font-size:19px;
  }

  .bundle-app-tile em{
    font-size:14px;
  }
}


/* v19.1 bundle broken-link cleanup */
.bundle-app-tile[href^="https://apps.apple.com"] .bundle-app-icon img[src*="opsoh-symbol"],
.cluster-icon[href^="https://apps.apple.com"] img[src*="opsoh-symbol"],
.mini-app-row img[src*="opsoh-symbol"]{
  background:linear-gradient(135deg,#f6fbff,#eef4fb);
  padding:8px;
  box-sizing:border-box;
}


/* v19.2 homepage bundle visuals + real bundle app icons */
.bundle-chip-visual{
  padding:16px;
  gap:14px;
}
.bundle-chip-media{
  width:100%;
  border-radius:22px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 18px 48px rgba(0,0,0,.22);
  background:rgba(255,255,255,.05);
}
.bundle-chip-media img{
  width:100%;
  display:block;
  aspect-ratio: 3 / 2;
  object-fit:cover;
}
.bundle-chip-copy{
  display:flex;
  flex-direction:column;
  gap:6px;
}
.bundle-chip-visual strong{
  font-size:20px;
}
.bundle-chip-visual span{
  font-size:13px;
}
@media (max-width: 960px){
  .bundle-chip-media img{
    aspect-ratio: 16 / 10;
  }
}


/* v19.4 accurate bundle composition + restored icon alignment */
.bundle-icon-cluster-dynamic{grid-template-columns:repeat(4,1fr);width:min(520px,84%);gap:14px;padding:28px;}
.bundle-count-4 .bundle-icon-cluster-dynamic{grid-template-columns:repeat(2,1fr);width:min(300px,72%);gap:20px;padding:34px;}
.bundle-count-5 .bundle-icon-cluster-dynamic{grid-template-columns:repeat(3,1fr);width:min(430px,82%);}
.bundle-icon-cluster-dynamic .cluster-icon{aspect-ratio:1;}
.bundle-icon-cluster-dynamic .cluster-icon img{width:78%;height:78%;object-fit:contain;border-radius:22px;}
.bundle-count-7 .bundle-icon-cluster-dynamic .cluster-icon img{border-radius:18px;}
.bundle-app-grid-count-5,.bundle-app-grid-count-7{grid-template-columns:repeat(2,minmax(0,1fr));}
.bundle-index-card-v19 .bundle-count-7 .bundle-icon-cluster-dynamic,.bundle-index-card-v19 .bundle-count-5 .bundle-icon-cluster-dynamic{width:min(260px,82%);gap:9px;padding:18px;}
.bundle-index-card-v19 .bundle-count-7 .cluster-icon img,.bundle-index-card-v19 .bundle-count-5 .cluster-icon img{border-radius:13px;}
.bundle-chip-visual{min-height:210px;padding:16px;gap:14px;}
.bundle-chip-media{width:100%;border-radius:22px;overflow:hidden;border:1px solid rgba(255,255,255,.12);box-shadow:0 18px 48px rgba(0,0,0,.22);background:rgba(255,255,255,.05);}
.bundle-chip-media img{width:100%;display:block;aspect-ratio:3/2;object-fit:cover;}
.bundle-chip-copy{display:flex;flex-direction:column;gap:6px;}
.bundle-chip-visual strong{font-size:20px;}
.bundle-chip-visual span{font-size:13px;}
@media(max-width:900px){.bundle-icon-cluster-dynamic,.bundle-count-5 .bundle-icon-cluster-dynamic,.bundle-count-7 .bundle-icon-cluster-dynamic{width:min(300px,84%);gap:10px;padding:20px;}.bundle-app-grid-count-5,.bundle-app-grid-count-7{grid-template-columns:1fr;}.bundle-chip-visual{min-height:190px;}}


/* v19.5 bundle visual containment fix */
.bundle-index-card-v19 .bundle-visual-real{
  overflow:hidden;
}

.bundle-index-card-v19 .bundle-icon-cluster-dynamic{
  box-sizing:border-box;
  max-width:78%;
  margin:0 auto;
  transform:none!important;
}

.bundle-index-card-v19 .bundle-count-4 .bundle-icon-cluster-dynamic{
  width:210px!important;
  max-width:70%;
  grid-template-columns:repeat(2,1fr)!important;
  gap:12px!important;
  padding:20px!important;
}

.bundle-index-card-v19 .bundle-count-5 .bundle-icon-cluster-dynamic{
  width:230px!important;
  max-width:72%;
  grid-template-columns:repeat(3,1fr)!important;
  gap:8px!important;
  padding:18px!important;
}

.bundle-index-card-v19 .bundle-count-7 .bundle-icon-cluster-dynamic{
  width:245px!important;
  max-width:74%;
  grid-template-columns:repeat(4,1fr)!important;
  gap:7px!important;
  padding:16px!important;
}

.bundle-index-card-v19 .bundle-icon-cluster-dynamic .cluster-icon{
  min-width:0!important;
  width:auto!important;
  height:auto!important;
  aspect-ratio:1/1;
  border-radius:18px;
  overflow:hidden;
}

.bundle-index-card-v19 .bundle-icon-cluster-dynamic .cluster-icon img{
  width:74%!important;
  height:74%!important;
  max-width:100%;
  max-height:100%;
  object-fit:contain!important;
  display:block;
  margin:auto;
}

.bundle-index-card-v19 .bundle-cluster-label{
  left:18px;
  right:18px;
  bottom:16px;
  font-size:14px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

@media(max-width:900px){
  .bundle-index-card-v19 .bundle-count-4 .bundle-icon-cluster-dynamic{
    width:200px!important;
    max-width:76%;
  }

  .bundle-index-card-v19 .bundle-count-5 .bundle-icon-cluster-dynamic{
    width:218px!important;
    max-width:78%;
  }

  .bundle-index-card-v19 .bundle-count-7 .bundle-icon-cluster-dynamic{
    width:232px!important;
    max-width:80%;
  }
}

@media(max-width:420px){
  .bundle-index-card-v19 .bundle-count-7 .bundle-icon-cluster-dynamic{
    width:218px!important;
    gap:6px!important;
    padding:14px!important;
  }

  .bundle-index-card-v19 .bundle-count-5 .bundle-icon-cluster-dynamic{
    width:206px!important;
    gap:7px!important;
    padding:14px!important;
  }
}


/* v20 bundle app screenshot pages */
.app-page-hero .hero-shot-preview{object-fit:cover;}
.screenshot-section .real-shot-grid{align-items:start;}
@media(max-width:760px){.app-page-hero .app-hero-product{margin-top:18px;}}


/* v20.1 screenshot captions + product hero polish */
.v20-app-page .app-hero{
  min-height:auto;
  padding-block:64px 58px;
  align-items:center;
}

.v20-app-page .app-hero-product{
  min-height:420px;
  display:grid;
  place-items:center;
}

.v20-app-page .product-card-main.v20-product-card{
  width:min(420px,92%);
  min-height:360px;
  padding:34px;
  border-radius:38px;
  display:grid;
  align-content:center;
  justify-items:center;
  gap:14px;
  overflow:hidden;
}

.v20-app-page .product-card-main.v20-product-card .app-icon{
  width:112px;
  height:112px;
  object-fit:contain;
  border-radius:28px;
}

.v20-app-page .product-card-main.v20-product-card strong{
  max-width:90%;
  text-align:center;
  line-height:1.02;
}

.v20-app-page .product-card-main.v20-product-card .hero-shot-preview{
  position:static;
  width:min(210px,62%);
  max-height:260px;
  object-fit:contain;
  transform:rotate(7deg);
  border-radius:18px;
  margin-top:6px;
  box-shadow:0 24px 54px rgba(0,0,0,.24);
}

/* Make bundle detail visuals keep every icon inside the inner square */
.bundle-hero-v19 .bundle-visual-real,
.bundle-index-card-v19 .bundle-visual-real{
  overflow:hidden;
}

.bundle-hero-v19 .bundle-icon-cluster-dynamic{
  box-sizing:border-box;
  max-width:72%;
  margin:auto;
}

.bundle-hero-v19 .bundle-count-4 .bundle-icon-cluster-dynamic{
  width:300px!important;
  grid-template-columns:repeat(2,1fr)!important;
  gap:18px!important;
  padding:28px!important;
}

.bundle-hero-v19 .bundle-count-5 .bundle-icon-cluster-dynamic{
  width:360px!important;
  grid-template-columns:repeat(3,1fr)!important;
  gap:12px!important;
  padding:24px!important;
}

.bundle-hero-v19 .bundle-count-7 .bundle-icon-cluster-dynamic{
  width:390px!important;
  grid-template-columns:repeat(4,1fr)!important;
  gap:10px!important;
  padding:22px!important;
}

.bundle-hero-v19 .bundle-icon-cluster-dynamic .cluster-icon,
.bundle-index-card-v19 .bundle-icon-cluster-dynamic .cluster-icon{
  min-width:0!important;
  aspect-ratio:1/1;
  overflow:hidden;
}

.bundle-hero-v19 .bundle-icon-cluster-dynamic .cluster-icon img,
.bundle-index-card-v19 .bundle-icon-cluster-dynamic .cluster-icon img{
  width:74%!important;
  height:74%!important;
  object-fit:contain!important;
  margin:auto;
  display:block;
}

.bundle-hero-v19 .bundle-cluster-label{
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.real-shot .shot-meta strong{
  font-size:23px;
  letter-spacing:-.04em;
}

.real-shot .shot-meta p{
  max-width:620px;
}

@media(max-width:900px){
  .v20-app-page .app-hero{
    padding-block:42px;
  }

  .v20-app-page .app-hero-product{
    min-height:340px;
  }

  .v20-app-page .product-card-main.v20-product-card{
    min-height:310px;
    padding:26px;
  }

  .v20-app-page .product-card-main.v20-product-card .hero-shot-preview{
    width:min(180px,58%);
    max-height:220px;
  }

  .bundle-hero-v19 .bundle-count-5 .bundle-icon-cluster-dynamic,
  .bundle-hero-v19 .bundle-count-7 .bundle-icon-cluster-dynamic{
    width:280px!important;
    max-width:74%;
    gap:8px!important;
    padding:18px!important;
  }
}

@media(max-width:520px){
  .bundle-hero-v19 .bundle-count-5 .bundle-icon-cluster-dynamic,
  .bundle-hero-v19 .bundle-count-7 .bundle-icon-cluster-dynamic{
    width:245px!important;
    max-width:76%;
  }
}


/* v20.3 rollback from v20.2 + Export Calendar-style app template */
.v203-app-page .export-style-hero{
  min-height:auto;
  align-items:center;
  gap:72px;
  padding-block:72px 64px;
}

.v203-app-page .export-style-visual{
  display:grid;
  place-items:center;
}

.v203-app-page .hero-visual-frame{
  position:relative;
  width:min(520px,100%);
  aspect-ratio:1.28/1;
  border-radius:34px;
  overflow:hidden;
  background:linear-gradient(135deg,#071928,#101827 58%,#2a241b);
  box-shadow:0 30px 80px rgba(15,23,42,.18);
  border:1px solid rgba(255,255,255,.14);
}

.v203-app-page .hero-visual-frame::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 18% 18%,rgba(70,200,255,.18),transparent 38%),
    radial-gradient(circle at 85% 18%,rgba(255,210,120,.18),transparent 34%),
    linear-gradient(180deg,rgba(255,255,255,.03),transparent);
  pointer-events:none;
}

.v203-app-page .hero-visual-shot{
  position:absolute;
  right:-18px;
  top:-30px;
  width:48%;
  height:112%;
  object-fit:cover;
  border-radius:22px;
  transform:rotate(9deg);
  opacity:.88;
  box-shadow:0 30px 70px rgba(0,0,0,.28);
}

.v203-app-page .hero-glass-card{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  width:min(300px,62%);
  min-height:255px;
  display:grid;
  justify-items:center;
  align-content:center;
  gap:12px;
  padding:30px 24px;
  border-radius:32px;
  background:linear-gradient(135deg,rgba(255,255,255,.18),rgba(255,255,255,.08));
  border:1px solid rgba(255,255,255,.22);
  box-shadow:0 28px 70px rgba(0,0,0,.24);
  backdrop-filter:blur(18px);
}

.v203-app-page .hero-glass-card .app-icon{
  width:104px;
  height:104px;
  object-fit:contain;
  border-radius:26px;
}

.v203-app-page .hero-glass-card strong{
  color:#fff;
  font-size:34px;
  line-height:.98;
  text-align:center;
  letter-spacing:-.055em;
  max-width:95%;
}

.v203-app-page .hero-glass-card em{
  color:rgba(255,255,255,.72);
  font-style:normal;
  font-weight:850;
}

.v203-app-page .feature-pill-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
  margin-top:28px;
}

.v203-app-page .feature-pill-grid span{
  display:flex;
  align-items:center;
  min-height:58px;
  padding:14px 18px;
  border-radius:16px;
  border:1px solid rgba(15,23,42,.10);
  background:#f6f8fc;
  color:#172033;
  font-weight:850;
  line-height:1.15;
}

.v203-app-page .shot-meta strong{
  font-size:22px;
  letter-spacing:-.04em;
}

.v203-app-page .shot-meta p{
  max-width:620px;
}

@media(max-width:900px){
  .v203-app-page .export-style-hero{
    gap:30px;
    padding-block:44px;
  }

  .v203-app-page .hero-visual-frame{
    width:100%;
    max-width:520px;
  }

  .v203-app-page .hero-glass-card{
    min-height:220px;
  }

  .v203-app-page .hero-glass-card strong{
    font-size:30px;
  }

  .v203-app-page .feature-pill-grid{
    grid-template-columns:1fr;
  }
}


/* v20.4 force Export Calendar-style app layout consistency */
.v203-app-page .page-inner.wide{
  max-width:1480px;
}

.v203-app-page .export-style-hero{
  display:grid!important;
  grid-template-columns:minmax(0,1.02fr) minmax(420px,.98fr)!important;
  align-items:center!important;
  gap:72px!important;
  padding-block:76px 66px!important;
}

.v203-app-page .export-style-hero .app-hero-copy{
  max-width:760px;
  width:100%;
}

.v203-app-page .export-style-hero .app-hero-copy h1{
  max-width:780px;
  text-wrap:balance;
}

.v203-app-page .export-style-hero .app-hero-copy p{
  max-width:680px;
}

.v203-app-page .export-style-visual{
  width:100%;
  min-width:0;
  display:grid!important;
  place-items:center!important;
}

.v203-app-page .hero-visual-frame{
  width:min(560px,100%)!important;
  max-width:100%;
  aspect-ratio:1.28/1;
  margin:0!important;
}

.v203-app-page .export-style-story{
  display:grid!important;
  grid-template-columns:minmax(0,1.45fr) minmax(320px,.8fr)!important;
  gap:32px!important;
  align-items:stretch!important;
}

.v203-app-page .export-style-story .app-story-main,
.v203-app-page .export-style-story .app-use-panel{
  min-height:290px;
}

.v203-app-page .screenshot-section{
  margin-top:76px;
}

@media(max-width:980px){
  .v203-app-page .export-style-hero{
    grid-template-columns:1fr!important;
    gap:32px!important;
    padding-block:48px!important;
  }

  .v203-app-page .export-style-hero .app-hero-copy,
  .v203-app-page .export-style-hero .app-hero-copy h1,
  .v203-app-page .export-style-hero .app-hero-copy p{
    max-width:none;
  }

  .v203-app-page .hero-visual-frame{
    width:min(560px,100%)!important;
  }

  .v203-app-page .export-style-story{
    grid-template-columns:1fr!important;
  }

  .v203-app-page .export-style-story .app-story-main,
  .v203-app-page .export-style-story .app-use-panel{
    min-height:auto;
  }
}

@media(max-width:560px){
  .v203-app-page .hero-glass-card{
    width:min(270px,70%);
    min-height:210px;
  }

  .v203-app-page .hero-glass-card .app-icon{
    width:88px;
    height:88px;
  }

  .v203-app-page .hero-glass-card strong{
    font-size:27px;
  }
}


/* v21 Videos section structure */
.videos-page-inner{
  max-width:1480px;
}

.videos-hero{
  padding-bottom:38px;
}

.videos-hero h1{
  max-width:980px;
}

.videos-hero p{
  max-width:820px;
}

.section-head-row{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:28px;
  margin-bottom:26px;
}

.section-head-row h2{
  margin:0;
  font-size:clamp(36px,5vw,72px);
  line-height:.95;
  letter-spacing:-.065em;
}

.section-head-row p{
  max-width:560px;
  margin:0;
  color:var(--muted);
  font-size:19px;
  line-height:1.45;
}

.featured-video-section,
.video-workflow-section,
.video-library-section,
.video-editorial-system{
  margin-top:80px;
}

.featured-video-grid{
  display:grid;
  grid-template-columns:1.2fr .9fr .9fr;
  gap:22px;
}

.video-library-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:22px;
}

.video-card{
  border-radius:32px;
  border:1px solid rgba(15,23,42,.08);
  background:rgba(255,255,255,.82);
  box-shadow:0 24px 70px rgba(15,23,42,.08);
  overflow:hidden;
}

.video-placeholder{
  position:relative;
  min-height:220px;
  padding:22px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  gap:10px;
  background:
    radial-gradient(circle at 20% 20%,rgba(42,210,220,.24),transparent 34%),
    radial-gradient(circle at 90% 10%,rgba(255,190,90,.20),transparent 32%),
    linear-gradient(135deg,#061827,#111827 66%,#302a1e);
  color:#fff;
}

.video-placeholder-large{
  min-height:320px;
}

.video-category-pill{
  position:absolute;
  left:18px;
  top:18px;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.18);
  backdrop-filter:blur(12px);
  font-size:12px;
  font-weight:850;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.video-play-mark{
  width:70px;
  height:70px;
  border-radius:999px;
  display:grid;
  place-items:center;
  background:rgba(255,255,255,.16);
  border:1px solid rgba(255,255,255,.22);
  box-shadow:0 18px 45px rgba(0,0,0,.24);
  font-size:28px;
}

.video-placeholder strong{
  font-size:26px;
  line-height:1.02;
  letter-spacing:-.04em;
  max-width:90%;
}

.video-placeholder em{
  font-style:normal;
  color:rgba(255,255,255,.72);
  font-weight:800;
}

.video-card-body{
  padding:26px;
}

.video-card-body h3{
  margin:8px 0 10px;
  font-size:28px;
  line-height:1.02;
  letter-spacing:-.055em;
}

.video-card-body p{
  color:var(--muted);
  margin:0;
  font-size:17px;
  line-height:1.45;
}

.video-related-links{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:20px;
}

.video-link-chip{
  display:inline-flex;
  align-items:center;
  min-height:36px;
  padding:8px 12px;
  border-radius:999px;
  background:#f4f7fb;
  border:1px solid rgba(15,23,42,.08);
  color:#172033;
  font-size:13px;
  font-weight:850;
  text-decoration:none;
}

.video-category-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
}

.video-category-card{
  border-radius:28px;
  padding:26px;
  background:#fff;
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 18px 52px rgba(15,23,42,.06);
}

.video-category-card h3{
  margin:0;
  font-size:28px;
  letter-spacing:-.05em;
}

.video-category-card p{
  color:var(--muted);
  line-height:1.4;
}

.mini-video-list{
  display:grid;
  gap:9px;
  margin-top:18px;
}

.mini-video-list a{
  color:#0b5cab;
  font-weight:850;
  text-decoration:none;
}

.video-editorial-system{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:24px;
  padding:42px;
  border-radius:36px;
  background:linear-gradient(135deg,#071827,#111827);
  color:#fff;
}

.video-editorial-system h2{
  margin:8px 0 14px;
  font-size:clamp(34px,5vw,64px);
  line-height:.95;
  letter-spacing:-.065em;
}

.video-editorial-system p{
  color:rgba(255,255,255,.72);
  font-size:19px;
  line-height:1.5;
}

.video-checklist{
  display:grid;
  gap:12px;
}

.video-checklist span{
  display:flex;
  align-items:center;
  min-height:58px;
  padding:14px 18px;
  border-radius:18px;
  background:rgba(255,255,255,.09);
  border:1px solid rgba(255,255,255,.12);
  font-weight:850;
}

.home-video-library-cta{
  max-width:1480px;
  margin:80px auto 0;
  padding:0 24px;
}

.home-video-cta-inner{
  border-radius:38px;
  padding:48px;
  background:linear-gradient(135deg,#071827,#111827);
  color:#fff;
  box-shadow:0 30px 80px rgba(15,23,42,.14);
}

.home-video-cta-inner h2{
  margin:8px 0 14px;
  font-size:clamp(34px,5vw,64px);
  line-height:.95;
  letter-spacing:-.065em;
  max-width:820px;
}

.home-video-cta-inner p{
  max-width:720px;
  color:rgba(255,255,255,.72);
  font-size:19px;
  line-height:1.5;
}

@media(max-width:980px){
  .section-head-row{
    display:block;
  }

  .section-head-row p{
    margin-top:12px;
  }

  .featured-video-grid,
  .video-library-grid,
  .video-category-grid,
  .video-editorial-system{
    grid-template-columns:1fr;
  }

  .video-placeholder-large{
    min-height:260px;
  }

  .home-video-cta-inner{
    padding:34px;
  }
}

@media(max-width:620px){
  .video-card-body{
    padding:22px;
  }

  .video-placeholder{
    min-height:200px;
  }

  .video-placeholder-large{
    min-height:220px;
  }

  .video-editorial-system{
    padding:28px;
  }
}


/* v21.1 real videos + planned video expansion system */
.available-video-section,
.planned-video-section{margin-top:80px;}
.available-video-grid{margin-top:22px;}
.available-video-media{text-decoration:none;}
.available-video-media:hover .video-play-mark{transform:scale(1.05);}
.video-play-mark{transition:transform .18s ease;}
.watch-chip{background:#101827!important;color:#fff!important;}
.planned-video-section{padding-top:18px;}
.planned-video-card{opacity:.92;}
.planned-video-media{
  background:
    radial-gradient(circle at 20% 20%,rgba(90,120,255,.14),transparent 34%),
    radial-gradient(circle at 90% 10%,rgba(42,210,220,.12),transparent 32%),
    linear-gradient(135deg,#182032,#242b3b 66%,#302f3b);
}
.planned-mark{background:rgba(255,255,255,.10);color:rgba(255,255,255,.78);}
.planned-video-card .video-card-body p{color:#667085;}
@media(max-width:980px){.available-feature-grid{grid-template-columns:1fr;}}


/* v21.2 customer-facing video copy + real thumbnail cards */
.youtube-thumb-card{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  text-decoration:none;
}

.youtube-thumb{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  z-index:0;
  transform:scale(1.04);
  filter:saturate(1.04) contrast(1.02);
}

.youtube-thumb-overlay{
  position:absolute;
  inset:0;
  z-index:1;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  gap:10px;
  padding:22px;
  color:#fff;
  background:
    linear-gradient(180deg,rgba(4,10,20,.18),rgba(4,10,20,.88)),
    radial-gradient(circle at 20% 20%,rgba(42,210,220,.14),transparent 36%);
}

.youtube-thumb-card .video-category-pill{
  position:absolute;
  left:18px;
  top:18px;
}

.youtube-thumb-card .video-play-mark{
  background:rgba(255,255,255,.20);
  backdrop-filter:blur(14px);
}

.youtube-thumb-card:hover .youtube-thumb{
  transform:scale(1.08);
}

.youtube-thumb{
  transition:transform .22s ease;
}

.subtle-planned-video-section{
  margin-top:96px;
}

.subtle-planned-video-section .section-head-row h2{
  font-size:clamp(34px,4vw,58px);
}

.subtle-planned-video-section .planned-video-card{
  opacity:.86;
}

.video-system-note{
  margin-top:90px;
}

.video-system-note h2{
  font-size:clamp(32px,4vw,56px);
}

@media(max-width:620px){
  .youtube-thumb-overlay{
    padding:20px;
  }
}


/* v21.3 video-linked app page additions */
.v213-app-page .hero-visual-frame{overflow:hidden;}


/* v22 Apps catalog polish */
.apps-catalog-page{
  max-width:1480px;
}

.apps-catalog-hero h1{
  max-width:1000px;
}

.apps-catalog-hero p{
  max-width:820px;
}

.catalog-featured-section,
.catalog-workflow-section,
.catalog-ecosystem-section{
  margin-top:84px;
}

.catalog-featured-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:20px;
}

.catalog-featured-card{
  border-radius:32px;
  padding:24px;
  background:#fff;
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 22px 70px rgba(15,23,42,.07);
  min-height:360px;
  display:flex;
  flex-direction:column;
}

.catalog-card-top,
.catalog-app-top{
  display:flex;
  align-items:flex-start;
  gap:16px;
}

.catalog-card-top{
  justify-content:space-between;
}

.catalog-card-top img{
  width:76px;
  height:76px;
  border-radius:20px;
  object-fit:contain;
  box-shadow:0 16px 40px rgba(15,23,42,.12);
}

.catalog-category-pill{
  display:inline-flex;
  align-items:center;
  min-height:32px;
  padding:7px 10px;
  border-radius:999px;
  background:#f4f7fb;
  border:1px solid rgba(15,23,42,.08);
  color:#0b5cab;
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.09em;
  font-weight:900;
  text-align:right;
}

.catalog-featured-card h3{
  margin:24px 0 12px;
  font-size:30px;
  line-height:1.02;
  letter-spacing:-.055em;
}

.catalog-featured-card p{
  margin:0;
  color:var(--muted);
  line-height:1.45;
  font-size:17px;
}

.catalog-card-links{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:auto;
  padding-top:22px;
}

.button.small{
  min-height:40px;
  padding:10px 14px;
  font-size:14px;
}

.catalog-category-section{
  margin-top:54px;
}

.catalog-category-head{
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:24px;
  margin-bottom:18px;
}

.catalog-category-head h3{
  margin:0;
  font-size:clamp(32px,4vw,56px);
  line-height:.95;
  letter-spacing:-.06em;
}

.catalog-category-head p{
  margin:0;
  color:var(--muted);
  font-size:18px;
}

.catalog-app-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
}

.catalog-app-card{
  border-radius:28px;
  padding:22px;
  background:rgba(255,255,255,.82);
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 18px 58px rgba(15,23,42,.06);
}

.catalog-app-top img{
  width:64px;
  height:64px;
  border-radius:16px;
  object-fit:contain;
  flex:0 0 auto;
  box-shadow:0 14px 34px rgba(15,23,42,.10);
}

.catalog-app-card h4{
  margin:0 0 7px;
  font-size:24px;
  line-height:1.02;
  letter-spacing:-.045em;
}

.catalog-app-card p{
  margin:0;
  color:var(--muted);
  line-height:1.42;
  font-size:16px;
}

.catalog-tags{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:18px;
}

.catalog-tags span{
  display:inline-flex;
  align-items:center;
  min-height:30px;
  padding:7px 10px;
  border-radius:999px;
  background:#f5f7fb;
  border:1px solid rgba(15,23,42,.07);
  font-size:12px;
  color:#172033;
  font-weight:850;
}

.catalog-mini-links{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:18px;
}

.catalog-mini-links a{
  color:#0b5cab;
  font-weight:900;
  text-decoration:none;
  font-size:14px;
}

.catalog-ecosystem-section{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:28px;
  align-items:center;
  padding:44px;
  border-radius:38px;
  background:linear-gradient(135deg,#071827,#111827);
  color:#fff;
}

.catalog-ecosystem-section h2{
  margin:8px 0 14px;
  font-size:clamp(34px,5vw,64px);
  line-height:.95;
  letter-spacing:-.065em;
  max-width:880px;
}

.catalog-ecosystem-section p{
  max-width:780px;
  color:rgba(255,255,255,.72);
  font-size:19px;
  line-height:1.5;
}

.catalog-ecosystem-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  justify-content:flex-end;
}

@media(max-width:1120px){
  .catalog-featured-grid,
  .catalog-app-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media(max-width:760px){
  .catalog-featured-grid,
  .catalog-app-grid,
  .catalog-ecosystem-section{
    grid-template-columns:1fr;
  }

  .catalog-category-head{
    display:block;
  }

  .catalog-category-head p{
    margin-top:8px;
  }

  .catalog-ecosystem-actions{
    justify-content:flex-start;
  }
}


/* v22.2 Apps catalog visual polish */
.apps-catalog-v222{
  background:
    radial-gradient(circle at 15% 4%,rgba(42,210,220,.12),transparent 28%),
    linear-gradient(180deg,#f7f9fd 0%,#eef3f8 38%,#f8fafc 100%);
}

.apps-catalog-v222 .site-header{
  background:rgba(77,83,94,.92);
  backdrop-filter:blur(18px);
}

.apps-catalog-v222 .apps-catalog-hero{
  padding-top:92px;
  padding-bottom:46px;
  color:#071120;
}

.apps-catalog-v222 .apps-catalog-hero h1{
  color:#071120;
  text-shadow:none;
}

.apps-catalog-v222 .apps-catalog-hero p{
  color:#58677b;
}

.apps-catalog-v222 .catalog-featured-section{
  margin-top:48px;
}

.apps-catalog-v222 .catalog-workflow-section{
  margin-top:92px;
}

.apps-catalog-v222 .section-head-row h2,
.apps-catalog-v222 .compact-head h2,
.apps-catalog-v222 .catalog-category-head h3{
  color:#071120;
}

.apps-catalog-v222 .section-head-row p,
.apps-catalog-v222 .compact-head .intro{
  color:#64748b;
}

.apps-catalog-v222 .catalog-featured-grid{
  gap:22px;
}

.apps-catalog-v222 .catalog-featured-card{
  position:relative;
  overflow:hidden;
  min-height:360px;
  background:
    radial-gradient(circle at 16% 12%,rgba(42,210,220,.10),transparent 36%),
    linear-gradient(180deg,#ffffff,#f8fbff);
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 24px 70px rgba(15,23,42,.08);
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.apps-catalog-v222 .catalog-featured-card::after{
  content:"";
  position:absolute;
  inset:auto -20% -38% 20%;
  height:140px;
  background:radial-gradient(circle,rgba(11,92,171,.10),transparent 68%);
  pointer-events:none;
}

.apps-catalog-v222 .catalog-featured-card:hover,
.apps-catalog-v222 .catalog-app-card:hover{
  transform:translateY(-3px);
  box-shadow:0 30px 84px rgba(15,23,42,.11);
  border-color:rgba(11,92,171,.18);
}

.apps-catalog-v222 .catalog-card-top{
  align-items:flex-start;
}

.apps-catalog-v222 .catalog-icon-link{
  display:inline-flex;
  border-radius:22px;
  text-decoration:none;
  transition:transform .18s ease;
}

.apps-catalog-v222 .catalog-icon-link:hover{
  transform:scale(1.04);
}

.apps-catalog-v222 .catalog-card-top img,
.apps-catalog-v222 .catalog-app-top img{
  background:#fff;
}

.apps-catalog-v222 .catalog-category-pill{
  background:linear-gradient(180deg,#ffffff,#f5f8fc);
  color:#0b5cab;
}

.apps-catalog-v222 .catalog-featured-card h3{
  color:#071120;
}

.apps-catalog-v222 .catalog-featured-card p{
  color:#59687c;
}

.apps-catalog-v222 .catalog-app-grid{
  gap:20px;
}

.apps-catalog-v222 .catalog-app-card{
  position:relative;
  overflow:hidden;
  background:
    linear-gradient(180deg,rgba(255,255,255,.96),rgba(249,251,255,.92));
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 18px 58px rgba(15,23,42,.065);
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.apps-catalog-v222 .catalog-app-card::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(135deg,rgba(42,210,220,.06),transparent 38%);
  pointer-events:none;
}

.apps-catalog-v222 .catalog-app-card > *{
  position:relative;
  z-index:1;
}

.apps-catalog-v222 .catalog-app-card h4{
  color:#071120;
}

.apps-catalog-v222 .catalog-tags span{
  background:#f4f7fb;
  border-color:rgba(15,23,42,.08);
}

.apps-catalog-v222 .catalog-mini-links{
  gap:8px 12px;
}

.apps-catalog-v222 .catalog-mini-links a{
  display:inline-flex;
  align-items:center;
  min-height:32px;
  padding:0;
  color:#0b5cab;
}

.apps-catalog-v222 .catalog-mini-links a:first-child{
  color:#071120;
}

.apps-catalog-v222 .catalog-category-section{
  margin-top:62px;
}

.apps-catalog-v222 .catalog-category-head{
  margin-bottom:20px;
  padding-bottom:0;
}

.apps-catalog-v222 .catalog-category-head h3{
  max-width:760px;
}

.apps-catalog-v222 .catalog-ecosystem-section{
  margin-top:100px;
}

@media(max-width:760px){
  .apps-catalog-v222 .apps-catalog-hero{
    padding-top:58px;
  }
}


/* v22.3 Premium Apps catalog cards */
.apps-catalog-v223 .catalog-featured-grid{
  gap:24px;
}

.apps-catalog-v223 .catalog-featured-card,
.apps-catalog-v223 .catalog-app-card{
  position:relative;
  isolation:isolate;
}

.apps-catalog-v223 .catalog-card-overlay-link{
  position:absolute;
  inset:0;
  z-index:1;
  border-radius:inherit;
  text-decoration:none;
}

.apps-catalog-v223 .catalog-featured-card .catalog-card-links,
.apps-catalog-v223 .catalog-featured-card .catalog-icon-link,
.apps-catalog-v223 .catalog-app-card .catalog-mini-links,
.apps-catalog-v223 .catalog-app-card .catalog-icon-link{
  position:relative;
  z-index:3;
}

/* Featured cards become mini product panels */
.apps-catalog-v223 .catalog-featured-card{
  min-height:345px;
  padding:0;
  overflow:hidden;
  border-radius:34px;
  background:
    linear-gradient(180deg,rgba(255,255,255,.98),rgba(247,251,255,.95));
  border:1px solid rgba(15,23,42,.075);
  box-shadow:
    0 28px 80px rgba(15,23,42,.085),
    inset 0 1px 0 rgba(255,255,255,.88);
}

.apps-catalog-v223 .catalog-featured-card::before{
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height:132px;
  background:
    radial-gradient(circle at 18% 12%,rgba(42,210,220,.18),transparent 42%),
    linear-gradient(135deg,rgba(11,92,171,.06),rgba(255,255,255,0));
  z-index:0;
}

.apps-catalog-v223 .catalog-featured-card::after{
  content:"";
  position:absolute;
  inset:auto -30% -42% 10%;
  height:180px;
  background:radial-gradient(circle,rgba(11,92,171,.10),transparent 70%);
  pointer-events:none;
  z-index:0;
}

.apps-catalog-v223 .catalog-featured-card > *:not(.catalog-card-overlay-link){
  position:relative;
  z-index:2;
}

.apps-catalog-v223 .catalog-featured-card .catalog-card-top{
  padding:24px 24px 0;
  align-items:center;
}

.apps-catalog-v223 .catalog-featured-card .catalog-icon-link{
  width:88px;
  height:88px;
  display:grid;
  place-items:center;
  border-radius:28px;
  background:
    linear-gradient(180deg,rgba(255,255,255,.98),rgba(242,247,252,.92));
  box-shadow:
    0 18px 46px rgba(15,23,42,.10),
    inset 0 1px 0 rgba(255,255,255,.95);
  border:1px solid rgba(15,23,42,.055);
}

.apps-catalog-v223 .catalog-featured-card .catalog-card-top img{
  width:66px;
  height:66px;
  border-radius:18px;
  object-fit:contain;
  box-shadow:none;
  background:transparent;
}

.apps-catalog-v223 .catalog-featured-card .catalog-category-pill{
  min-height:30px;
  padding:7px 11px;
  max-width:132px;
  justify-content:center;
  font-size:10.5px;
  line-height:1.05;
  background:rgba(255,255,255,.78);
  backdrop-filter:blur(12px);
}

.apps-catalog-v223 .catalog-featured-card h3{
  padding:0 24px;
  margin:40px 0 12px;
  font-size:29px;
  line-height:.98;
}

.apps-catalog-v223 .catalog-featured-card p{
  padding:0 24px;
  font-size:16.5px;
  line-height:1.48;
}

.apps-catalog-v223 .catalog-featured-card .catalog-card-links{
  padding:22px 24px 24px;
  margin-top:auto;
}

.apps-catalog-v223 .catalog-featured-card .catalog-primary-action{
  border-radius:999px;
  background:#071120!important;
  color:#fff!important;
  box-shadow:0 14px 30px rgba(15,23,42,.14);
}

.apps-catalog-v223 .catalog-featured-card .catalog-store-action{
  background:transparent!important;
  border-color:transparent!important;
  color:#0b5cab!important;
  padding-left:4px;
  padding-right:4px;
}

/* Workflow cards become cleaner horizontal product rows */
.apps-catalog-v223 .catalog-app-card{
  border-radius:30px;
  padding:24px;
  background:
    linear-gradient(180deg,rgba(255,255,255,.98),rgba(249,252,255,.94));
  border:1px solid rgba(15,23,42,.075);
  box-shadow:
    0 22px 68px rgba(15,23,42,.065),
    inset 0 1px 0 rgba(255,255,255,.88);
}

.apps-catalog-v223 .catalog-app-card::before{
  background:
    radial-gradient(circle at 8% 10%,rgba(42,210,220,.10),transparent 34%),
    linear-gradient(135deg,rgba(11,92,171,.035),transparent 44%);
}

.apps-catalog-v223 .catalog-app-top{
  gap:18px;
}

.apps-catalog-v223 .catalog-app-card .catalog-icon-link{
  width:82px;
  height:82px;
  display:grid;
  place-items:center;
  flex:0 0 auto;
  border-radius:26px;
  background:
    linear-gradient(180deg,#ffffff,#f4f8fc);
  border:1px solid rgba(15,23,42,.06);
  box-shadow:0 16px 42px rgba(15,23,42,.08);
}

.apps-catalog-v223 .catalog-app-top img{
  width:62px;
  height:62px;
  object-fit:contain;
  border-radius:16px;
  box-shadow:none;
  background:transparent;
}

.apps-catalog-v223 .catalog-app-card h4{
  margin-top:2px;
  font-size:25px;
  line-height:1.0;
}

.apps-catalog-v223 .catalog-app-card p{
  font-size:16.5px;
  line-height:1.42;
  margin-top:7px;
}

.apps-catalog-v223 .catalog-tags{
  margin-top:20px;
  gap:8px;
}

.apps-catalog-v223 .catalog-tags span{
  background:rgba(244,247,251,.84);
  min-height:31px;
}

.apps-catalog-v223 .catalog-mini-links{
  margin-top:20px;
  padding-top:16px;
  border-top:1px solid rgba(15,23,42,.075);
}

.apps-catalog-v223 .catalog-mini-links a{
  position:relative;
  z-index:3;
  min-height:30px;
  font-size:14px;
}

.apps-catalog-v223 .catalog-mini-links .primary-mini-link{
  color:#071120;
  font-weight:950;
}

.apps-catalog-v223 .catalog-mini-links .store-mini-link{
  color:#0b5cab;
}

.apps-catalog-v223 .catalog-featured-card:hover,
.apps-catalog-v223 .catalog-app-card:hover{
  transform:translateY(-4px);
  box-shadow:0 34px 94px rgba(15,23,42,.12);
}

.apps-catalog-v223 .catalog-featured-card:hover .catalog-icon-link,
.apps-catalog-v223 .catalog-app-card:hover .catalog-icon-link{
  transform:scale(1.045);
}

.apps-catalog-v223 .catalog-icon-link{
  transition:transform .18s ease, box-shadow .18s ease;
}

@media(max-width:760px){
  .apps-catalog-v223 .catalog-featured-card{
    min-height:320px;
  }

  .apps-catalog-v223 .catalog-featured-card h3{
    margin-top:32px;
  }

  .apps-catalog-v223 .catalog-app-top{
    align-items:flex-start;
  }
}


/* v22.4 Apps catalog redesign: showcase + shelves */
.apps-catalog-v224{
  background:
    radial-gradient(circle at 12% 0%,rgba(42,210,220,.14),transparent 30%),
    linear-gradient(180deg,#f3fbff 0%,#edf5fa 32%,#f8fafc 100%);
}

.apps-catalog-v224 .site-header{
  background:rgba(77,83,94,.92);
  backdrop-filter:blur(18px);
}

.apps-catalog-v224 .apps-shelf-page{
  max-width:1480px;
}

.apps-catalog-v224 .apps-shelf-hero{
  padding-top:92px;
  padding-bottom:36px;
}

.apps-catalog-v224 .apps-shelf-hero h1{
  max-width:1040px;
  color:#071120;
}

.apps-catalog-v224 .apps-shelf-hero p{
  max-width:850px;
  color:#58677b;
}

.apps-showcase-section{
  margin-top:56px;
}

.apps-showcase-layout{
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(360px,.85fr);
  gap:24px;
  align-items:stretch;
}

.hero-app-panel{
  position:relative;
  overflow:hidden;
  min-height:500px;
  border-radius:42px;
  padding:38px;
  color:#fff;
  background:linear-gradient(135deg,#071827,#101827 58%,#243147);
  box-shadow:0 34px 94px rgba(15,23,42,.16);
  border:1px solid rgba(255,255,255,.14);
}

.hero-app-panel-bg{
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 18% 16%,rgba(42,210,220,.22),transparent 34%),
    radial-gradient(circle at 84% 14%,rgba(255,210,120,.16),transparent 32%),
    linear-gradient(180deg,rgba(255,255,255,.03),transparent);
  pointer-events:none;
}

.hero-app-panel > *:not(.hero-app-panel-bg){
  position:relative;
  z-index:1;
}

.hero-app-panel-top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
}

.app-shelf-icon-link{
  display:grid;
  place-items:center;
  width:84px;
  height:84px;
  flex:0 0 auto;
  border-radius:26px;
  background:linear-gradient(180deg,#ffffff,#f4f8fc);
  border:1px solid rgba(15,23,42,.07);
  box-shadow:0 18px 46px rgba(15,23,42,.10);
  text-decoration:none;
  transition:transform .18s ease, box-shadow .18s ease;
}

.app-shelf-icon-link.large{
  width:108px;
  height:108px;
  border-radius:32px;
  background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(239,247,255,.88));
  border-color:rgba(255,255,255,.18);
}

.app-shelf-icon-link:hover{
  transform:scale(1.045);
}

.app-shelf-icon-link img{
  width:66px;
  height:66px;
  object-fit:contain;
  border-radius:18px;
}

.app-shelf-icon-link.large img{
  width:82px;
  height:82px;
  border-radius:24px;
}

.hero-app-panel .catalog-category-pill{
  background:rgba(255,255,255,.12);
  color:#d8ecff;
  border-color:rgba(255,255,255,.18);
  backdrop-filter:blur(12px);
}

.hero-app-panel h3{
  margin:90px 0 16px;
  max-width:640px;
  font-size:clamp(46px,6vw,86px);
  line-height:.88;
  letter-spacing:-.075em;
}

.hero-app-panel p{
  max-width:620px;
  color:rgba(255,255,255,.76);
  font-size:20px;
  line-height:1.48;
}

.hero-app-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:34px;
}

.feature-row-list{
  display:grid;
  gap:14px;
}

.feature-row-app{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:18px;
  padding:20px;
  border-radius:30px;
  background:rgba(255,255,255,.86);
  border:1px solid rgba(15,23,42,.075);
  box-shadow:0 20px 64px rgba(15,23,42,.07);
  transition:transform .18s ease, box-shadow .18s ease;
}

.feature-row-app:hover{
  transform:translateY(-3px);
  box-shadow:0 30px 84px rgba(15,23,42,.11);
}

.feature-row-app h3{
  margin:0 0 7px;
  font-size:25px;
  line-height:1;
  letter-spacing:-.045em;
  color:#071120;
}

.feature-row-app p{
  margin:0;
  color:#5c6a7e;
  line-height:1.42;
  font-size:16px;
}

.feature-row-link{
  position:relative;
  z-index:2;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:38px;
  padding:0 15px;
  border-radius:999px;
  background:#071120;
  color:#fff;
  font-weight:900;
  text-decoration:none;
  white-space:nowrap;
}

.app-shelves-section{
  margin-top:104px;
}

.apps-catalog-v224 .compact-head h2,
.apps-catalog-v224 .section-head-row h2,
.apps-catalog-v224 .app-shelf-head h3{
  color:#071120;
}

.apps-catalog-v224 .compact-head .intro,
.apps-catalog-v224 .section-head-row p{
  color:#64748b;
}

.app-shelf-category{
  margin-top:68px;
}

.app-shelf-head{
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(320px,.7fr);
  gap:24px;
  align-items:end;
  margin-bottom:22px;
}

.app-shelf-head h3{
  margin:0;
  font-size:clamp(36px,5vw,68px);
  line-height:.92;
  letter-spacing:-.07em;
}

.app-shelf-head p{
  margin:0;
  color:#64748b;
  font-size:18px;
  line-height:1.42;
}

.app-shelf-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
}

.app-shelf-tile{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  min-height:210px;
  border-radius:32px;
  padding:24px;
  background:
    linear-gradient(180deg,rgba(255,255,255,.94),rgba(249,252,255,.88));
  border:1px solid rgba(15,23,42,.075);
  box-shadow:0 22px 68px rgba(15,23,42,.065);
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.app-shelf-tile::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 10% 10%,rgba(42,210,220,.10),transparent 34%),
    linear-gradient(135deg,rgba(11,92,171,.035),transparent 46%);
  z-index:0;
  pointer-events:none;
}

.app-shelf-tile > *:not(.app-shelf-main-link){
  position:relative;
  z-index:2;
}

.app-shelf-main-link{
  position:absolute;
  inset:0;
  z-index:1;
  border-radius:inherit;
  text-decoration:none;
}

.app-shelf-tile:hover{
  transform:translateY(-3px);
  box-shadow:0 32px 86px rgba(15,23,42,.105);
  border-color:rgba(11,92,171,.18);
}

.app-shelf-tile-top{
  display:flex;
  align-items:flex-start;
  gap:18px;
}

.app-shelf-tile h4{
  margin:2px 0 8px;
  color:#071120;
  font-size:28px;
  line-height:.98;
  letter-spacing:-.055em;
}

.app-shelf-tile p{
  margin:0;
  color:#5c6a7e;
  line-height:1.43;
  font-size:16.5px;
}

.app-shelf-meta{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:22px;
}

.app-shelf-meta span{
  display:inline-flex;
  align-items:center;
  min-height:30px;
  padding:7px 10px;
  border-radius:999px;
  background:#f4f7fb;
  border:1px solid rgba(15,23,42,.07);
  color:#172033;
  font-size:12px;
  font-weight:850;
}

.app-shelf-links{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin-top:22px;
  padding-top:16px;
  border-top:1px solid rgba(15,23,42,.075);
  position:relative;
  z-index:3;
}

.app-shelf-links a{
  color:#0b5cab;
  font-weight:900;
  text-decoration:none;
}

.app-shelf-links a:first-child{
  color:#071120;
}

.apps-catalog-closing{
  margin-top:104px;
}

@media(max-width:1100px){
  .apps-showcase-layout,
  .app-shelf-grid{
    grid-template-columns:1fr;
  }

  .hero-app-panel{
    min-height:420px;
  }

  .hero-app-panel h3{
    margin-top:70px;
  }
}

@media(max-width:760px){
  .apps-catalog-v224 .apps-shelf-hero{
    padding-top:58px;
  }

  .hero-app-panel{
    padding:28px;
    border-radius:34px;
  }

  .feature-row-app{
    grid-template-columns:auto minmax(0,1fr);
  }

  .feature-row-link{
    grid-column:2;
    justify-self:start;
  }

  .app-shelf-head{
    grid-template-columns:1fr;
    gap:8px;
  }

  .app-shelf-tile-top{
    display:block;
  }

  .app-shelf-tile .app-shelf-icon-link{
    margin-bottom:18px;
  }
}


/* v22.5 Apps catalog copy + hero icon polish */
.apps-catalog-v225 .hero-app-panel .app-shelf-icon-link.large{
  width:138px;
  height:138px;
  border-radius:38px;
  box-shadow:
    0 26px 70px rgba(0,0,0,.22),
    inset 0 1px 0 rgba(255,255,255,.95);
}

.apps-catalog-v225 .hero-app-panel .app-shelf-icon-link.large img{
  width:104px;
  height:104px;
  border-radius:30px;
  object-fit:contain;
}

.apps-catalog-v225 .hero-app-panel h3{
  margin-top:76px;
}

.apps-catalog-v225 .feature-row-app img[src*="date-stamp-photos"],
.apps-catalog-v225 .app-shelf-tile img[src*="date-stamp-photos"],
.apps-catalog-v225 .catalog-featured-card img[src*="date-stamp-photos"]{
  object-fit:contain;
}

@media(max-width:760px){
  .apps-catalog-v225 .hero-app-panel .app-shelf-icon-link.large{
    width:116px;
    height:116px;
    border-radius:34px;
  }

  .apps-catalog-v225 .hero-app-panel .app-shelf-icon-link.large img{
    width:88px;
    height:88px;
    border-radius:26px;
  }
}


/* v23 Guides/content hub polish */
.guides-hub-v23{
  background:
    radial-gradient(circle at 12% 0%,rgba(42,210,220,.12),transparent 30%),
    linear-gradient(180deg,#f7fbff 0%,#eef5fb 34%,#f8fafc 100%);
}

.guides-hub-page{
  max-width:1480px;
}

.guides-hero-v23{
  padding-top:92px;
  padding-bottom:42px;
}

.guides-hero-v23 h1{
  max-width:1040px;
  color:#071120;
}

.guides-hero-v23 p{
  max-width:820px;
  color:#58677b;
}

.guides-featured-section,
.guides-intent-section,
.guides-strategy-section{
  margin-top:82px;
}

.guides-featured-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:22px;
}

.guide-card-v23{
  position:relative;
  overflow:hidden;
  border-radius:34px;
  padding:28px;
  background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(248,252,255,.94));
  border:1px solid rgba(15,23,42,.075);
  box-shadow:0 24px 76px rgba(15,23,42,.075);
}

.guide-card-featured{
  min-height:430px;
}

.guide-card-v23::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 10% 10%,rgba(42,210,220,.10),transparent 36%),
    linear-gradient(135deg,rgba(11,92,171,.04),transparent 44%);
  pointer-events:none;
}

.guide-card-v23 > *{
  position:relative;
  z-index:1;
}

.guide-card-top{
  display:flex;
  justify-content:space-between;
  gap:14px;
  align-items:center;
}

.guide-category-pill,
.guide-intent-label{
  display:inline-flex;
  align-items:center;
  min-height:32px;
  padding:7px 11px;
  border-radius:999px;
  font-size:11px;
  font-weight:900;
  letter-spacing:.09em;
  text-transform:uppercase;
}

.guide-category-pill{
  color:#0b5cab;
  background:#f4f8fc;
  border:1px solid rgba(15,23,42,.08);
}

.guide-intent-label{
  color:#172033;
  background:#fff;
  border:1px solid rgba(15,23,42,.08);
}

.guide-card-v23 h3{
  margin:34px 0 14px;
  max-width:760px;
  color:#071120;
  font-size:clamp(32px,4vw,58px);
  line-height:.94;
  letter-spacing:-.065em;
}

.guide-card-v23 p{
  color:#5b6a7e;
  line-height:1.5;
  font-size:18px;
}

.guide-question-list{
  display:flex;
  flex-wrap:wrap;
  gap:9px;
  margin-top:22px;
}

.guide-question-list span{
  display:inline-flex;
  align-items:center;
  padding:8px 11px;
  border-radius:999px;
  background:#f5f7fb;
  border:1px solid rgba(15,23,42,.075);
  color:#172033;
  font-size:13px;
  font-weight:850;
}

.guide-card-links{
  display:flex;
  flex-wrap:wrap;
  gap:11px;
  align-items:center;
  margin-top:28px;
}

.guide-link-subtle{
  color:#0b5cab;
  font-weight:900;
  text-decoration:none;
}

.guide-workflow-group{
  margin-top:68px;
}

.guide-workflow-group > h3{
  margin:0 0 20px;
  color:#071120;
  font-size:clamp(34px,5vw,64px);
  line-height:.92;
  letter-spacing:-.07em;
}

.guide-workflow-group > h4{
  margin:26px 0 14px;
  color:#5c6a7e;
  font-size:18px;
  letter-spacing:-.02em;
}

.guide-workflow-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
}

.future-topic-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}

.future-guide-topic{
  border-radius:26px;
  padding:22px;
  background:rgba(255,255,255,.80);
  border:1px solid rgba(15,23,42,.075);
  box-shadow:0 18px 56px rgba(15,23,42,.055);
}

.future-guide-topic h3{
  margin:18px 0 10px;
  color:#071120;
  font-size:25px;
  line-height:1;
  letter-spacing:-.045em;
}

.future-guide-topic p{
  color:#5c6a7e;
  line-height:1.44;
}

.future-guide-topic a{
  color:#0b5cab;
  font-weight:900;
  text-decoration:none;
}

.guides-strategy-section{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:28px;
  padding:44px;
  border-radius:38px;
  background:linear-gradient(135deg,#071827,#111827);
  color:#fff;
}

.guides-strategy-section h2{
  margin:8px 0 14px;
  font-size:clamp(34px,5vw,64px);
  line-height:.95;
  letter-spacing:-.065em;
}

.guides-strategy-section p{
  color:rgba(255,255,255,.74);
  font-size:19px;
  line-height:1.5;
}

.guides-checklist{
  display:grid;
  gap:12px;
}

.guides-checklist span{
  display:flex;
  align-items:center;
  min-height:58px;
  padding:14px 18px;
  border-radius:18px;
  background:rgba(255,255,255,.09);
  border:1px solid rgba(255,255,255,.12);
  font-weight:850;
}

.article-intent-box{
  margin:28px 0;
  padding:24px;
  border-radius:26px;
  background:#f7fbff;
  border:1px solid rgba(15,23,42,.08);
}

.article-intent-box strong{
  display:block;
  font-size:22px;
  letter-spacing:-.04em;
  color:#071120;
}

.article-intent-box p{
  color:#5b6a7e;
}

.article-question-chips,
.article-related-links{
  display:flex;
  flex-wrap:wrap;
  gap:9px;
  margin-top:16px;
}

.article-question-chips span{
  display:inline-flex;
  padding:8px 11px;
  border-radius:999px;
  background:#fff;
  border:1px solid rgba(15,23,42,.08);
  font-weight:800;
  color:#172033;
  font-size:13px;
}

@media(max-width:980px){
  .guides-featured-grid,
  .guide-workflow-grid,
  .future-topic-grid,
  .guides-strategy-section{
    grid-template-columns:1fr;
  }
}

@media(max-width:620px){
  .guide-card-v23{
    padding:24px;
  }

  .guide-card-top{
    display:block;
  }

  .guide-intent-label{
    margin-top:10px;
  }
}


/* v23.1 Guides hub refinement */
.guides-pathways-section{
  margin-top:88px;
}

.guide-pathway-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
}

.guide-pathway-card{
  position:relative;
  overflow:hidden;
  border-radius:32px;
  padding:26px;
  background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(249,252,255,.92));
  border:1px solid rgba(15,23,42,.075);
  box-shadow:0 22px 68px rgba(15,23,42,.065);
}

.guide-pathway-card::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 10% 10%,rgba(42,210,220,.10),transparent 36%),
    linear-gradient(135deg,rgba(11,92,171,.04),transparent 44%);
  pointer-events:none;
}

.guide-pathway-card > *{
  position:relative;
  z-index:1;
}

.guide-pathway-card h3{
  margin:24px 0 12px;
  color:#071120;
  font-size:clamp(28px,3.2vw,44px);
  line-height:.96;
  letter-spacing:-.06em;
}

.guide-pathway-card p{
  color:#5b6a7e;
  line-height:1.48;
  font-size:17px;
}

.guide-pathway-questions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:18px;
}

.guide-pathway-questions span{
  display:inline-flex;
  align-items:center;
  padding:8px 10px;
  border-radius:999px;
  background:#f5f7fb;
  border:1px solid rgba(15,23,42,.075);
  color:#172033;
  font-size:12.5px;
  font-weight:850;
}

.future-guides-compact{
  margin-top:76px;
}

.future-guides-pill-grid{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:12px;
}

.future-guide-pill{
  display:grid;
  gap:8px;
  min-height:118px;
  align-content:center;
  padding:18px;
  border-radius:24px;
  background:rgba(255,255,255,.80);
  border:1px solid rgba(15,23,42,.075);
  box-shadow:0 16px 48px rgba(15,23,42,.045);
  text-decoration:none;
}

.future-guide-pill strong{
  color:#071120;
  line-height:1.03;
  letter-spacing:-.035em;
}

.future-guide-pill span{
  color:#0b5cab;
  font-size:11px;
  font-weight:900;
  letter-spacing:.09em;
  text-transform:uppercase;
}

.article-sunpath-v231 .article-page-inner{
  max-width:980px;
}

.article-body-v231{
  margin-top:36px;
}

.article-body-v231 section{
  margin-top:42px;
}

.article-body-v231 h2{
  font-size:clamp(30px,4vw,48px);
  line-height:1;
  letter-spacing:-.055em;
  color:#071120;
}

.article-body-v231 p{
  color:#4f6075;
  font-size:19px;
  line-height:1.65;
}

.article-bottom-cta{
  padding:32px;
  border-radius:30px;
  background:linear-gradient(135deg,#071827,#111827);
  color:#fff;
}

.article-bottom-cta h2{
  color:#fff;
}

.article-bottom-cta p{
  color:rgba(255,255,255,.72);
}

@media(max-width:980px){
  .guide-pathway-grid,
  .future-guides-pill-grid{
    grid-template-columns:1fr;
  }
}


/* v23.2 SunPath article Q&A block */
.article-faq-section{
  margin-top:56px;
  padding:32px;
  border-radius:30px;
  background:linear-gradient(180deg,#ffffff,#f7fbff);
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 22px 68px rgba(15,23,42,.06);
}

.article-faq-section > h2{
  margin-top:0;
}

.article-faq-section > p{
  color:#5b6a7e;
  font-size:18px;
  line-height:1.5;
}

.article-faq-grid{
  display:grid;
  gap:16px;
  margin-top:24px;
}

.article-faq-item{
  padding:22px;
  border-radius:22px;
  background:#f8fbff;
  border:1px solid rgba(15,23,42,.075);
}

.article-faq-item h3{
  margin:0 0 10px;
  color:#071120;
  font-size:24px;
  line-height:1.05;
  letter-spacing:-.045em;
}

.article-faq-item p{
  margin:0;
  color:#4f6075;
  font-size:17px;
  line-height:1.55;
}


/* v23.3 SunPath article standardization */
.article-standard-v233 .article-layout{
  display:grid;
  grid-template-columns:minmax(0,760px) 320px;
  gap:36px;
  align-items:start;
}

.article-standard-v233 .article-main{
  padding:34px;
  border-radius:0 0 34px 34px;
  background:#fff;
  box-shadow:0 26px 86px rgba(15,23,42,.07);
}

.article-standard-v233 .article-main h1{
  color:#071120;
  font-size:clamp(42px,6vw,76px);
  line-height:.9;
  letter-spacing:-.075em;
  margin:12px 0 20px;
}

.article-standard-v233 .article-lead{
  color:#4f6075;
  font-size:20px;
  line-height:1.55;
}

.article-standard-v233 .article-main h2{
  color:#071120;
  font-size:30px;
  line-height:1.03;
  letter-spacing:-.055em;
  margin:36px 0 16px;
}

.article-standard-v233 .article-main p,
.article-standard-v233 .article-main li{
  color:#34465f;
  font-size:16.5px;
  line-height:1.62;
}

.article-standard-v233 .article-main a{
  color:#005fb8;
  font-weight:850;
}

.article-standard-v233 .article-app-cta{
  margin:34px 0;
  padding:24px;
  border-radius:22px;
  background:linear-gradient(135deg,#071827,#111827);
  color:#fff;
}

.article-standard-v233 .article-app-cta h2{
  color:#fff;
  margin-top:0;
}

.article-standard-v233 .article-app-cta p{
  color:rgba(255,255,255,.78);
}

.article-standard-v233 .article-faq-standard{
  display:grid;
  gap:12px;
  margin-top:18px;
}

.article-standard-v233 .article-faq-standard details{
  border-radius:18px;
  background:#fff;
  border:1px solid rgba(15,23,42,.11);
  box-shadow:0 10px 28px rgba(15,23,42,.045);
  overflow:hidden;
}

.article-standard-v233 .article-faq-standard summary{
  cursor:pointer;
  padding:17px 20px;
  color:#071120;
  font-weight:950;
  list-style-position:inside;
}

.article-standard-v233 .article-faq-standard details p{
  padding:0 20px 18px 37px;
  margin:0;
}

.article-standard-v233 .article-sidebar{
  position:sticky;
  top:96px;
  display:grid;
  gap:18px;
}

.article-standard-v233 .sidebar-card{
  padding:24px;
  border-radius:28px;
  background:#fff;
  border:1px solid rgba(15,23,42,.075);
  box-shadow:0 24px 72px rgba(15,23,42,.07);
}

.article-standard-v233 .sidebar-card h2{
  margin:0 0 12px;
  color:#071120;
  font-size:25px;
  line-height:1;
  letter-spacing:-.045em;
}

.article-standard-v233 .sidebar-card p{
  color:#34465f;
  line-height:1.45;
}

.article-standard-v233 .sidebar-card > a:not(.sidebar-guide-link){
  color:#005fb8;
  font-weight:900;
  text-decoration:none;
}

.article-standard-v233 .sidebar-guide-link{
  display:grid;
  gap:6px;
  padding:15px;
  border-radius:18px;
  border:1px solid rgba(15,23,42,.085);
  text-decoration:none;
  margin-top:12px;
}

.article-standard-v233 .sidebar-guide-link span{
  color:#005fb8;
  font-size:11px;
  font-weight:950;
}

.article-standard-v233 .sidebar-guide-link strong{
  color:#071120;
  font-size:14px;
  line-height:1.15;
}

.article-standard-v233 .sidebar-guide-link small{
  color:#6b7688;
  font-size:12px;
}

@media(max-width:980px){
  .article-standard-v233 .article-layout{
    grid-template-columns:1fr;
  }

  .article-standard-v233 .article-sidebar{
    position:static;
  }
}


/* v23.4 Guides inventory restore + SunPath app card */
.guides-all-section{
  margin-top:88px;
}

.guide-inventory-group{
  margin-top:56px;
}

.guide-inventory-group > h3{
  margin:0 0 18px;
  color:#071120;
  font-size:clamp(32px,4vw,56px);
  line-height:.95;
  letter-spacing:-.065em;
}

.guide-inventory-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}

.guide-inventory-card{
  min-height:260px;
  display:flex;
  flex-direction:column;
  padding:22px;
  border-radius:28px;
  background:linear-gradient(180deg,rgba(255,255,255,.97),rgba(249,252,255,.92));
  border:1px solid rgba(15,23,42,.075);
  box-shadow:0 18px 56px rgba(15,23,42,.055);
}

.guide-inventory-card h4{
  margin:0 0 12px;
  color:#071120;
  font-size:25px;
  line-height:1.02;
  letter-spacing:-.045em;
}

.guide-inventory-card p{
  color:#5b6a7e;
  line-height:1.45;
  font-size:15.5px;
}

.guide-inventory-meta{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:auto;
  padding-top:16px;
}

.guide-inventory-meta span{
  display:inline-flex;
  align-items:center;
  min-height:28px;
  padding:7px 10px;
  border-radius:999px;
  background:#f4f7fb;
  border:1px solid rgba(15,23,42,.075);
  color:#172033;
  font-size:11px;
  font-weight:900;
}

.article-product-card{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:22px;
  align-items:center;
  margin:32px 0;
  padding:28px;
  border-radius:30px;
  background:linear-gradient(135deg,#071827,#111827);
  color:#fff;
  box-shadow:0 24px 72px rgba(15,23,42,.16);
}

.article-product-card img{
  width:112px;
  height:112px;
  border-radius:30px;
  object-fit:contain;
  background:#fff;
  box-shadow:0 16px 40px rgba(0,0,0,.18);
}

.article-product-card h2{
  margin:0 0 10px!important;
  color:#fff!important;
}

.article-product-card p{
  color:rgba(255,255,255,.78)!important;
}

.article-product-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:18px;
}

@media(max-width:1100px){
  .guide-inventory-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media(max-width:720px){
  .guide-inventory-grid,
  .article-product-card{
    grid-template-columns:1fr;
  }
}


/* v23.5 Guides hub UX repair: no more wall of cards */
.guides-hub-v235 .guides-hub-v235-page{max-width:1460px;}
.guides-hub-v235 .guides-hero-v235{padding-bottom:44px;}
.guides-hub-v235 .guide-feature-layout-v235{display:grid;grid-template-columns:1.15fr .85fr;gap:18px;}
.guides-hub-v235 .guide-feature-card-v235{position:relative;isolation:isolate;overflow:hidden;min-height:330px;padding:30px;border-radius:34px;background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(248,252,255,.94));border:1px solid rgba(15,23,42,.075);box-shadow:0 24px 76px rgba(15,23,42,.075);}
.guides-hub-v235 .guide-feature-card-v235:first-child{grid-row:span 2;min-height:520px;padding:38px;background:linear-gradient(135deg,#071827,#111827 68%,#243147);color:#fff;}
.guides-hub-v235 .guide-feature-card-v235::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 12% 10%,rgba(42,210,220,.14),transparent 34%),linear-gradient(135deg,rgba(11,92,171,.035),transparent 44%);pointer-events:none;z-index:0;}
.guides-hub-v235 .guide-feature-card-v235:first-child::before{background:radial-gradient(circle at 14% 12%,rgba(42,210,220,.22),transparent 36%),radial-gradient(circle at 88% 12%,rgba(255,210,120,.12),transparent 34%);}
.guides-hub-v235 .guide-feature-card-v235>*:not(.guide-card-hitarea){position:relative;z-index:2;}
.guides-hub-v235 .guide-card-hitarea{position:absolute;inset:0;z-index:1;border-radius:inherit;text-decoration:none;}
.guides-hub-v235 .guide-feature-card-v235 h3{margin:34px 0 14px;max-width:800px;font-size:clamp(34px,4vw,62px);line-height:.94;letter-spacing:-.065em;}
.guides-hub-v235 .guide-feature-card-v235:first-child h3{margin-top:110px;font-size:clamp(48px,6vw,82px);line-height:.88;}
.guides-hub-v235 .guide-feature-card-v235 h3 a{color:#071120;text-decoration:none;}
.guides-hub-v235 .guide-feature-card-v235 h3 a:hover{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:5px;}
.guides-hub-v235 .guide-feature-card-v235:first-child h3 a{color:#fff;}
.guides-hub-v235 .guide-feature-card-v235 p{color:#5b6a7e;line-height:1.5;font-size:17px;}
.guides-hub-v235 .guide-feature-card-v235:first-child p{color:rgba(255,255,255,.75);font-size:20px;}
.guides-hub-v235 .guide-feature-card-v235:first-child .guide-category-pill,.guides-hub-v235 .guide-feature-card-v235:first-child .guide-related-pill{background:rgba(255,255,255,.12);color:#d8ecff;border-color:rgba(255,255,255,.18);}
.guides-hub-v235 .guide-related-pill{display:inline-flex;align-items:center;min-height:32px;padding:7px 11px;border-radius:999px;font-size:11px;font-weight:900;letter-spacing:.06em;color:#172033;background:#fff;border:1px solid rgba(15,23,42,.08);}
.guides-hub-v235 .guide-card-actions-v235{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:26px;position:relative;z-index:3;}
.guides-hub-v235 .guide-app-link{color:#0b5cab;font-weight:900;text-decoration:none;}
.guides-hub-v235 .guide-feature-card-v235:first-child .guide-app-link{color:#d8ecff;}
.guides-hub-v235 .guide-index-section-v235{margin-top:96px;}
.guides-hub-v235 .guide-index-group-v235{margin-top:54px;padding:26px;border-radius:36px;background:rgba(255,255,255,.56);border:1px solid rgba(15,23,42,.055);box-shadow:0 22px 70px rgba(15,23,42,.045);}
.guides-hub-v235 .guide-index-group-head{display:flex;align-items:end;justify-content:space-between;gap:18px;margin-bottom:18px;}
.guides-hub-v235 .guide-index-group-head h3{margin:0;color:#071120;font-size:clamp(34px,4.5vw,60px);line-height:.92;letter-spacing:-.065em;}
.guides-hub-v235 .guide-index-group-head p{margin:0;color:#64748b;font-weight:850;}
.guides-hub-v235 .guide-index-list-v235{display:grid;gap:10px;}
.guides-hub-v235 .guide-index-row{position:relative;isolation:isolate;display:grid;grid-template-columns:82px minmax(0,1fr) auto;align-items:center;gap:18px;min-height:126px;padding:18px 18px 18px 20px;border-radius:24px;background:rgba(255,255,255,.92);border:1px solid rgba(15,23,42,.065);box-shadow:0 12px 34px rgba(15,23,42,.035);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;}
.guides-hub-v235 .guide-index-row:hover{transform:translateY(-2px);box-shadow:0 22px 62px rgba(15,23,42,.075);border-color:rgba(11,92,171,.18);}
.guides-hub-v235 .guide-row-hitarea{position:absolute;inset:0;z-index:1;border-radius:inherit;text-decoration:none;}
.guides-hub-v235 .guide-index-row>*:not(.guide-row-hitarea){position:relative;z-index:2;}
.guides-hub-v235 .guide-index-marker{width:64px;height:64px;display:grid;place-items:center;border-radius:20px;background:linear-gradient(180deg,#eefaff,#f8fbff);border:1px solid rgba(15,23,42,.075);color:#0b5cab;font-size:11px;font-weight:950;letter-spacing:.08em;text-transform:uppercase;}
.guides-hub-v235 .guide-index-body h4{margin:0 0 7px;font-size:27px;line-height:1;letter-spacing:-.045em;}
.guides-hub-v235 .guide-index-body h4 a{color:#071120;text-decoration:none;}
.guides-hub-v235 .guide-index-body h4 a:hover{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px;}
.guides-hub-v235 .guide-index-body p{max-width:900px;margin:0;color:#5b6a7e;line-height:1.42;font-size:15.5px;}
.guides-hub-v235 .guide-index-meta{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px;}
.guides-hub-v235 .guide-index-meta a,.guides-hub-v235 .guide-index-meta span{display:inline-flex;align-items:center;min-height:26px;padding:6px 9px;border-radius:999px;background:#f4f7fb;border:1px solid rgba(15,23,42,.075);color:#172033;font-size:11px;font-weight:900;text-decoration:none;}
.guides-hub-v235 .guide-index-meta a{color:#0b5cab;}
.guides-hub-v235 .guide-index-arrow{justify-self:end;display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:0 16px;border-radius:999px;background:#071120;color:#fff;font-weight:950;text-decoration:none;white-space:nowrap;position:relative;z-index:3;}
.guides-hub-v235 .guides-strategy-v235{margin-top:86px;}
@media(max-width:980px){.guides-hub-v235 .guide-feature-layout-v235{grid-template-columns:1fr}.guides-hub-v235 .guide-feature-card-v235:first-child{min-height:420px}.guides-hub-v235 .guide-feature-card-v235:first-child h3{margin-top:70px}.guides-hub-v235 .guide-index-row{grid-template-columns:1fr}.guides-hub-v235 .guide-index-marker{width:auto;height:auto;justify-self:start;padding:8px 11px;border-radius:999px}.guides-hub-v235 .guide-index-arrow{justify-self:start}}


/* v23.6 Guides index cleanup: remove repetitive GUIDE badge */
.guides-hub-v236 .guide-index-row{
  grid-template-columns:minmax(0,1fr) auto;
  padding:24px 24px 24px 30px;
  min-height:118px;
}

.guides-hub-v236 .guide-index-marker{
  display:none!important;
}

.guides-hub-v236 .guide-index-body h4{
  font-size:29px;
}

.guides-hub-v236 .guide-index-body p{
  max-width:980px;
}

@media(max-width:980px){
  .guides-hub-v236 .guide-index-row{
    grid-template-columns:1fr;
    padding:24px;
  }
}


/* v23.7 Featured guides proportion correction */
.guides-hub-v237 .guide-feature-layout-v235{
  grid-template-columns:1fr 1fr;
  align-items:stretch;
}

.guides-hub-v237 .guide-feature-card-v235{
  min-height:315px;
}

.guides-hub-v237 .guide-feature-card-v235:first-child{
  grid-row:auto;
  min-height:410px;
  padding:34px;
}

.guides-hub-v237 .guide-feature-card-v235:first-child h3{
  margin-top:74px;
  font-size:clamp(42px,5vw,68px);
  line-height:.9;
}

.guides-hub-v237 .guide-feature-card-v235:first-child p{
  font-size:18px;
  max-width:660px;
}

.guides-hub-v237 .guide-feature-card-v235 h3{
  font-size:clamp(32px,3.6vw,52px);
}

.guides-hub-v237 .guide-feature-card-v235:nth-child(4){
  grid-column:1 / -1;
  min-height:260px;
  display:grid;
  align-content:center;
}

.guides-hub-v237 .guide-feature-card-v235:nth-child(4) h3{
  max-width:820px;
  margin-top:26px;
}

@media(max-width:980px){
  .guides-hub-v237 .guide-feature-layout-v235{
    grid-template-columns:1fr;
  }

  .guides-hub-v237 .guide-feature-card-v235:first-child{
    min-height:360px;
  }

  .guides-hub-v237 .guide-feature-card-v235:first-child h3{
    margin-top:58px;
  }

  .guides-hub-v237 .guide-feature-card-v235:nth-child(4){
    grid-column:auto;
  }
}


/* v24.2 SunPath App Store link and promo video */
.app-video-section,
.featured-video-section{
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(300px,.55fr);
  gap:28px;
  align-items:center;
  margin:86px 0;
  padding:34px;
  border-radius:38px;
  background:linear-gradient(135deg,#071827,#111827 70%,#243147);
  color:#fff;
  box-shadow:0 28px 86px rgba(15,23,42,.16);
  overflow:hidden;
}

.app-video-section h2,
.featured-video-section h2{
  color:#fff;
  font-size:clamp(36px,5vw,66px);
  line-height:.92;
  letter-spacing:-.065em;
  margin:10px 0 14px;
}

.app-video-section p,
.featured-video-section p{
  color:rgba(255,255,255,.74);
  font-size:18px;
  line-height:1.5;
}

.app-video-actions,
.featured-video-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:24px;
}

.app-video-frame,
.featured-video-frame{
  justify-self:center;
  width:min(100%,310px);
  border-radius:34px;
  overflow:hidden;
  background:#000;
  border:1px solid rgba(255,255,255,.14);
  box-shadow:0 24px 70px rgba(0,0,0,.28);
}

.app-video-frame video,
.featured-video-frame video{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:9/16;
  object-fit:cover;
}

@media(max-width:880px){
  .app-video-section,
  .featured-video-section{
    grid-template-columns:1fr;
  }

  .app-video-frame,
  .featured-video-frame{
    justify-self:start;
    max-width:260px;
  }
}


/* v24.3 SunPath launch polish */
.sunpath-launch-badge,
.launch-badge{
  display:inline-flex;
  align-items:center;
  min-height:32px;
  padding:7px 12px;
  border-radius:999px;
  background:#071120;
  color:#fff;
  font-size:11px;
  font-weight:950;
  letter-spacing:.08em;
  text-transform:uppercase;
  margin-bottom:18px;
}

.sunpath-launch-strip{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  gap:22px;
  align-items:center;
  margin:34px 0 70px;
  padding:24px;
  border-radius:32px;
  background:linear-gradient(135deg,#071827,#111827 72%,#243147);
  color:#fff;
  box-shadow:0 24px 72px rgba(15,23,42,.16);
}

.sunpath-launch-strip img{
  width:86px;
  height:86px;
  object-fit:contain;
  border-radius:24px;
  background:#fff;
  box-shadow:0 18px 48px rgba(0,0,0,.18);
}

.sunpath-launch-strip .kicker{
  color:#92dcff;
}

.sunpath-launch-strip h2{
  color:#fff;
  margin:4px 0 6px;
  font-size:36px;
  line-height:1;
  letter-spacing:-.055em;
}

.sunpath-launch-strip p{
  color:rgba(255,255,255,.74);
  margin:0;
  font-size:17px;
  line-height:1.42;
}

.sunpath-launch-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  justify-content:flex-end;
}

@media(max-width:780px){
  .sunpath-launch-strip{
    grid-template-columns:1fr;
  }

  .sunpath-launch-actions{
    justify-content:flex-start;
  }
}


/* v24.4 Official App Store badge polish */
.app-store-badge-link{
  display:inline-flex;
  align-items:center;
  width:180px;
  max-width:100%;
  line-height:0;
  text-decoration:none!important;
  position:relative;
  z-index:3;
}

.app-store-badge-link img{
  display:block;
  width:100%;
  height:auto;
  max-height:54px;
}

.hero-app-store-badge{
  margin-top:22px;
}

.app-video-actions .app-store-badge-link,
.featured-video-actions .app-store-badge-link,
.sunpath-launch-actions .app-store-badge-link{
  width:176px;
}

.sunpath-launch-strip .app-store-badge-link{
  width:164px;
}

@media(max-width:780px){
  .app-store-badge-link{
    width:168px;
  }
}


/* v25 Homepage / global navigation polish */
.homepage-nav-v25 .site-header,
.homepage-nav-v25 header.site-header,
.homepage-nav-v25 .top-nav,
.homepage-nav-v25 .nav-shell{
  backdrop-filter: blur(22px) saturate(1.1);
}

.homepage-nav-v25 .site-header nav,
.homepage-nav-v25 header nav{
  gap:6px;
}

.homepage-nav-v25 .nav-link-v25{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:38px;
  padding:0 13px;
  border-radius:999px;
  font-size:15px;
  font-weight:780;
  letter-spacing:-.012em;
  line-height:1;
  color:rgba(255,255,255,.82);
  text-decoration:none;
  transition:
    color .18s ease,
    background .18s ease,
    transform .18s ease,
    box-shadow .18s ease;
}

.homepage-nav-v25 .nav-link-v25:hover,
.homepage-nav-v25 .nav-link-v25:focus-visible{
  color:#fff;
  background:rgba(255,255,255,.10);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);
  transform:translateY(-1px);
  outline:none;
}

.homepage-nav-v25 .nav-link-v25[href="/apps/"],
.homepage-nav-v25 .nav-link-v25[href="/guides/"]{
  font-weight:850;
}

.homepage-nav-v25 .linkedin-mark-v25{
  display:grid!important;
  place-items:center;
  width:42px;
  height:42px;
  padding:0!important;
  border-radius:14px!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  overflow:visible;
  transition:transform .18s ease, filter .18s ease;
}

.homepage-nav-v25 .linkedin-mark-v25 img{
  width:34px;
  height:34px;
  display:block;
  border-radius:10px;
  box-shadow:0 8px 24px rgba(10,102,194,.18);
}

.homepage-nav-v25 .linkedin-mark-v25:hover,
.homepage-nav-v25 .linkedin-mark-v25:focus-visible{
  transform:translateY(-1px) scale(1.035);
  filter:saturate(1.1);
  outline:none;
}

.homepage-nav-v25 .hero .button,
.homepage-nav-v25 .page-hero .button{
  font-weight:880;
}

@media(max-width:780px){
  .homepage-nav-v25 .nav-link-v25{
    min-height:34px;
    padding:0 10px;
    font-size:14px;
  }

  .homepage-nav-v25 .linkedin-mark-v25{
    width:38px;
    height:38px;
  }

  .homepage-nav-v25 .linkedin-mark-v25 img{
    width:31px;
    height:31px;
  }
}


/* v25.1 Homepage hero micro-polish */
.home-hero-v251 .hero,
.home-hero-v251 .home-hero{
  padding-top:clamp(94px,10vw,150px);
}

.home-hero-v251 .hero h1,
.home-hero-v251 .home-hero h1{
  margin-top:0;
}


/* v25.2 Homepage spacing + glass navigation polish */
.nav-glass-v252 .site-header,
.nav-glass-v252 header.site-header,
.nav-glass-v252 .top-nav,
.nav-glass-v252 .nav-shell{
  background:
    linear-gradient(180deg,rgba(13,18,28,.76),rgba(8,13,22,.66))!important;
  border:1px solid rgba(255,255,255,.13)!important;
  box-shadow:
    0 22px 70px rgba(0,0,0,.28),
    inset 0 1px 0 rgba(255,255,255,.12),
    inset 0 -1px 0 rgba(255,255,255,.04)!important;
  backdrop-filter:blur(26px) saturate(1.28)!important;
  -webkit-backdrop-filter:blur(26px) saturate(1.28)!important;
}

.nav-glass-v252 .site-header::before,
.nav-glass-v252 header.site-header::before,
.nav-glass-v252 .top-nav::before,
.nav-glass-v252 .nav-shell::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:
    radial-gradient(circle at 8% 0%,rgba(74,210,255,.12),transparent 26%),
    radial-gradient(circle at 92% 0%,rgba(255,255,255,.08),transparent 24%);
  pointer-events:none;
}

.nav-glass-v252 .site-header,
.nav-glass-v252 header.site-header,
.nav-glass-v252 .top-nav,
.nav-glass-v252 .nav-shell{
  position:relative;
  overflow:hidden;
}

.nav-glass-v252 .site-header > *,
.nav-glass-v252 header.site-header > *,
.nav-glass-v252 .top-nav > *,
.nav-glass-v252 .nav-shell > *{
  position:relative;
  z-index:1;
}

.nav-glass-v252 .nav-link-v25{
  color:rgba(255,255,255,.86);
  text-shadow:0 1px 8px rgba(0,0,0,.18);
}

.nav-glass-v252 .nav-link-v25:hover,
.nav-glass-v252 .nav-link-v25:focus-visible{
  background:rgba(255,255,255,.12);
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.11),
    0 8px 22px rgba(0,0,0,.10);
}

.home-gap-v252 main > section:first-of-type,
.home-gap-v252 .hero,
.home-gap-v252 .home-hero{
  padding-bottom:clamp(54px,6vw,86px)!important;
  margin-bottom:0!important;
}

.home-gap-v252 .hero + section,
.home-gap-v252 .home-hero + section,
.home-gap-v252 main > section:first-of-type + section{
  margin-top:clamp(34px,4vw,58px)!important;
  padding-top:clamp(36px,5vw,72px)!important;
}

/* Target the portfolio/showcase block after the homepage hero without changing other pages. */
.home-gap-v252 .home-apps-section,
.home-gap-v252 .portfolio-section,
.home-gap-v252 .featured-apps-section,
.home-gap-v252 .app-showcase-section{
  margin-top:clamp(34px,4vw,58px)!important;
  padding-top:clamp(36px,5vw,72px)!important;
}

@media(max-width:780px){
  .home-gap-v252 main > section:first-of-type,
  .home-gap-v252 .hero,
  .home-gap-v252 .home-hero{
    padding-bottom:48px!important;
  }

  .home-gap-v252 .hero + section,
  .home-gap-v252 .home-hero + section,
  .home-gap-v252 main > section:first-of-type + section{
    margin-top:28px!important;
    padding-top:40px!important;
  }
}


/* v25.3 Footer readability fix after glass nav polish */
/* Keep glass styling on the top header only; restore footer/nav links below the page. */
.nav-footer-fix-v253 footer,
.nav-footer-fix-v253 .site-footer,
.nav-footer-fix-v253 footer *,
.nav-footer-fix-v253 .site-footer *{
  text-shadow:none!important;
}

.nav-footer-fix-v253 footer a,
.nav-footer-fix-v253 .site-footer a,
.nav-footer-fix-v253 footer .nav-link-v25,
.nav-footer-fix-v253 .site-footer .nav-link-v25{
  color:#66748a!important;
  background:transparent!important;
  box-shadow:none!important;
  transform:none!important;
  border:0!important;
  text-decoration:none!important;
  font-weight:720!important;
  letter-spacing:-.012em!important;
  padding:0!important;
  min-height:auto!important;
  display:inline-flex;
}

.nav-footer-fix-v253 footer a:hover,
.nav-footer-fix-v253 .site-footer a:hover,
.nav-footer-fix-v253 footer a:focus-visible,
.nav-footer-fix-v253 .site-footer a:focus-visible{
  color:#071120!important;
  text-decoration:none!important;
  outline:none;
}

.nav-footer-fix-v253 footer h2,
.nav-footer-fix-v253 footer h3,
.nav-footer-fix-v253 footer h4,
.nav-footer-fix-v253 .site-footer h2,
.nav-footer-fix-v253 .site-footer h3,
.nav-footer-fix-v253 .site-footer h4{
  color:#071120!important;
}

.nav-footer-fix-v253 footer p,
.nav-footer-fix-v253 .site-footer p{
  color:#66748a!important;
}

.nav-footer-fix-v253 footer .linkedin-mark-v25,
.nav-footer-fix-v253 .site-footer .linkedin-mark-v25{
  width:44px!important;
  height:44px!important;
  padding:0!important;
  background:transparent!important;
}

.nav-footer-fix-v253 footer .linkedin-mark-v25 img,
.nav-footer-fix-v253 .site-footer .linkedin-mark-v25 img{
  width:40px!important;
  height:40px!important;
  box-shadow:0 10px 28px rgba(10,102,194,.14)!important;
}

/* Extra specificity: glass treatment should only visually apply to the top header/nav shell. */
.nav-footer-fix-v253 body > header.site-header,
.nav-footer-fix-v253 body > .site-header,
.nav-footer-fix-v253 body > .top-nav,
.nav-footer-fix-v253 body > .nav-shell{
  backdrop-filter:blur(26px) saturate(1.28);
  -webkit-backdrop-filter:blur(26px) saturate(1.28);
}


/* v26 Export & Productivity article batch */
.article-v26 .article-intent-box{
  background:linear-gradient(180deg,#f7fbff,#ffffff);
}

.article-v26 .article-main h2{
  scroll-margin-top:110px;
}


/* v26.1 Article app product cards */
.article-app-product-card{
  margin:34px 0;
}

.article-app-product-card .article-app-store-badge{
  width:160px;
}

.article-app-product-card .article-product-actions{
  align-items:center;
}

.article-app-product-card > img{
  object-fit:contain;
}


/* v26.2 Photos, Media, and Files article batch */
.article-v262 .article-app-product-card{
  margin:34px 0;
}

.article-v262 .article-app-product-card .article-app-store-badge{
  width:160px;
}


/* v26.3 Files, Export, and Video article batch */
.article-v263 .article-app-product-card{
  margin:34px 0;
}
.article-v263 .article-app-product-card .article-app-store-badge{
  width:160px;
}


/* v26.4 Video and PDF article batch */
.article-v264 .article-app-product-card{
  margin:34px 0;
}

.article-v264 .article-app-product-card .article-app-store-badge{
  width:160px;
}

.article-secondary-app-card{
  margin-top:-14px;
  background:linear-gradient(180deg,#ffffff,#f8fbff);
}


/* v26.5 Final strong article batch */
.article-v265 .article-app-product-card{
  margin:34px 0;
}

.article-v265 .article-app-product-card .article-app-store-badge{
  width:160px;
}


/* v26.6 Final placeholder cleanup batch */
.article-v266 .article-app-product-card{
  margin:34px 0;
}

.article-v266 .article-app-product-card .article-app-store-badge{
  width:160px;
}


/* v27.0 UI polish: app CTAs, SunPath banner alignment, homepage title spacing */

/* App-page hero CTA row: keep App Store badge + Support visually balanced and readable. */
.ui-polish-v27 .app-hero a[href^="mailto:"],
.ui-polish-v27 .app-hero a[href*="support"],
.ui-polish-v27 .app-hero .button.secondary,
.ui-polish-v27 .app-hero .secondary,
.ui-polish-v27 .app-detail-hero a[href^="mailto:"],
.ui-polish-v27 .app-detail-hero a[href*="support"],
.ui-polish-v27 .app-detail-hero .button.secondary,
.ui-polish-v27 .app-detail-hero .secondary,
.ui-polish-v27 .hero a[href^="mailto:"],
.ui-polish-v27 .hero a[href*="support"]{
  color:#071120!important;
  background:rgba(255,255,255,.92)!important;
  border:1px solid rgba(7,17,32,.14)!important;
  box-shadow:
    0 14px 34px rgba(15,23,42,.10),
    inset 0 1px 0 rgba(255,255,255,.75)!important;
  text-shadow:none!important;
  opacity:1!important;
  font-weight:850!important;
  backdrop-filter:blur(14px) saturate(1.15)!important;
  -webkit-backdrop-filter:blur(14px) saturate(1.15)!important;
}

.ui-polish-v27 .app-hero a[href^="mailto:"]:hover,
.ui-polish-v27 .app-hero a[href*="support"]:hover,
.ui-polish-v27 .app-hero .button.secondary:hover,
.ui-polish-v27 .app-detail-hero a[href^="mailto:"]:hover,
.ui-polish-v27 .app-detail-hero a[href*="support"]:hover,
.ui-polish-v27 .app-detail-hero .button.secondary:hover,
.ui-polish-v27 .hero a[href^="mailto:"]:hover,
.ui-polish-v27 .hero a[href*="support"]:hover{
  transform:translateY(-1px);
  background:#fff!important;
  box-shadow:
    0 18px 42px rgba(15,23,42,.14),
    inset 0 1px 0 rgba(255,255,255,.85)!important;
}

/* Preserve the official App Store badge sizing and prevent neighboring CTAs from drifting. */
.ui-polish-v27 .app-store-badge-link,
.ui-polish-v27 a.app-store-badge-link{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  line-height:0!important;
  vertical-align:middle!important;
}

.ui-polish-v27 .app-store-badge-link img,
.ui-polish-v27 a.app-store-badge-link img{
  display:block!important;
  height:auto!important;
  max-height:54px!important;
}

/* Shared CTA rows: center button groups instead of letting one badge visually pull the row off-balance. */
.ui-polish-v27 .app-hero-actions,
.ui-polish-v27 .hero-actions,
.ui-polish-v27 .app-actions,
.ui-polish-v27 .launch-actions,
.ui-polish-v27 .sunpath-launch-actions,
.ui-polish-v27 .app-promo-actions,
.ui-polish-v27 .featured-app-actions{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:16px!important;
  flex-wrap:wrap!important;
}

/* Promo / SunPath banner: align the View button and App Store badge as one centered visual unit. */
.ui-polish-v27 .sunpath-launch-strip,
.ui-polish-v27 .sunpath-feature-strip,
.ui-polish-v27 .app-launch-strip,
.ui-polish-v27 .featured-launch-strip,
.ui-polish-v27 .new-on-app-store,
.ui-polish-v27 .launch-banner{
  align-items:center!important;
}

.ui-polish-v27 .sunpath-launch-strip .launch-actions,
.ui-polish-v27 .sunpath-feature-strip .launch-actions,
.ui-polish-v27 .app-launch-strip .launch-actions,
.ui-polish-v27 .featured-launch-strip .launch-actions,
.ui-polish-v27 .new-on-app-store .launch-actions,
.ui-polish-v27 .launch-banner .launch-actions,
.ui-polish-v27 .sunpath-launch-strip .app-promo-actions,
.ui-polish-v27 .app-launch-strip .app-promo-actions{
  justify-content:center!important;
  align-items:center!important;
  gap:18px!important;
  min-width:min(100%,430px);
}

.ui-polish-v27 .sunpath-launch-strip .button,
.ui-polish-v27 .sunpath-feature-strip .button,
.ui-polish-v27 .app-launch-strip .button,
.ui-polish-v27 .featured-launch-strip .button,
.ui-polish-v27 .new-on-app-store .button,
.ui-polish-v27 .launch-banner .button{
  min-height:54px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
}

/* Homepage: prevent the first post-hero section heading from being clipped by the hero fade/spacing. */
.ui-polish-v27.home-gap-v252 main > section:first-of-type + section,
.ui-polish-v27.home-gap-v252 .hero + section,
.ui-polish-v27.home-gap-v252 .home-hero + section{
  padding-top:clamp(76px,7vw,112px)!important;
  margin-top:0!important;
  overflow:visible!important;
}

.ui-polish-v27.home-gap-v252 main > section:first-of-type + section h2,
.ui-polish-v27.home-gap-v252 .hero + section h2,
.ui-polish-v27.home-gap-v252 .home-hero + section h2,
.ui-polish-v27 .home-apps-section h2,
.ui-polish-v27 .portfolio-section h2,
.ui-polish-v27 .featured-apps-section h2,
.ui-polish-v27 .app-showcase-section h2{
  line-height:1.04!important;
  padding-top:.12em!important;
  margin-top:0!important;
  overflow:visible!important;
  text-wrap:balance;
}

/* Extra specificity for the homepage showcase title visible in the screenshot. */
.ui-polish-v27 h2:has(+ p),
.ui-polish-v27 .section-title,
.ui-polish-v27 .section-heading{
  overflow:visible!important;
}

@media(max-width:780px){
  .ui-polish-v27 .app-hero-actions,
  .ui-polish-v27 .hero-actions,
  .ui-polish-v27 .app-actions,
  .ui-polish-v27 .launch-actions,
  .ui-polish-v27 .sunpath-launch-actions,
  .ui-polish-v27 .app-promo-actions,
  .ui-polish-v27 .featured-app-actions{
    justify-content:flex-start!important;
    gap:12px!important;
  }

  .ui-polish-v27.home-gap-v252 main > section:first-of-type + section,
  .ui-polish-v27.home-gap-v252 .hero + section,
  .ui-polish-v27.home-gap-v252 .home-hero + section{
    padding-top:64px!important;
  }
}


/* v27.1 Studio structure + global footer link spacing */

.studio-v271 .studio-page-v271{
  padding-top:clamp(84px,10vw,138px);
  padding-bottom:clamp(96px,12vw,160px);
}

.studio-v271 .studio-hero-v271{
  max-width:860px;
  margin:0 auto clamp(42px,6vw,72px);
}

.studio-v271 .studio-hero-v271 h1{
  max-width:820px;
  line-height:.94;
  letter-spacing:-.075em;
  margin:18px 0 24px;
}

.studio-v271 .hero-lead,
.studio-v271 .section-lead{
  color:#53647b;
  font-size:clamp(1.06rem,1.5vw,1.28rem);
  line-height:1.58;
  max-width:760px;
}

.studio-v271 .studio-identity-card-v271{
  display:grid;
  grid-template-columns:minmax(220px,.72fr) 1fr;
  gap:34px;
  align-items:center;
  max-width:900px;
  margin:0 auto 28px;
  padding:34px;
  border-radius:34px;
  background:
    radial-gradient(circle at 14% 18%, rgba(139,232,255,.22), transparent 36%),
    linear-gradient(135deg,#071120,#172033 54%,#071120);
  color:#fff;
  box-shadow:0 34px 82px rgba(15,23,42,.18);
  overflow:hidden;
}

.studio-v271 .studio-mark-panel-v271{
  min-height:230px;
  border-radius:28px;
  border:1px solid rgba(255,255,255,.18);
  background:
    radial-gradient(circle at 30% 24%, rgba(255,255,255,.22), transparent 22%),
    linear-gradient(135deg,rgba(255,255,255,.10),rgba(255,255,255,.04));
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18);
}

.studio-v271 .studio-mark-panel-v271 img{
  width:118px;
  height:118px;
  object-fit:contain;
  filter:drop-shadow(0 18px 28px rgba(0,0,0,.22));
}

.studio-v271 .studio-identity-copy-v271 h2{
  color:#fff;
  line-height:1.02;
  letter-spacing:-.06em;
  margin:12px 0 18px;
  font-size:clamp(2.2rem,4vw,4.4rem);
}

.studio-v271 .studio-identity-copy-v271 p{
  color:rgba(255,255,255,.78);
  font-size:1.04rem;
  line-height:1.65;
  max-width:560px;
}

.studio-v271 .studio-principles-v271{
  max-width:900px;
  margin:0 auto clamp(66px,8vw,104px);
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}

.studio-v271 .studio-principle-card-v271,
.studio-v271 .studio-build-card-v271,
.studio-v271 .studio-path-card-v271{
  background:rgba(255,255,255,.86);
  border:1px solid rgba(7,17,32,.08);
  box-shadow:0 22px 54px rgba(15,23,42,.08);
  border-radius:26px;
}

.studio-v271 .studio-principle-card-v271{
  padding:30px 28px;
}

.studio-v271 .studio-principle-card-v271 h3,
.studio-v271 .studio-build-card-v271 h3,
.studio-v271 .studio-path-card-v271 h3{
  margin:0 0 10px;
  letter-spacing:-.035em;
  color:#071120;
}

.studio-v271 .studio-principle-card-v271 p,
.studio-v271 .studio-build-card-v271 p,
.studio-v271 .studio-path-card-v271 p{
  margin:0;
  color:#53647b;
  line-height:1.55;
}

.studio-v271 .studio-build-v271,
.studio-v271 .studio-paths-v271{
  max-width:1050px;
  margin:0 auto clamp(72px,8vw,110px);
}

.studio-v271 .studio-build-v271 h2,
.studio-v271 .studio-paths-v271 h2{
  line-height:1.02;
  letter-spacing:-.065em;
  margin:14px 0 18px;
  max-width:780px;
}

.studio-v271 .studio-build-grid-v271{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
  margin-top:34px;
}

.studio-v271 .studio-build-card-v271{
  padding:28px;
}

.studio-v271 .studio-path-grid-v271{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
  margin-top:34px;
}

.studio-v271 .studio-path-card-v271{
  padding:30px;
  display:block;
  text-decoration:none;
  color:inherit;
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.studio-v271 .studio-path-card-v271:hover{
  transform:translateY(-3px);
  border-color:rgba(10,102,194,.24);
  box-shadow:0 28px 64px rgba(15,23,42,.12);
}

.studio-v271 .studio-path-card-v271 span{
  display:inline-flex;
  margin-top:22px;
  color:#0057b8;
  font-weight:850;
}

/* Global footer spacing/readability fix. Avoid words visually merging like Featured AppsBundles. */
.ui-polish-v27 footer a,
.ui-polish-v27 .site-footer a,
.studio-v271 footer a,
.studio-v271 .site-footer a{
  display:inline-flex;
  align-items:center;
  margin-right:18px!important;
  margin-bottom:10px!important;
  white-space:nowrap!important;
  line-height:1.35!important;
}

.ui-polish-v27 footer li,
.ui-polish-v27 .site-footer li,
.studio-v271 footer li,
.studio-v271 .site-footer li{
  margin-bottom:10px!important;
}

.ui-polish-v27 footer nav,
.ui-polish-v27 .site-footer nav,
.studio-v271 footer nav,
.studio-v271 .site-footer nav{
  display:flex;
  flex-wrap:wrap;
  gap:10px 18px;
}

.ui-polish-v27 footer .footer-links,
.ui-polish-v27 .site-footer .footer-links,
.studio-v271 footer .footer-links,
.studio-v271 .site-footer .footer-links{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:10px 18px!important;
}

@media(max-width:860px){
  .studio-v271 .studio-identity-card-v271,
  .studio-v271 .studio-principles-v271,
  .studio-v271 .studio-build-grid-v271,
  .studio-v271 .studio-path-grid-v271{
    grid-template-columns:1fr;
  }

  .studio-v271 .studio-identity-card-v271{
    padding:24px;
  }

  .studio-v271 .studio-mark-panel-v271{
    min-height:190px;
  }

  .studio-v271 .studio-build-v271,
  .studio-v271 .studio-paths-v271{
    margin-bottom:72px;
  }
}


/* v27.2 Studio visual polish: tighter hero spacing + elevated cards */

.studio-v272 .studio-page-v271{
  padding-top:clamp(46px,5.4vw,78px)!important;
}

/* Bring the Studio hero closer to the navigation without crowding it. */
.studio-v272 .studio-hero-v271{
  margin-bottom:clamp(34px,4.5vw,58px)!important;
}

.studio-v272 .studio-hero-v271 h1{
  margin-top:14px!important;
}

/* Make the principle cards feel intentional instead of plain white boxes. */
.studio-v272 .studio-principle-card-v271,
.studio-v272 .studio-build-card-v271,
.studio-v272 .studio-path-card-v271{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  background:
    radial-gradient(circle at 14% 0%, rgba(10,102,194,.105), transparent 38%),
    radial-gradient(circle at 98% 12%, rgba(139,232,255,.13), transparent 34%),
    linear-gradient(180deg,rgba(255,255,255,.96),rgba(247,250,255,.90))!important;
  border:1px solid rgba(7,17,32,.085)!important;
  box-shadow:
    0 24px 60px rgba(15,23,42,.085),
    inset 0 1px 0 rgba(255,255,255,.9)!important;
}

.studio-v272 .studio-principle-card-v271::after,
.studio-v272 .studio-build-card-v271::after,
.studio-v272 .studio-path-card-v271::after{
  content:"";
  position:absolute;
  inset:auto 18px 0 18px;
  height:3px;
  border-radius:999px 999px 0 0;
  background:linear-gradient(90deg,rgba(10,102,194,.0),rgba(10,102,194,.45),rgba(139,232,255,.3),rgba(10,102,194,.0));
  opacity:.72;
  z-index:-1;
}

.studio-v272 .studio-card-marker-v272{
  width:42px;
  height:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-bottom:18px;
  border-radius:16px;
  color:#0057b8;
  background:
    linear-gradient(180deg,rgba(255,255,255,.9),rgba(239,247,255,.82));
  border:1px solid rgba(10,102,194,.15);
  box-shadow:
    0 14px 32px rgba(10,102,194,.10),
    inset 0 1px 0 rgba(255,255,255,.86);
  font-size:.84rem;
  font-weight:900;
  letter-spacing:.02em;
}

.studio-v272 .studio-card-marker-symbol{
  font-size:1.18rem;
  color:#071120;
}

.studio-v272 .studio-card-marker-letter{
  color:#fff;
  background:
    radial-gradient(circle at 30% 20%,rgba(139,232,255,.38),transparent 38%),
    linear-gradient(135deg,#071120,#0a66c2);
  border-color:rgba(255,255,255,.22);
  box-shadow:
    0 16px 36px rgba(10,102,194,.18),
    inset 0 1px 0 rgba(255,255,255,.22);
}

.studio-v272 .studio-principle-card-v271{
  min-height:168px;
  padding:28px 28px 30px!important;
}

.studio-v272 .studio-build-card-v271{
  min-height:202px;
  padding:30px 30px 32px!important;
}

.studio-v272 .studio-principle-card-v271 h3,
.studio-v272 .studio-build-card-v271 h3,
.studio-v272 .studio-path-card-v271 h3{
  font-size:1.08rem;
  letter-spacing:-.04em;
}

.studio-v272 .studio-build-card-v271 p,
.studio-v272 .studio-principle-card-v271 p,
.studio-v272 .studio-path-card-v271 p{
  color:#485b74!important;
}

/* Make the Explore cards feel like navigation tiles, not text cards. */
.studio-v272 .studio-path-card-v271{
  min-height:220px;
  padding:32px!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:space-between!important;
}

.studio-v272 .studio-path-card-v271 span:not(.studio-card-marker-v272){
  align-self:flex-start;
  margin-top:24px!important;
  padding:11px 14px;
  border-radius:999px;
  background:rgba(10,102,194,.08);
  color:#004da3!important;
  border:1px solid rgba(10,102,194,.11);
}

.studio-v272 .studio-path-card-v271:hover span:not(.studio-card-marker-v272){
  background:#0057b8;
  color:#fff!important;
  border-color:#0057b8;
}

/* Slightly improve section rhythm after the identity card. */
.studio-v272 .studio-principles-v271{
  margin-bottom:clamp(60px,7vw,92px)!important;
}

.studio-v272 .studio-build-v271,
.studio-v272 .studio-paths-v271{
  margin-bottom:clamp(66px,7vw,96px)!important;
}

/* Add a subtle panel effect behind the build cards so the grid feels designed. */
.studio-v272 .studio-build-grid-v271{
  position:relative;
}

.studio-v272 .studio-build-grid-v271::before{
  content:"";
  position:absolute;
  inset:-18px;
  border-radius:36px;
  background:
    radial-gradient(circle at 15% 10%,rgba(10,102,194,.06),transparent 34%),
    radial-gradient(circle at 86% 35%,rgba(139,232,255,.08),transparent 38%);
  z-index:-1;
  pointer-events:none;
}

@media(max-width:860px){
  .studio-v272 .studio-page-v271{
    padding-top:38px!important;
  }

  .studio-v272 .studio-build-card-v271,
  .studio-v272 .studio-path-card-v271,
  .studio-v272 .studio-principle-card-v271{
    min-height:auto;
  }
}


/* v27.3 Studio refinement: tighter top spacing, remove numbered feel, cleaner nav icons */

/* Reduce the remaining empty space under the nav on Studio. */
.studio-v273 .studio-page-v271{
  padding-top:clamp(18px,2.8vw,38px)!important;
}

.studio-v273 .studio-hero-v271{
  margin-top:0!important;
  margin-bottom:clamp(30px,4vw,50px)!important;
}

.studio-v273 .studio-hero-v271 h1{
  margin-top:10px!important;
}

/* Remove numbered-marker spacing from the three principle cards. */
.studio-v273 .studio-principle-card-v271{
  padding:28px 30px 30px!important;
  min-height:150px!important;
}

.studio-v273 .studio-principle-card-v271 h3{
  margin-top:0!important;
}

/* Keep the build cards visual, but make the icons quieter and more premium. */
.studio-v273 .studio-build-card-v271 .studio-card-marker-v272{
  width:36px!important;
  height:36px!important;
  border-radius:14px!important;
  margin-bottom:16px!important;
  color:#0a4f9c!important;
  background:
    radial-gradient(circle at 28% 22%, rgba(139,232,255,.32), transparent 42%),
    linear-gradient(180deg,rgba(255,255,255,.92),rgba(240,247,255,.84))!important;
  border:1px solid rgba(10,102,194,.12)!important;
  box-shadow:
    0 12px 24px rgba(10,102,194,.08),
    inset 0 1px 0 rgba(255,255,255,.9)!important;
}

/* Replace the ugly blue square with cleaner symbolic icons. */
.studio-v273 .studio-path-icon-v273{
  width:46px;
  height:46px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-bottom:20px;
  border-radius:18px;
  background:
    radial-gradient(circle at 32% 22%, rgba(139,232,255,.42), transparent 42%),
    linear-gradient(145deg,#ffffff,#eef6ff 48%,#e6f1ff);
  border:1px solid rgba(10,102,194,.13);
  box-shadow:
    0 18px 38px rgba(10,102,194,.12),
    inset 0 1px 0 rgba(255,255,255,.95);
}

.studio-v273 .studio-path-icon-v273 svg{
  width:23px;
  height:23px;
  fill:none;
  stroke:#0057b8;
  stroke-width:1.85;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.studio-v273 .studio-path-card-v271{
  min-height:215px!important;
}

.studio-v273 .studio-path-card-v271:hover .studio-path-icon-v273{
  transform:translateY(-1px);
  background:
    radial-gradient(circle at 32% 22%, rgba(139,232,255,.50), transparent 42%),
    linear-gradient(145deg,#ffffff,#e9f4ff 48%,#dcecff);
  box-shadow:
    0 22px 46px rgba(10,102,194,.16),
    inset 0 1px 0 rgba(255,255,255,.95);
}

/* Keep the whole Studio page tighter and more intentional vertically. */
.studio-v273 .studio-principles-v271{
  margin-top:22px!important;
  margin-bottom:clamp(54px,6vw,78px)!important;
}

.studio-v273 .studio-build-v271{
  margin-bottom:clamp(58px,6vw,82px)!important;
}

.studio-v273 .studio-paths-v271{
  margin-bottom:clamp(64px,7vw,96px)!important;
}

@media(max-width:860px){
  .studio-v273 .studio-page-v271{
    padding-top:20px!important;
  }
}