/* About page. Same language as the pricing and features pages: centred two-tone headlines, design-system surfaces
   and rules (#111 page, #171717 cards, #262626 hairlines, 12px corners, flat), 14 to 16px reading text, and the
   shared 1120px column so everything lines up with the logo above and the footer below. */
.about-page{background:var(--surface-background,#111);color:var(--surface-foreground,#fff);font-family:'Eshlon Sans',sans-serif}
.about-main{padding:0 0 100px;border-bottom:1px solid var(--interactive-border,#262626)}
.about-main h1,.about-main h2,.about-main h3,.about-main p{margin:0}
.about-main h1,.about-main h2,.about-main h3{font-weight:500}
.about-main h1 span,.about-main h2 span,.about-belief span{color:#9b9b9b}

.about-hero{text-align:center;padding:72px 0 80px}
.about-hero h1{font-size:clamp(42px,5.8vw,76px);line-height:1.08;letter-spacing:-.055em;text-wrap:balance}

/* The founding belief, signed by the two founders. */
.about-founding{padding:72px 0;border-top:1px solid var(--interactive-border,#262626);text-align:center}
.about-founding-lead{font-size:15px;line-height:1.6;color:var(--surface-muted-foreground,#9e9e9e);margin-bottom:24px!important}
.about-belief{max-width:940px;margin:0 auto!important;font-size:clamp(26px,3.2vw,40px);line-height:1.2;font-weight:500;letter-spacing:-.04em;text-wrap:balance}
.about-founders{display:flex;justify-content:center;gap:16px 40px;flex-wrap:wrap;margin:40px 0 0;padding:0;list-style:none}
.about-founders li{display:flex;align-items:center;gap:12px;font-size:15px;font-weight:500;line-height:1.4}
.about-founders i{display:flex;align-items:center;justify-content:center;width:40px;height:40px;flex-shrink:0;border:1px solid var(--interactive-border,#262626);border-radius:50%;background:var(--surface-elevated,#1f1f1f);color:#c4c4c4;font-size:13px;font-style:normal;font-weight:500;letter-spacing:.02em}

/* What is being built: the statement on the left, its detail on the right, then four plain cells. */
.about-building{padding:72px 0 0;border-top:1px solid var(--interactive-border,#262626)}
.about-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:32px 64px;align-items:start}
.about-split h2,.about-beliefs>h2{font-size:clamp(30px,3.3vw,43px);line-height:1.15;letter-spacing:-.045em}
.about-split p{font-size:16px;line-height:1.75;color:#aaa}
.about-cells{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:56px;border-top:1px solid var(--interactive-border,#262626)}
.about-cells>div{padding:28px 28px 0;border-left:1px solid var(--interactive-border,#262626)}
.about-cells>div:first-child{padding-left:0;border-left:0}
.about-cells h3{font-size:18px;line-height:1.3;letter-spacing:-.02em;margin-bottom:8px}
.about-cells p{font-size:14px;line-height:1.6;color:var(--surface-muted-foreground,#9e9e9e)}

/* Beliefs: the pricing page's cards. The border brightens, the card lifts 2px and a soft light follows the pointer. */
.about-beliefs{padding:100px 0 0}
.about-beliefs>h2{margin-bottom:36px}
.about-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.about-card{position:relative;isolation:isolate;min-width:0;padding:28px;background:var(--surface-muted,#171717);border:1px solid var(--interactive-border,#262626);border-radius:12px;transition:transform 250ms var(--ease-out),border-color 250ms var(--ease-out)}
.about-card::after{content:'';position:absolute;inset:-1px;z-index:-1;border-radius:inherit;background:radial-gradient(440px circle at var(--mx,50%) var(--my,0px),#ffffff0f,transparent 65%);opacity:0;transition:opacity 250ms var(--ease-out);pointer-events:none}
@media(hover:hover){.about-card:hover{transform:translateY(-2px);border-color:var(--interactive-border-hover,#363636)}.about-card:hover::after{opacity:1}}
.about-card h3{font-size:22px;line-height:1.25;letter-spacing:-.03em;margin-bottom:16px;text-wrap:balance}
.about-card p{font-size:15px;line-height:1.7;color:#aaa}

/* Closing: the site's tagline, two ways in, and what the name stands for. */
.about-closing{margin-top:100px;padding:90px 0 0;border-top:1px solid var(--interactive-border,#262626);text-align:center}
.about-closing h2{font-size:clamp(38px,4.4vw,60px);line-height:1.1;letter-spacing:-.05em}
.about-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:32px}
.about-actions .btn{min-height:44px;height:auto;gap:8px;padding:11px 19px;font-size:14px;letter-spacing:.01em;corner-shape:squircle}
@supports(corner-shape:squircle){.about-actions .btn{border-radius:50px}}
.about-actions .btn .icon{width:16px;height:16px;transition:transform 240ms var(--ease-out)}
.about-actions .btn:hover .icon{transform:translateX(3px)}
.about-actions .btn.primary:active{background:var(--primary-active)}
.about-actions .btn:focus-visible{outline:2px solid var(--interactive-border-focus);outline-offset:3px}
.about-name{margin-top:40px!important;font-size:13px;line-height:1.6;color:#8a8a8a}
.about-name strong{font-weight:500;letter-spacing:.08em;color:#c4c4c4;margin-right:10px}

@media(max-width:1000px){.about-cells{grid-template-columns:repeat(2,minmax(0,1fr))}.about-cells>div{padding-bottom:28px}.about-cells>div:nth-child(odd){padding-left:0;border-left:0}.about-cells>div:nth-child(n+3){border-top:1px solid var(--interactive-border,#262626)}.about-cards{grid-template-columns:1fr}}
@media(max-width:760px){
 .about-main{padding-bottom:66px}
 .about-hero{padding:50px 0 55px}
 .about-hero h1{font-size:clamp(38px,8vw,58px)}
 .about-hero h1 br,.about-belief br,.about-split h2 br{display:none}
 .about-founding,.about-building{padding-top:48px}.about-founding{padding-bottom:48px}
 .about-founders{margin-top:32px}
 .about-split{grid-template-columns:1fr}
 .about-split p{font-size:15px}
 .about-cells{margin-top:40px}
 .about-beliefs{padding-top:66px}.about-beliefs>h2{margin-bottom:27px}
 .about-card{padding:24px}
 .about-closing{margin-top:66px;padding-top:60px}
}
@media(max-width:520px){.about-cells{grid-template-columns:1fr}.about-cells>div,.about-cells>div:nth-child(odd){padding:24px 0;border-left:0}.about-cells>div+div{border-top:1px solid var(--interactive-border,#262626)}.about-cells>div:last-child{padding-bottom:0}}
@media(prefers-reduced-motion:reduce){.about-card,.about-card::after,.about-actions .btn .icon{transition:none}.about-card:hover,.about-actions .btn:hover .icon{transform:none}}
