/* Three fictional brands, one connected digital presence. No remote UI assets. */
.formak-intro { padding-bottom: 44px; }
.formak-intro-note { display: flex; gap: 18px; align-items: center; margin-top: 32px; max-width: 650px; border-top: 1px solid var(--line); padding-top: 20px; }
.formak-intro-note > span { font-size: 2rem; color: var(--mint); }
.formak-intro-note > p { font-size: .85rem; color: var(--muted); }
.formak-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 24px; }
.forma-card { min-width: 0; --card-paper:#f5e7ce; --card-ink:#3e2a20; }
.forma-card--kert { --card-paper:#e5e9d8; --card-ink:#243d30; }
.forma-card--selyem { --card-paper:#f3e3e0; --card-ink:#5b3940; }
.forma-card-image { display:block; position:relative; aspect-ratio:4/5; overflow:hidden; background:var(--card-paper); color:#fff; border-radius:4px; }
.forma-card-image::after { content:''; position:absolute; inset:0; background:linear-gradient(180deg,#0002 10%,transparent 36%,#0009); pointer-events:none; }
.forma-card-image > img { display:block; width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
.forma-card-image:hover > img { transform:scale(1.035); }
.forma-card-badge { position:absolute; inset:18px 18px auto; z-index:1; display:flex; justify-content:space-between; font-size:.7rem; letter-spacing:.07em; text-transform:uppercase; }
.forma-card-brand { position:absolute; left:28px; right:20px; bottom:30px; z-index:1; font:400 clamp(2.8rem,4vw,4.5rem)/1 Georgia,serif; letter-spacing:-.05em; }
.forma-card--reggel .forma-card-brand { font-weight:700; }
.forma-card--kert .forma-card-brand { font-style:italic; }
.forma-card--selyem .forma-card-brand { letter-spacing:.025em; }
.forma-card-brand small { display:block; margin-top:12px; font:500 .65rem/1.5 var(--font-body); text-transform:uppercase; letter-spacing:.22em; }
.forma-card-info { padding:25px 0 12px; }
.forma-card-info .eyebrow { font-size:.6rem; line-height:1.7; }
.forma-card-info h3 { margin-top:14px; font-size:1.4rem; line-height:1.25; }
.forma-card-info > p:not(.eyebrow) { margin-top:15px; color:var(--muted); font-size:.88rem; line-height:1.75; }
.forma-card-info > .forma-card-platforms { padding-top:16px; border-top:1px solid var(--line); font-size:.68rem; }
.forma-card-info .text-link { display:inline-block; margin-top:24px; font-size:.85rem; }
.formak-index-next { padding-block:65px 95px; border-top:1px solid var(--line); }
.formak-index-next h2 { font-size:clamp(2rem,4vw,3.5rem); margin-block:22px; }
.formak-index-next > p:not(.eyebrow) { max-width:56ch; color:var(--muted); margin-bottom:28px; }
.formak-demo { --demo-paper:#f7eddc; --demo-ink:#3d2b22; --demo-soft:#ead9bf; --demo-accent:#a24725; --demo-border:#c4ad92; --demo-card:#fffbf3; --demo-on-accent:#fff6e6; background:var(--demo-paper); color:var(--demo-ink); }
.forma-kert { --demo-paper:#f2f0e6; --demo-ink:#263e31; --demo-soft:#e0e4d5; --demo-accent:#37543e; --demo-border:#b3b9a5; --demo-card:#fcfbf3; --demo-on-accent:#f6f2e5; }
.forma-selyem { --demo-paper:#fbf6f0; --demo-ink:#523a40; --demo-soft:#eee0dc; --demo-accent:#83555f; --demo-border:#d6bbb8; --demo-card:#fffcf9; --demo-on-accent:#fff6f3; }
.formak-demo .concept-toolbar { position:sticky; top:0; z-index:30; min-height:50px; padding:12px max(20px,calc((100vw - 1240px)/2)); gap:12px 25px; background:var(--bg); color:var(--text); }
.formak-demo .concept-toolbar p { font-size:.68rem; color:var(--muted); margin:0; }
.formak-demo .concept-toolbar a { font-size:.7rem; }
.formak-demo .concept-end { color:var(--text); }
.forma-demo-wrap { width:min(1240px,calc(100% - 80px)); margin-inline:auto; }
.forma-demo-nav { display:flex; justify-content:space-between; align-items:center; gap:25px; padding-block:36px; border-bottom:1px solid var(--demo-border); }
.forma-wordmark { font:700 3.4rem/.95 Georgia,serif; letter-spacing:-.065em; }
.forma-wordmark span { display:block; margin-top:12px; font:500 .55rem/1 var(--font-body); letter-spacing:.32em; }
.forma-kert .forma-wordmark { font-style:italic; font-weight:400; font-size:4.2rem; }
.forma-selyem .forma-wordmark { font-weight:400; font-size:3.2rem; letter-spacing:.035em; }
.forma-demo-nav nav { display:flex; align-items:center; flex-wrap:wrap; justify-content:flex-end; gap:18px 26px; font-size:.76rem; }
.forma-demo-nav nav a:last-child { border-bottom:1px solid var(--demo-ink); padding-block:8px; }
.forma-hero { display:grid; grid-template-columns:1fr 1.1fr; align-items:center; gap:60px; padding-block:64px 70px; }
.forma-hero-copy { min-width:0; }
.forma-kicker { font:600 .65rem/1.7 var(--font-body); letter-spacing:.15em; }
.formak-demo h1 { font:700 clamp(3rem,5.8vw,6.25rem)/1.07 Georgia,serif; letter-spacing:-.06em; margin-block:26px; padding-bottom:.08em; }
.formak-demo h1 em,.formak-demo h2 em { color:var(--demo-accent); font-weight:inherit; font-style:italic; }
.forma-hero-copy > p:not(.forma-kicker) { font-size:1rem; line-height:1.85; max-width:39ch; }
.forma-demo-button { display:inline-flex; align-items:center; justify-content:space-between; gap:32px; padding:17px 24px; background:var(--demo-ink); color:var(--demo-paper); border-radius:40px; font-size:.8rem; font-weight:600; margin-top:30px; }
.forma-demo-button:focus-visible,.forma-demo-nav a:focus-visible { outline:3px solid var(--demo-accent); outline-offset:5px; }
.forma-hero-photo { position:relative; min-width:0; margin:0; }
.forma-hero-photo > img { display:block; width:100%; aspect-ratio:1/1.12; object-fit:cover; border-radius:46% 46% 4px 4px; }
.forma-hero-photo figcaption { display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px; margin-top:14px; font-size:.57rem; text-transform:uppercase; letter-spacing:.1em; }
.forma-hero-stamp { position:absolute; left:-30px; bottom:70px; display:grid; place-items:center; width:115px; min-height:115px; padding:18px; border-radius:50%; background:var(--demo-accent); color:var(--demo-on-accent); font:italic 1.2rem/1.15 Georgia,serif; text-align:center; transform:rotate(-12deg); }
.forma-kert .forma-hero { grid-template-columns:1fr 1.22fr; gap:50px; }
.forma-kert h1 { font-weight:400; font-size:clamp(3rem,5.4vw,5.6rem); }
.forma-kert .forma-hero-photo > img { border-radius:3px; aspect-ratio:1.1/1; }
.forma-kert .forma-hero-stamp { width:126px; min-height:100px; border-radius:2px; left:auto; right:-20px; bottom:55px; background:#ad5c3f; transform:rotate(5deg); }
.forma-kert .forma-demo-button { border-radius:2px; }
.forma-selyem .forma-hero { grid-template-columns:1.1fr 1fr; gap:65px; }
.forma-selyem h1 { font-weight:400; font-size:clamp(2.8rem,4.8vw,5.2rem); letter-spacing:-.04em; line-height:1.13; }
.forma-selyem .forma-hero-photo > img { border-radius:48% 48% 45% 45%; aspect-ratio:1/1.2; }
.forma-selyem .forma-hero-stamp { background:var(--demo-soft); color:var(--demo-ink); border:1px solid var(--demo-border); left:-35px; bottom:65px; transform:rotate(-6deg); }
.forma-selyem .forma-demo-button { background:transparent; color:var(--demo-ink); border:1px solid var(--demo-ink); border-radius:0; }
.forma-ribbon { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:18px 40px; padding:22px 30px; background:var(--demo-accent); color:var(--demo-on-accent); font:italic clamp(1rem,1.9vw,1.4rem)/1.5 Georgia,serif; }
.forma-ribbon span[aria-hidden] { font-style:normal; font-size:2rem; }
.forma-offerings { padding-block:85px; }
.forma-section-heading { display:grid; grid-template-columns:.65fr 1.25fr 1fr; gap:28px; align-items:start; margin-bottom:48px; }
.forma-section-heading > .forma-kicker { padding-top:10px; }
.formak-demo h2 { font:400 clamp(2.4rem,4vw,4.4rem)/1.12 Georgia,serif; letter-spacing:-.045em; }
.forma-reggel h2 { font-weight:700; }
.forma-section-heading > p:last-child { font-size:.88rem; line-height:1.85; padding-top:7px; max-width:47ch; }
.forma-offering-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:35px; }
.forma-offering-grid article { border-top:1px solid var(--demo-border); padding-top:22px; }
.forma-offering-grid article > span { font: .62rem var(--font-mono); color:var(--demo-accent); }
.forma-offering-grid h3 { font:400 1.65rem/1.25 Georgia,serif; margin-block:22px 16px; letter-spacing:-.025em; }
.forma-offering-grid p { font-size:.88rem; line-height:1.8; max-width:36ch; }
.forma-presence { padding-block:70px 80px; border-top:1px solid var(--demo-border); }
.forma-presence .forma-section-heading h2 { font-size:clamp(2.3rem,3.5vw,3.8rem); }
.forma-social-grid { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:24px; }
.forma-showcase { grid-column:span 3; min-width:0; background:var(--demo-card); border:1px solid var(--demo-border); border-radius:8px; padding:25px; }
.forma-tiktok,.forma-google,.forma-reviews { grid-column:span 2; }
.forma-platform-heading { display:flex; align-items:baseline; justify-content:space-between; flex-wrap:wrap; gap:8px 12px; padding-bottom:18px; }
.forma-platform-heading > span:first-child { font-size:.85rem; font-weight:600; letter-spacing:-.015em; }
.forma-example-tag { font-size:.55rem; line-height:1.5; letter-spacing:.05em; text-transform:uppercase; padding:5px 7px; border:1px solid var(--demo-border); border-radius:3px; }
.forma-facebook-cover { position:relative; border-radius:3px; overflow:hidden; height:155px; background:var(--demo-soft); }
.forma-facebook-cover img { width:100%; height:100%; object-fit:cover; object-position:50% 38%; }
.forma-facebook-cover::after { content:''; position:absolute; inset:0; background:linear-gradient(transparent,#0008); }
.forma-facebook-cover > span { position:absolute; left:20px; bottom:16px; z-index:1; color:#fff; font:400 1.5rem Georgia,serif; }
.forma-post-author,.forma-insta-intro { display:flex; align-items:center; gap:12px; margin-top:18px; }
.forma-avatar { width:42px; height:42px; flex-shrink:0; display:grid; place-items:center; font:italic 1.8rem/1 Georgia,serif; background:var(--demo-accent); color:var(--demo-on-accent); border-radius:50%; }
.forma-post-author strong,.forma-insta-intro strong { display:block; font-size:.78rem; font-weight:600; }
.forma-post-author small { display:block; font-size:.58rem; margin-top:4px; }
.forma-post-copy { font-size:.85rem; line-height:1.8; margin-top:19px; }
.forma-insta-intro { margin-block:2px 25px; }
.forma-insta-intro p { font-size:.72rem; line-height:1.6; margin-top:5px; }
.forma-insta-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; }
.forma-insta-grid > div { aspect-ratio:1; overflow:hidden; background:var(--demo-soft); }
.forma-insta-grid img { width:100%; height:100%; object-fit:cover; }
.forma-insta-grid .forma-insta-detail img { transform:scale(1.8); object-position:70% 50%; }
.forma-insta-type { display:flex; flex-direction:column; justify-content:center; padding:14px; color:var(--demo-on-accent); background:var(--demo-accent)!important; }
.forma-insta-type > span { font:italic clamp(1rem,1.6vw,1.7rem)/1.2 Georgia,serif; }
.forma-insta-type > small { font-size:.4rem; line-height:1.5; margin-top:12px; }
.forma-showcase .forma-showcase-note { padding-top:18px; margin-top:18px; border-top:1px solid var(--demo-border); font-size:.68rem; line-height:1.8; }
.forma-storyboard { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; }
.forma-video-frame { min-width:0; display:flex; flex-direction:column; justify-content:space-between; gap:14px; aspect-ratio:9/17; border-radius:5px; padding:14px 9px; background:var(--demo-soft); }
.forma-video-frame:nth-child(2) { background:var(--demo-accent); color:var(--demo-on-accent); }
.forma-video-frame:nth-child(3) { background:var(--demo-ink); color:var(--demo-paper); }
.forma-frame-number { font:.7rem var(--font-mono); }
.forma-video-frame > p { font:400 clamp(.8rem,1.1vw,1.1rem)/1.25 Georgia,serif; overflow-wrap:anywhere; }
.forma-video-frame > small { font-size:.43rem; line-height:1.5; text-transform:uppercase; letter-spacing:.06em; }
.forma-map { position:relative; height:160px; overflow:hidden; border-radius:4px; background:repeating-linear-gradient(24deg,transparent 0 39px,#fff9 40px 49px,transparent 50px 100px),repeating-linear-gradient(106deg,transparent 0 45px,#fff8 46px 55px,transparent 56px 105px),#e6e4d9; }
.forma-map-park { position:absolute; width:100px; height:75px; background:#c5d1b9; right:16px; top:30px; border-radius:20% 60% 20% 40%; transform:rotate(-12deg); }
.forma-map-marker { position:absolute; display:grid; place-items:center; left:45%; top:25%; width:50px; height:50px; border-radius:50%; background:var(--demo-accent); color:var(--demo-on-accent); box-shadow:0 6px 20px #0002; }
.forma-map-label { position:absolute; inset:auto 10px 10px; color:#3c483a; font-size:.54rem; text-align:center; background:#ffffffe8; padding:5px; border-radius:2px; }
.forma-google-info { margin-top:17px; }
.forma-google-info strong { font-size:.85rem; }
.forma-google-info p { font-size:.68rem; line-height:1.75; margin-top:8px; }
.forma-review-placeholder { border:1px dashed var(--demo-border); padding:22px 20px; border-radius:4px; }
.forma-review-placeholder > span { display:block; font:3.7rem/.6 Georgia,serif; color:var(--demo-accent); margin-top:12px; }
.forma-review-placeholder h3 { font:400 1.4rem/1.25 Georgia,serif; margin-block:15px; letter-spacing:-.025em; }
.forma-review-placeholder p { font-size:.73rem; line-height:1.8; }
.forma-presence-disclaimer { margin-top:25px; font-size:.7rem; line-height:1.8; max-width:95ch; }
.forma-demo-next { padding-block:80px 90px; background:var(--demo-soft); }
.forma-demo-next h2 { margin-top:26px; font-size:clamp(2.6rem,5.5vw,5.5rem); }
.forma-demo-next .forma-demo-wrap > p:not(.forma-kicker) { max-width:54ch; font-size:.94rem; line-height:1.85; margin-top:25px; }
.forma-kert .forma-demo-next { background:var(--demo-accent); color:var(--demo-on-accent); }
.forma-kert .forma-demo-next h2 em { color:#dac7a2; }
.forma-kert .forma-demo-next .forma-demo-button { background:var(--demo-on-accent); color:var(--demo-ink); }
@media (max-width:1050px) {
    .forma-demo-wrap { width:calc(100% - 48px); }
    .forma-hero,.forma-kert .forma-hero,.forma-selyem .forma-hero { gap:35px; }
    .forma-section-heading { grid-template-columns:1fr 1fr; gap:20px 35px; }
    .forma-section-heading > .forma-kicker { grid-column:1/-1; }
    .forma-tiktok,.forma-google,.forma-reviews { grid-column:span 3; }
    .forma-reviews { grid-column:1/-1; }
    .forma-review-placeholder { display:grid; grid-template-columns:1fr 2fr 2fr; gap:25px; align-items:center; }
    .forma-video-frame > p { font-size:1.2rem; }
    .forma-card-image { aspect-ratio:3/4; }
    .forma-card-brand { left:20px; bottom:25px; }
}
@media (max-width:760px) {
    .formak-grid { grid-template-columns:1fr; gap:38px; }
    .forma-card { display:grid; grid-template-columns:1fr 1fr; gap:25px; }
    .forma-card-info { padding-top:8px; }
    .forma-card-brand { font-size:3.5rem; }
    .forma-hero,.forma-kert .forma-hero,.forma-selyem .forma-hero { grid-template-columns:1fr; padding-block:42px 45px; gap:35px; }
    .formak-demo h1,.forma-kert h1 { font-size:clamp(3rem,8vw,4.8rem); }
    .forma-selyem h1 { font-size:clamp(2.6rem,7.5vw,4.4rem); }
    .forma-hero-photo { max-width:650px; width:100%; }
    .forma-hero-photo > img,.forma-kert .forma-hero-photo > img { aspect-ratio:3/2; border-radius:3px; }
    .forma-selyem .forma-hero-photo > img { aspect-ratio:3/2; border-radius:38% 38% 4px 4px; }
    .forma-hero-stamp,.forma-selyem .forma-hero-stamp { left:auto; right:14px; bottom:45px; }
    .forma-kert .forma-hero-stamp { right:14px; }
    .forma-demo-nav { align-items:start; padding-block:26px; }
    .forma-demo-nav nav { gap:7px 18px; font-size:.7rem; max-width:260px; }
    .forma-offering-grid { gap:22px; }
    .forma-offering-grid h3 { font-size:1.4rem; }
    .forma-offering-grid p { font-size:.8rem; }
    .forma-social-grid { grid-template-columns:1fr; gap:18px; }
    .forma-showcase,.forma-tiktok,.forma-google,.forma-reviews { grid-column:1; }
    .forma-facebook-cover { height:190px; }
    .forma-insta-grid { max-width:560px; }
    .forma-insta-type > span { font-size:clamp(1.2rem,4vw,2rem); }
    .forma-insta-type > small { font-size:.52rem; }
    .forma-storyboard { max-width:450px; }
    .forma-video-frame > p { font-size:clamp(1rem,3.1vw,1.4rem); }
    .forma-video-frame > small { font-size:.55rem; }
    .forma-map { height:200px; }
    .forma-review-placeholder { display:block; }
}
@media (max-width:480px) {
    .formak-intro h1 { font-size:clamp(2.1rem,9vw,3rem); }
    .forma-card { display:block; }
    .forma-card-image { aspect-ratio:4/3; }
    .forma-card-info { padding-top:25px; }
    .forma-card-brand { font-size:3rem; }
    .forma-demo-wrap { width:calc(100% - 36px); }
    .formak-demo .concept-toolbar { padding:10px 18px; justify-content:space-between; }
    .formak-demo .concept-toolbar p { order:0; flex-basis:auto; font-size:.6rem; }
    .formak-demo .concept-toolbar a { font-size:.62rem; }
    .formak-demo .concept-toolbar > a:last-child { display:none; }
    .forma-demo-nav { flex-direction:column; gap:20px; }
    .forma-demo-nav nav { justify-content:flex-start; max-width:none; }
    .forma-wordmark { font-size:3.1rem; }
    .forma-kert .forma-wordmark { font-size:3.6rem; }
    .forma-hero { padding-top:32px; }
    .formak-demo h1,.forma-kert h1 { font-size:clamp(2.8rem,11vw,4rem); }
    .forma-selyem h1 { font-size:clamp(2.15rem,9vw,3.5rem); }
    .forma-hero-copy > p:not(.forma-kicker) { font-size:.92rem; }
    .forma-kicker { font-size:.58rem; }
    .forma-hero-stamp { width:90px; min-height:90px; font-size:1rem; }
    .forma-kert .forma-hero-stamp { width:105px; min-height:80px; }
    .forma-ribbon { gap:4px 18px; padding:17px 18px; font-size:.95rem; }
    .forma-ribbon > span:last-child { flex-basis:100%; text-align:center; }
    .forma-ribbon span[aria-hidden] { font-size:1.3rem; }
    .forma-offerings,.forma-presence { padding-block:50px; }
    .forma-section-heading { display:block; margin-bottom:35px; }
    .forma-section-heading h2 { margin-block:20px; }
    .forma-section-heading > p:last-child { font-size:.85rem; }
    .forma-offering-grid { grid-template-columns:1fr; gap:28px; }
    .forma-offering-grid h3 { font-size:1.65rem; margin-block:15px 12px; }
    .forma-offering-grid p { font-size:.85rem; max-width:none; }
    .forma-showcase { padding:18px; }
    .forma-facebook-cover { height:140px; }
    .forma-facebook-cover > span { font-size:1.25rem; left:14px; }
    .forma-insta-type { padding:10px; }
    .forma-insta-type > span { font-size:1.05rem; }
    .forma-insta-type > small { font-size:.4rem; }
    .forma-video-frame { padding:12px 8px; }
    .forma-video-frame > p { font-size:.9rem; }
    .forma-video-frame > small { font-size:.43rem; }
    .forma-demo-next { padding-block:55px 65px; }
    .forma-demo-next h2 { font-size:clamp(2.2rem,9vw,3.5rem); }
}
@media (prefers-reduced-motion:reduce) { .forma-card-image > img { transition:none; }.forma-card-image:hover > img { transform:none; } }
