/* Original ApexLab films lead the experience; project details stay in the guide. */ .home-page {--muted:#c4bed0} .home-hero {position:relative;min-height:max(720px,100svh);display:flex;align-items:center;padding:calc(var(--nav-h) + 56px) 0 100px;isolation:isolate;overflow:hidden} .home-hero__visual {position:absolute;inset:0;z-index:-2} .home-hero__visual .film,.home-hero__visual .film__tilt {inset:0} .home-hero__visual .film img,.home-hero__visual .film video {object-fit:cover;object-position:50% 50%} .home-hero__shade {position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#09060ce0,transparent 67%),linear-gradient(0deg,#09060c,transparent 25%);pointer-events:none} .home-hero__copy {max-width:680px;position:relative} .home-hero .eyebrow {color:#c6d0e3;font-size:11px;letter-spacing:.18em;line-height:1.6} .home-hero h1 {font-size:clamp(64px,7.1vw,110px);line-height:.99;letter-spacing:-.055em;font-weight:800;margin:28px 0;max-width:11ch} .home-hero__lead {font-size:clamp(17px,1.5vw,21px);line-height:1.65;color:#e4dced;margin:0 0 28px;max-width:40ch} .home-hero .btn {font-size:14px;padding:15px 20px;min-height:52px}.home-hero__terms {font-size:11px;line-height:1.7;color:#bfb5cc;max-width:53ch;margin:18px 0 0} .home-hero__controls {position:absolute;right:var(--gutter);bottom:24px;display:flex;gap:8px;z-index:4}.home-hero__controls button {min-height:44px;padding:10px 13px;border:1px solid #826c9b70;border-radius:12px;background:#100a18c9;color:#e5ddec;font-size:12px;cursor:pointer;backdrop-filter:blur(12px)} .home-light-replay span {color:#7ed5fb;font-size:18px;margin-right:5px}.home-hero__controls button:hover {border-color:#7ed5fb}.home-hero__controls button:focus-visible {outline:3px solid #7ed5fb;outline-offset:3px}.home-hero__controls button:disabled {opacity:.65;cursor:default} .home-scroll-cue {position:absolute;left:var(--gutter);bottom:37px;display:flex;gap:22px;align-items:center;font:11px var(--mono);letter-spacing:.1em;color:#c4bed0}.home-scroll-cue span {color:#7ed5fb;font-size:21px} .home-section {padding:76px 0;scroll-margin-top:calc(var(--nav-h) + 16px)}.home-section h2 {font-size:clamp(32px,3.8vw,56px);line-height:1.08;letter-spacing:-.04em;margin:14px 0 24px}.home-section p {color:#c4bed0}.home-section__head {display:flex;align-items:center;justify-content:space-between;gap:30px;margin-bottom:25px}.home-section__head h2 {font-size:clamp(26px,2.8vw,38px);margin:0}.home-text-link {color:#b6e5fa;text-decoration:underline;text-underline-offset:4px;font-size:14px;line-height:1.6} .home-needs {padding:42px 0;background:#0e0914}.home-needs__grid {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.home-need {display:flex;align-items:center;gap:14px;padding:23px 18px;border:1px solid #65527466;border-radius:16px;background:linear-gradient(140deg,#24192d77,#120d19);min-width:0;transition:border-color .2s,background .2s}.home-need:hover {border-color:#7ed5fb;background:#21182c}.home-need__icon {color:#7ed5fb;flex:none}.home-need__icon svg {width:22px;height:22px}.home-need h3 {font-size:16px;line-height:1.35;margin:0;flex:1}.home-need>span:last-child {color:#a6dff7} .home-cinema {position:relative;min-height:max(620px,88svh);display:flex;align-items:center;overflow:hidden;isolation:isolate;scroll-margin-top:var(--nav-h)} .home-cinema>.film {z-index:-2}.home-cinema .film__tilt {inset:0}.home-cinema .film img,.home-cinema .film video {object-position:50% 50%} .home-cinema__shade {position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,#09060cc9,transparent 64%),linear-gradient(0deg,#09060cdb,transparent 25%,transparent 85%,#09060c50)} .home-cinema__layout {width:100%;padding-block:80px}.home-cinema__copy {max-width:480px;position:relative}.home-cinema h2 {font-size:clamp(40px,4.4vw,66px);line-height:1.05;letter-spacing:-.045em;margin:20px 0 25px;font-weight:750}.home-cinema p {font-size:17px;line-height:1.75;max-width:37ch;color:#e0d7e9;margin:0 0 26px}.home-cinema .eyebrow {font-size:11px;color:#9edff9}.home-cinema .link-arrow {font-size:14px} .home-cinema__index {position:absolute;left:var(--gutter);bottom:24px;font:10px/1.6 var(--mono);color:#ada0bc;letter-spacing:.08em;max-width:70ch}.home-cinema__tags {display:flex;flex-wrap:wrap;gap:9px;margin:0 0 28px}.home-cinema__tags span {padding:9px 12px;border:1px solid #8c75a969;border-radius:10px;font-size:12px;line-height:1.5;background:#100b18b0;color:#d7cde4} .home-cinema--tower .home-cinema__copy {max-width:490px}.home-cinema--tower .film::after {background:linear-gradient(0deg,#09060c85,transparent 40%)} .home-cinema--bridge .home-cinema__layout {align-self:end}.home-cinema--bridge .home-cinema__shade {background:linear-gradient(0deg,#09060cf2, #09060c75 36%,transparent 70%)}.home-cinema--bridge .home-cinema__copy {max-width:650px}.home-cinema--bridge h2 {max-width:18ch}.home-cinema--bridge p {max-width:58ch;font-size:14px}.home-process__steps {display:flex;gap:24px;list-style:none;padding:0;margin:25px 0;color:#f7f5fb;font-size:18px}.home-process__steps li {display:flex;gap:9px;align-items:center}.home-process__steps li span {font:11px var(--mono);color:#7ed5fb} .home-proof {background:#0f0a15}.home-proof__grid {display:grid;grid-template-columns:1.2fr 1fr;gap:54px;align-items:center}.home-proof__image {position:relative;aspect-ratio:1.25;border:1px solid #73618470;border-radius:21px;overflow:hidden;isolation:isolate}.home-proof__image>.film {z-index:-1}.home-proof__image .film img,.home-proof__image .film video {object-position:center}.home-proof__site {position:absolute;inset:auto 7% 7%;border:1px solid #b4a6c870;border-radius:10px;overflow:hidden;background:#09060c;box-shadow:0 16px 45px #0009;transform:perspective(900px) rotateY(-5deg) rotateX(3deg);width:73%;margin-left:auto}.home-proof__site span {display:block;padding:7px 12px;font:10px var(--mono);color:#ddd3e9;background:#1c1427}.home-proof__site img {width:100%;height:auto;display:block}.home-proof__copy>p {font-size:17px;line-height:1.7;max-width:35ch}.home-proof .btn {font-size:14px;padding:14px 20px}.home-proof__more {font-size:12px!important;margin:25px 0 0}.home-proof__more a {color:#b6e5fa;text-decoration:underline;text-underline-offset:3px} .home-faq .split {align-items:start;gap:55px}.home-faq p {font-size:14px;line-height:1.8;max-width:38ch}.home-faq .faq summary {font-size:16px}.home-faq .faq__a {font-size:14px}.home-start {text-align:center;background:radial-gradient(ellipse at 50% 100%,#4b285977,transparent 70%)}.home-start .btn-row {justify-content:center}.home-start p {font-size:14px;margin-top:28px}.home-start p a {color:#c4bed0}.home-cinema__details {display:inline-flex;align-items:center;gap:10px;font-size:12px;color:#b6e5fa;margin-top:20px}.home-page .footer {padding-top:32px}.home-page .footer__giant {display:none}.home-page .footer__grid {padding-bottom:30px} @media(max-width:1100px){.home-needs__grid {grid-template-columns:repeat(2,minmax(0,1fr))}.home-hero__copy {max-width:540px}.home-hero h1 {font-size:80px}.home-cinema__copy {max-width:420px}.home-proof__grid {gap:30px}.home-cinema__shade {background:linear-gradient(90deg,#09060cdb,transparent 80%),linear-gradient(0deg,#09060cdb,transparent 30%)}} @media(max-width:760px){ .home-hero {min-height:max(810px,100svh);padding:0;display:block}.home-hero__visual {inset:var(--nav-h) 0 auto;height:62svh;max-height:530px;min-height:350px}.home-hero__visual .film img,.home-hero__visual .film video {object-fit:cover;object-position:50% 26%}.home-hero__visual .film__tilt {transform:none}.home-hero__visual .film::after {background:linear-gradient(0deg,#09060c,transparent 35%)} .home-hero__shade {background:linear-gradient(0deg,#09060c 15%,#09060ce6 30%,transparent 58%)}.home-hero__grid {padding-top:clamp(340px,48svh,440px);padding-bottom:118px}.home-hero__copy {max-width:none}.home-hero .eyebrow {font-size:9px;letter-spacing:.13em}.home-hero h1 {font-size:clamp(48px,13.5vw,78px);line-height:1.01;margin:16px 0 18px;max-width:11ch}.home-hero__lead {font-size:15px;line-height:1.65;max-width:37ch;margin:0 0 22px}.home-hero .btn {font-size:13px;min-height:48px;padding:13px 15px}.home-hero__terms {font-size:10px;line-height:1.65;max-width:48ch;margin-top:13px}.home-hero__controls {left:var(--gutter);right:auto;bottom:17px;gap:8px}.home-hero__controls button {font-size:11px;min-height:44px}.home-scroll-cue {left:auto;right:var(--gutter);bottom:31px;font-size:0;gap:0}.home-scroll-cue span {font-size:22px} .home-section {padding:45px 0}.home-section h2 {font-size:34px}.home-needs {padding:30px 0}.home-section__head {display:block;margin-bottom:20px}.home-section__head h2 {font-size:26px;margin-top:10px}.home-needs__grid {gap:10px}.home-need {padding:18px 12px;gap:9px;border-radius:13px}.home-need h3 {font-size:14px}.home-need__icon svg {width:19px;height:19px} .home-cinema {display:block;min-height:0;padding-top:clamp(380px,62svh,540px);padding-bottom:0}.home-cinema>.film {bottom:auto;height:clamp(440px,72svh,620px);aspect-ratio:auto}.home-cinema .film img,.home-cinema .film video {object-fit:cover;object-position:50% 30%}.home-cinema .film__tilt {transform:none}.home-cinema .film::after {background:linear-gradient(0deg,#09060c,transparent 45%)}.home-cinema__shade {background:linear-gradient(0deg,#09060c 5%,#09060cf0 25%,transparent 65%)}.home-cinema__layout {padding-top:0;padding-bottom:62px}.home-cinema__copy,.home-cinema--tower .home-cinema__copy {max-width:none}.home-cinema h2 {font-size:clamp(36px,9.5vw,48px);margin:14px 0 20px}.home-cinema p {font-size:15px;line-height:1.7;max-width:42ch;margin:0 0 22px}.home-cinema .eyebrow {font-size:10px}.home-cinema .link-arrow {font-size:13px}.home-cinema__index {bottom:18px;font-size:8px;max-width:90%;letter-spacing:.025em}.home-cinema__tags {gap:8px;margin-bottom:22px}.home-cinema__tags span {font-size:11px;padding:7px 9px}.home-cinema--tower .film img,.home-cinema--tower .film video {object-position:50% 35%}.home-cinema--tower .film::after {background:linear-gradient(0deg,#09060c,transparent 45%)}.home-cinema--bridge .home-cinema__shade {background:linear-gradient(0deg,#09060c 5%,#09060cf0 25%,transparent 65%)}.home-process__steps {gap:20px;font-size:16px;margin:22px 0}.home-process__steps li {gap:7px}.home-process__steps li span {font-size:10px}.home-cinema--bridge p {font-size:13px;line-height:1.7} .home-proof__grid {grid-template-columns:1fr;gap:30px}.home-proof__image {aspect-ratio:1.1;border-radius:17px}.home-proof__copy>p {font-size:15px}.home-proof__more {font-size:11px!important}.home-proof .btn-row {gap:15px}.home-faq .split {grid-template-columns:1fr;gap:28px}.home-faq .faq summary {font-size:15px}.home-start .btn {font-size:13px;padding:14px 17px}.home-page .footer__grid {gap:28px}} @media(max-width:360px){.home-hero__grid {padding-top:320px}.home-hero {min-height:840px}.home-hero h1 {font-size:46px}.home-hero__lead {font-size:14px}.home-need {gap:7px;padding:16px 10px}.home-need h3 {font-size:12px}.home-process__steps {gap:14px}.home-cinema__tags {display:grid;justify-items:start}} @media(prefers-reduced-motion:reduce){.home-need {transition:none}.home-motion {display:none}.home-hero__visual .film__tilt,.home-cinema .film__tilt {transform:none}} /* Native hash navigation already reserves the fixed header through html scroll-padding. */ .cinematic-home .home-section,.cinematic-home .home-cinema {scroll-margin-top:0} .home-social { background: color-mix(in srgb, var(--ink) 88%, var(--uv-deep)); border-block: 1px solid #b69dd52e; } .home-social__head { max-width: 42rem; margin-bottom: 32px; } .home-social__head h2 { margin: 16px 0 12px; } .home-social__head p { font-size: 17px; line-height: 1.65; margin: 0; } .home-social__platforms { display: flex; flex-wrap: wrap; gap: 8px; } .home-social__platforms span { display: inline-flex; align-items: center; gap: 7px; border: 1px solid #b69dd545; border-radius: 7px; padding: 5px 9px; font-size: 13px; color: #eee7f5; } .home-social__platforms img { object-fit: contain; } .home-social__plans { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; } .social-plan { --plan-accent: var(--volt); --plan-text: color-mix(in srgb, var(--plan-accent) 70%, var(--frost)); display: flex; flex-direction: column; min-width: 0; padding: clamp(18px, 2.2vw, 30px); border: 1px solid #b69dd53d; border-top: 2px solid var(--plan-accent); border-radius: 4px 4px 14px 14px; background: color-mix(in srgb, var(--ink) 91%, var(--plan-accent)); } .social-plan--connect { --plan-accent: var(--uv); background: color-mix(in srgb, var(--ink) 83%, var(--plan-accent)); } .social-plan--plus { --plan-accent: var(--pink); } .social-plan h3 { margin: 0 0 8px; color: #f5effb; font-size: 25px; letter-spacing: -.025em; } .social-plan p { margin: 0; font-size: 15px; line-height: 1.55; } .social-plan .social-plan__price { margin-top: 14px; color: #eee7f5; } .social-plan__price strong { font-size: 32px; line-height: 1; } .social-plan ul { display: grid; gap: 8px; list-style: none; padding: 16px 0 20px; margin: 16px 0 0; border-top: 1px solid #b69dd53d; color: #eee7f5; font-size: 14px; line-height: 1.5; } .social-plan li { padding-left: 13px; position: relative; } .social-plan li::before { content: ""; position: absolute; top: .67em; left: 0; width: 5px; height: 5px; background: var(--plan-accent); } .social-plan strong { color: var(--plan-text); } .social-plan .btn { margin-top: auto; width: fit-content; min-height: 44px; white-space: normal; font-size: 13px; } .social-plan .btn:focus-visible { outline: 3px solid var(--plan-accent); outline-offset: 4px; } .home-social__notes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin-top: 22px; } .home-social__notes p { margin: 0; font-size: 14px; line-height: 1.65; } .home-social__notes strong { color: #eee7f5; } @media (max-width: 820px) { .home-social__plans, .home-social__notes { grid-template-columns: 1fr; } .home-social__head { margin-bottom: 24px; } } /* Three visible projects; each retains its original imagery and full case study. */ .home-projects {background:#0f0a15}.home-projects__head {display:flex;align-items:end;justify-content:space-between;gap:28px;margin-bottom:32px}.home-projects__head h2 {margin-bottom:0}.home-projects__grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;align-items:start}.home-projects .case {min-width:0;border-color:#7b65874d}.home-projects .case__media {aspect-ratio:1.25}.home-projects .case__body {padding:0 22px 24px}.home-projects .case h3 {font-size:27px;line-height:1.2}.home-projects .case p {color:#c4bed0;font-size:15px;line-height:1.65}.home-projects .case__tags {gap:6px}.home-projects .chip {font-size:9px;padding:6px 9px}.home-projects .case__foot {display:grid;gap:10px}.home-projects .case__foot>span:first-child {color:#b9adc9;font-size:10px;line-height:1.6}.home-projects .case__foot .link-arrow {color:#b6e5fa;font-size:12px}.home-projects__story {display:inline-block;margin-top:28px} .home-forge {height:360svh;scroll-margin-top:0}.home-forge .pin__sticky {height:100svh}.home-forge .forge__copy {bottom:clamp(32px,7svh,70px)}.home-forge .eyebrow {color:#ffcf9c;font-size:11px}.home-forge h2 {font-size:clamp(48px,5.6vw,82px);line-height:1.03;letter-spacing:-.045em;margin:18px 0}.home-forge h2>span {color:#ffcf9c}.home-forge p {max-width:35ch;font-size:16px;line-height:1.65;color:#eee1da;margin:0}.home-forge .forge__steps {margin:22px 0}.home-forge .link-arrow {font-size:14px;color:#ffcf9c}.home-forge .forge__meter {background:#100907a6;padding:12px 16px;border:1px solid #ffba7333;border-radius:14px;line-height:1.5}.home-forge .forge__meter small {display:block;font-size:9px;letter-spacing:.04em;color:#d4c1ae;margin-top:5px}.home-forge__cue {position:absolute;top:calc(var(--nav-h) + 35px);left:var(--gutter);z-index:2;font:11px var(--mono);color:#ffcf9c}.home-forge__cue span {margin-left:9px}.home-forge .forge__shade {background:linear-gradient(90deg,#090302cc,transparent 70%),linear-gradient(0deg,#090302eb,transparent 60%)} @media(max-width:1100px) and (min-width:761px){.home-projects__grid {gap:14px}.home-projects .case__body {padding-inline:16px}.home-projects .case h3 {font-size:23px}.home-projects .case p {font-size:14px}.home-projects .chip {font-size:8px;padding:5px 7px}} @media(max-width:760px){.home-projects__head {display:block;margin-bottom:26px}.home-projects__head .home-text-link {display:inline-block;margin-top:18px}.home-projects__grid {grid-template-columns:1fr;gap:24px}.home-projects .case__media {aspect-ratio:1.3}.home-projects .case__body {padding:0 22px 24px}.home-projects .case h3 {font-size:28px}.home-projects .case p {font-size:15px}.home-projects .chip {font-size:9px;padding:6px 9px}.home-forge {height:280svh}.home-forge .forge__copy {bottom:27px}.home-forge h2 {font-size:clamp(40px,11vw,58px);margin:12px 0 14px}.home-forge .eyebrow {font-size:9px;letter-spacing:.08em}.home-forge p {font-size:14px;max-width:33ch}.home-forge .forge__steps {gap:7px;margin:17px 0}.home-forge .chip {font-size:9px;padding:7px 10px}.home-forge .link-arrow {font-size:12px}.home-forge .forge__meter {top:calc(var(--nav-h) + 18px);padding:10px 12px;font-size:9px;letter-spacing:.08em}.home-forge .forge__meter b {font-size:32px}.home-forge .forge__meter small {font-size:8px}.home-forge__cue {top:calc(var(--nav-h) + 32px);font-size:10px}.home-forge .forge__shade {background:linear-gradient(0deg,#090302f0, #09030266 42%,transparent 75%)}} @media(max-width:360px){.home-projects .case__body {padding-inline:17px}.home-forge h2 {font-size:38px}.home-forge p {font-size:13px}.home-forge .chip {font-size:8px;padding:6px 8px}} @media(prefers-reduced-motion:reduce){.home-forge {height:auto;min-height:720px}.home-forge .pin__sticky {position:relative;min-height:720px}.home-forge__cue {display:none}.home-projects .case__media video:not(.is-live-video) {display:none}} .home-projects__index {display:none}.home-projects .case[id] {scroll-margin-top:12px} @media(max-width:760px){.home-projects__index {display:flex;flex-wrap:wrap;gap:8px;margin:-5px 0 24px}.home-projects__index a {display:inline-flex;align-items:center;min-height:44px;padding:10px 13px;border:1px solid #8c75a966;border-radius:11px;color:#d8cced;background:#1d1427;font-size:12px}.home-projects__index a:focus-visible {outline:3px solid #7ed5fb;outline-offset:3px}} /* Home offer and Guide light */ .home-hero .home-hero__offer { gap: .45em; max-width: 100%; white-space: normal; text-align: left; } .home-hero__offer strong { white-space: nowrap; font-size: 1.08em; border-radius: 5px; } .home-hero__offer svg { flex: none; margin-left: .35em; } #website-89, #social-plans, .cinematic-home #website-intelligence { scroll-margin-top: calc(var(--nav-h) + 22px); } .home-page .apx-guide-light--offer { opacity: 1; } .home-page .apx-guide-light--offer .apx-guide-light__ray { clip-path: polygon(0 49%, 100% 0, 100% 100%, 0 51%); background: linear-gradient(90deg,#e7faff80,#95dfff24 34%,#7ed5fb1c 86%,transparent); } .home-page .apx-guide-light--offer .apx-guide-light__pool { background: radial-gradient(ellipse,#e7faff3b,#7ed5fb18 45%,transparent 72%); } .home-page .apx-guide-light--offer .apx-guide-light__source { background: radial-gradient(ellipse,#f8fdffd9,#7ed5fb44 42%,transparent 72%); } .home-page .nav__guide.is-offer-light .nav__guide-face { transform: rotate(var(--offer-look, 0deg)); } .home-page .nav__guide.is-offer-light .nav__guide-screen i { background: #effbff; box-shadow: 0 0 7px #fff, 0 0 14px #7ed5fb; } .home-hero__offer .apx-offer-illuminated { background: #f0fbffb5; box-shadow: 0 0 13px 4px #b8eeffb0; } .apx-offer-illuminated .social-plan__price strong { color: #ecfaff; text-shadow: 0 0 13px #7ed5fb, 0 0 23px #7ed5fb7a; } .social-plan.apx-offer-illuminated { outline: 2px solid #95e3ff; outline-offset: 2px; box-shadow: inset 0 0 28px #7ed5fb16, 0 0 22px #7ed5fb38; } /* Apex Lab Social launch */ .home-social { padding-block: clamp(62px, 8vw, 115px); background: radial-gradient(ellipse at 85% 5%,#41204b 0%,transparent 53%), radial-gradient(ellipse at 3% 26%,#1a2946 0%,transparent 53%),#0f0a16; } .home-social__launch { display: grid; grid-template-columns: 1.18fr 1fr; gap: clamp(28px,5vw,74px); align-items: center; margin-bottom: clamp(38px,6vw,84px); } .home-social__head { margin: 0; } .home-social__head h2 { font-size: clamp(42px,6.8vw,100px); letter-spacing: -.065em; margin: 15px 0 16px; } .home-social__head .home-social__promise { color: #f8f4ff; font-size: clamp(19px,2.25vw,30px); line-height: 1.26; font-weight: 700; margin-bottom: 12px; max-width: 29ch; } .home-social__head > p { max-width: 49ch; } .home-social__platforms { margin-block: 22px 18px; } .home-social__platforms span { background: #130e21; border-radius: 30px; padding: 6px 11px; } .home-social__workflow { padding: clamp(20px,3vw,34px); border: 1px solid #b69dd55c; border-radius: 20px; background: linear-gradient(140deg,#302841,#181120 70%); box-shadow: 0 24px 54px #08050e70; } .home-social__workflow > p { margin: 0 0 8px; color: #b2e9ff; } .home-social__workflow ol { margin: 0; padding: 0; list-style: none; } .home-social__workflow li { display: flex; align-items: start; gap: 14px; padding: 15px 0; } .home-social__workflow li + li { border-top: 1px solid #b69dd532; } .home-social__workflow li:last-child { padding-bottom: 0; } .home-social__workflow li > span { display: grid; place-items: center; flex: 0 0 34px; height: 34px; border-radius: 10px; color: #b8eeff; background: #7ed5fb1c; font: 12px var(--mono); } .home-social__workflow strong { color: #f9f4fd; font-size: 16px; } .home-social__workflow li p { margin: 3px 0 0; font-size: 14px; line-height: 1.5; } .home-social__plan-heading { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 6px 16px; margin-bottom: 18px; } .home-social__plan-heading h3 { margin: 0; font-size: clamp(23px,3vw,38px); letter-spacing: -.035em; } .home-social__plan-heading p { margin: 0; font-size: 14px; } .social-plan { border-radius: 15px; } .social-plan__price strong { font-size: clamp(35px,4vw,52px); letter-spacing: -.06em; } /* Dashboard overview and connected data */ .home-dashboard { padding-block: clamp(64px,8vw,110px); border-block: 1px solid #ad90ce40; background: radial-gradient(ellipse at 86% 25%,#252b4b 0%,transparent 60%), #100b18; } .home-dashboard { position: relative; isolation: isolate; } .home-dashboard__ambient { position: absolute; inset: 0; z-index: -1; overflow: hidden; opacity: .14; pointer-events: none; } .home-dashboard__ambient .film__tilt { inset: 0; } .home-dashboard__overview { display: grid; grid-template-columns: .84fr 1.16fr; gap: clamp(26px,4vw,64px); align-items: center; } .home-dashboard__copy h2 { margin-bottom: 18px; } .home-dashboard__copy p { font-size: 17px; max-width: 43ch; margin: 0 0 24px; line-height: 1.65; } .home-dashboard__preview { margin: 0; border: 1px solid #a9baf36b; border-radius: 18px; overflow: hidden; background: #151022; } .home-dashboard__preview img { display: block; width: 100%; height: auto; } .home-dashboard__preview figcaption { padding: 9px 14px; color: #ded2ee; font-size: 12px; } .home-dashboard__sources { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; list-style: none; padding: 0; margin: clamp(24px,4vw,50px) 0 16px; } .home-dashboard__sources li { padding: 18px; border: 1px solid #a9baf343; border-radius: 13px; background: #181226; } .home-dashboard__icon { display: block; color: #9cdefb; margin-bottom: 8px; } .home-dashboard__icon svg { display: block; width: 22px; height: 22px; } .home-dashboard__sources strong, .home-dashboard__note strong { color: #f4effc; } .home-dashboard__sources p { margin: 6px 0 0; line-height: 1.55; font-size: 14px; } .home-dashboard__note { font-size: 14px; margin: 0; } @media(max-width: 900px) { .home-social__launch, .home-dashboard__overview { grid-template-columns: 1fr; } } @media(max-width: 680px) { .home-dashboard__sources { grid-template-columns: 1fr; } .home-dashboard__sources li { padding: 14px; } }