/*
Theme Name: Swiftly
Template: twentytwentyfive
Description: The Swiftly brand, as a block theme — the app's splash composition, tokens and typography, editable in the block editor.
Version: 2.0
*/

/* The app's two faces (apps/web/app/layout.tsx): Space Grotesk for display,
   Inter for everything else. */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Space+Grotesk:wght@500;700&display=swap');

/* The brand mark, identical to the app's lockup: Lucide rocket, white, in a
   gradient-accent tile with the accent glow (design-system/tokens.css
   --gradient-accent + --shadow-glow). */
.swiftly-mark {
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, hsl(24, 95%, 53%) 0%, hsl(38, 92%, 50%) 100%);
  box-shadow: 0 0 44px hsl(24 95% 53% / 0.45);
}
.swiftly-mark svg { stroke: #fff; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

.swiftly-mark--hero { width: 84px; height: 84px; border-radius: 21px; margin: 0 auto; }
.swiftly-mark--hero svg { width: 42px; height: 42px; }

.swiftly-mark--bar { width: 34px; height: 34px; border-radius: 9px; box-shadow: 0 0 20px hsl(24 95% 53% / 0.3); }
.swiftly-mark--bar svg { width: 18px; height: 18px; }

.swiftly-lockup { display: flex; align-items: center; gap: 10px; }
.swiftly-lockup .swiftly-word {
  font-family: 'Space Grotesk', -apple-system, BlinkMacSystemFont, sans-serif;
  font-weight: 700;
  font-size: 23px;
  letter-spacing: -0.01em;
  color: #fff;
  line-height: 1;
}
.swiftly-lockup a { text-decoration: none; }

/* Cards below the hero carry the app's card treatment: white, hairline
   border, the same soft lift (--shadow-card). */
.swiftly-card {
  background: #fff;
  border: 1px solid hsl(220 13% 91%);
  border-radius: 12px;
  padding: 22px 24px;
  box-shadow: 0 1px 3px hsl(222 47% 11% / 0.06);
}
.swiftly-card h3 {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 17px;
  font-weight: 700;
  margin: 0 0 6px;
  color: hsl(222 47% 11%);
}
.swiftly-card p { margin: 0; color: hsl(215 16% 47%); font-size: 15px; line-height: 1.55; }

/* An uppercase eyebrow, the same device the app's Home uses above a headline. */
.swiftly-eyebrow {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: hsl(24 95% 53%);
  margin: 0 0 10px;
}

/* Section intros share the grid's left edge — a nested constrained group
   centers itself and leaves prose floating right of its own cards. */
/* Cap the LINES, not the box. WordPress's constrained layout sets
   `margin-inline: auto !important` on every child, so a narrower wrapper
   gets re-centered 180px right of its own cards — unwinnable without
   !important. The wrapper stays full width; its contents hold the
   measure and stay flush left with the grid. */
.swiftly-intro > * { max-width: 760px; }