Changes for page Home
Last modified by Alex Cotiugă on 2026/01/13 13:12
From version 6.37
edited by Alex Cotiugă
on 2025/11/12 19:16
on 2025/11/12 19:16
Change comment:
There is no comment for this version
To version 5.17
edited by Alex Cotiugă
on 2025/11/12 15:44
on 2025/11/12 15:44
Change comment:
There is no comment for this version
Summary
-
Page properties (1 modified, 0 added, 0 removed)
-
Objects (1 modified, 0 added, 0 removed)
Details
- Page properties
-
- Content
-
... ... @@ -7,16 +7,22 @@ 7 7 <section class="hero hero-centered" aria-labelledby="hero-title"> 8 8 <div class="container"> 9 9 <div class="hero-inner"> 10 - <h1 id="hero-title">Professional XWiki solutions, from setup to long-term stability</h1> 11 - <p class="lead">Need your XWiki upgraded, secured, or improved? Let’s make it happen.</p> 10 + <h1 id="hero-title">Engineering reliability in every XWiki environment</h1> 11 + 12 + <p class="lead"> 13 + Agnease provides upgrades, maintenance, integrations, and custom development delivered with clarity, predictability, and long-term reliability. We keep your XWiki stable, secure, and ready to grow. 14 + </p> 15 + 12 12 <div class="hero-cta"> 13 - <a class="btn btn-primary" href="#contact" aria-label="Schedule a call with Agnease">Request a consultation</a> 17 + <a class="btn btn-primary" href="#contact" aria-label="Schedule a call with Agnease">Schedule a call</a> 18 + <a class="btn btn-ghost" href="#services">View services</a> 14 14 </div> 20 + 15 15 <ul class="benefits"> 16 - <li> Smoothupgrades</li>17 - <li> Reliable support plans</li>18 - <li>Custom integrations</li> 19 - <li> Secure,optimizedplatforms</li>22 + <li>Low-downtime LTS upgrades</li> 23 + <li>Support plans with SLAs</li> 24 + <li>Custom workflows & integrations</li> 25 + <li>Recovery & hardening</li> 20 20 </ul> 21 21 </div> 22 22 </div> ... ... @@ -26,39 +26,43 @@ 26 26 <section aria-labelledby="why-title"> 27 27 <div class="container"> 28 28 <h2 id="why-title">Why choose Agnease</h2> 29 - <p class="lead">10+ years of XWiki expertise with structured delivery and lasting collaboration</p> 35 + <p class="lead">Specialized XWiki expertise with predictable delivery and long-term partnership.</p> 36 + 30 30 <div class="widgets" role="list"> 31 31 <article class="widget" role="listitem"> 32 32 <div class="icon" aria-hidden="true"> 33 33 <!-- shield --> 34 34 <svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M12 3l7 3v5c0 5-3.5 9-7 10-3.5-1-7-5-7-10V6l7-3z" stroke="#2D3A34" stroke-width="1.6" fill="none"/></svg> 35 - <h3>Stability & security</h3> 36 36 </div> 37 - <p>Proven upgrade procedures, safe rollback plans, and proactive hardening keep your wiki available and reliable.</p> 43 + <h3>Stability & security</h3> 44 + <p>Rehearsed upgrades, hardening, and safe rollback paths keep your wiki available.</p> 38 38 </article> 46 + 39 39 <article class="widget" role="listitem"> 40 40 <div class="icon" aria-hidden="true"> 41 41 <!-- timeline --> 42 42 <svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4 17h4l3-7 3 7h6" stroke="#2D3A34" stroke-width="1.6"/></svg> 43 - <h3>Predictable delivery</h3> 44 44 </div> 45 - <p>Each project follows a clear scope, defined steps, and documented outcomes to avoid surprises.</p> 52 + <h3>Predictable delivery</h3> 53 + <p>Clear scope, downtime windows, and documentation — no surprises.</p> 46 46 </article> 55 + 47 47 <article class="widget" role="listitem"> 48 48 <div class="icon" aria-hidden="true"> 49 49 <!-- puzzle --> 50 50 <svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M7 3h5v4h5v5h-4v5H8v-4H3V8h4V3z" stroke="#2D3A34" stroke-width="1.6" fill="none"/></svg> 51 - <h3>Clean integrations</h3> 52 52 </div> 53 - <p>Maintainable connections with SSO, APIs, and external systems, adapted to your technical environment.</p> 61 + <h3>Clean integrations</h3> 62 + <p>Maintainable SSO, Stripe, and API workflows that fit your environment.</p> 54 54 </article> 64 + 55 55 <article class="widget" role="listitem"> 56 56 <div class="icon" aria-hidden="true"> 57 57 <!-- handshake --> 58 58 <svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M3 12l4-4 5 5 5-5 4 4-9 9-9-9z" stroke="#2D3A34" stroke-width="1.6" fill="none"/></svg> 59 - <h3>Long-term support</h3> 60 60 </div> 61 - <p>Support plans with guaranteed response times, regular health checks, and timely assistance keep your platform running smoothly.</p> 70 + <h3>Long-term support</h3> 71 + <p>Retainers with SLA, health checks, and fast investigation when issues appear.</p> 62 62 </article> 63 63 </div> 64 64 </div> ... ... @@ -68,7 +68,7 @@ 68 68 <section id="services" aria-labelledby="services-title"> 69 69 <div class="container"> 70 70 <h2 id="services-title">Services</h2> 71 - <p class="lead">Everything your XWiki needs ,from one expert partner.</p>81 + <p class="lead">Everything your XWiki needs — from one expert partner.</p> 72 72 73 73 <div class="services"> 74 74 <article class="card"> ... ... @@ -162,8 +162,8 @@ 162 162 <div class="label">Typical LTS upgrade window</div> 163 163 </div> 164 164 <div class="metric" role="listitem"> 165 - <div class="num"> <1h</div>166 - <div class="label"> Averageservicedowntime during upgrades</div>175 + <div class="num">99.9%</div> 176 + <div class="label">Planned uptime during upgrades*</div> 167 167 </div> 168 168 <div class="metric" role="listitem"> 169 169 <div class="num">24–48h</div> ... ... @@ -186,7 +186,7 @@ 186 186 <div class="steps"> 187 187 <div class="step"> 188 188 <h3>1) Assess</h3> 189 - <p>Review environment, extensions, constraints, and risks withno surprises.</p>199 + <p>Review environment, extensions, constraints, and risks — no surprises.</p> 190 190 </div> 191 191 <div class="step"> 192 192 <h3>2) Plan</h3> ... ... @@ -214,7 +214,7 @@ 214 214 </details> 215 215 <details> 216 216 <summary>Do you offer support plans?</summary> 217 - <p>Yes ,from ad-hoc assistance to ongoing retainers with response-time guarantees and monthly health checks.</p>227 + <p>Yes — from ad-hoc assistance to ongoing retainers with response-time guarantees and monthly health checks.</p> 218 218 </details> 219 219 </div> 220 220 </section>
- XWiki.StyleSheetExtension[0]
-
- Code
-
... ... @@ -1,253 +1,206 @@ 1 -/* ========== Agnease Landing (LESS, scoped to .agnease-landing) ========== */ 2 -@brand: #00937D; 3 -@brand-strong: #007B6A; 4 -@text: #2D3A34; 5 -@muted: #5B6B64; 6 -@bg: #FFFFFF; 7 -@panel: #F7F9F8; 8 -@line: #E4ECE9; 9 -@radius: 16px; 10 -@radius-sm: 12px; 11 -@shadow-sm: 0 6px 20px rgba(0,0,0,.06); 12 -@shadow: 0 12px 36px rgba(0,0,0,.08); 13 -@maxw: 1140px; 14 - 15 -.agnease-landing { 16 - /* Base */ 17 - color: @text; 18 - font: 16px/1.6 Inter, Segoe UI, Roboto, system-ui, -apple-system, Arial, sans-serif; 19 - a { color: @brand; text-decoration: none; &:hover { color: @brand-strong; text-decoration: underline; } } 20 - img { max-width: 100%; display: block; } 21 - h1 { font-size: clamp(1.8rem, 2.5vw + .8rem, 3rem); line-height: 1.15; margin: .2rem 0 .6rem; } 22 - h2 { font-size: clamp(1.4rem, 1.4vw + .8rem, 2rem); line-height: 1.2; margin: .2rem 0 .4rem; } 23 - h3 { font-size: 1.12rem; margin: .2rem 0 .25rem; } 24 - .lead { color: @muted; max-width: 72ch; } 25 - .container { max-width: @maxw; margin-top: 5px; padding: 0;} 26 - 27 - /* Global sections */ 28 - section { padding: 32px 0; border-top: 1px solid @line; } 29 - section:first-of-type { border-top: none; } 30 - 31 - /* Buttons */ 32 - .btn { 33 - display: inline-flex; align-items: center; gap: .55rem; 34 - padding: .85rem 1.1rem; border-radius: 12px; border: 2px solid transparent; 35 - font-weight: 650; letter-spacing: .2px; cursor: pointer; box-shadow: @shadow-sm; 36 - 37 - &:focus-visible { outline: 3px solid @brand; outline-offset: 2px; } 38 - 39 - &-primary { 40 - background: @brand; color: #fff; 41 - &:hover, &:focus { background: @brand-strong; color: #fff; } 1 +/* ========= Agnease Landing (self-contained) ========= */ 2 + :root{ 3 + --brand:#00937D; /* primary (AA vs white) */ 4 + --brand-strong:#007B6A; /* hover/active */ 5 + --text:#2D3A34; /* body text (AAA on white) */ 6 + --muted:#5B6B64; /* secondary */ 7 + --bg:#FFFFFF; 8 + --panel:#F7F9F8; 9 + --line:#E4ECE9; 10 + --radius:16px; 11 + --radius-sm:12px; 12 + --shadow-sm:0 6px 20px rgba(0,0,0,.06); 13 + --shadow:0 12px 36px rgba(0,0,0,.08); 14 + --maxw:1140px; 42 42 } 43 - &-ghost { 44 - background: #fff; color: @brand; border-color: @brand; 45 - &:hover { color: @brand-strong; border-color: @brand-strong; } 46 - } 47 - } 48 48 49 - /* HERO (centered) */ 50 - .hero { 51 - &.hero-centered { 52 - text-align: center; 53 - background: 54 - radial-gradient(50rem 18rem at 50% -10%, #E7FFF8 0%, transparent 60%), 55 - radial-gradient(50rem 18rem at 50% 0%, #E8F6F3 0%, transparent 60%); 56 - display: flex; 57 - align-items: center; 58 - justify-content: center; 59 - min-height: 350px; /* reduced height */ 60 - /*padding: 48px 0; /* controlled vertical spacing */ 17 + *{box-sizing:border-box} 18 + html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font:16px/1.6 Inter, Segoe UI, Roboto, system-ui, -apple-system, Arial, sans-serif} 19 + img{max-width:100%;display:block} 20 + a{color:var(--brand);text-decoration:none} 21 + a:hover{color:var(--brand-strong);text-decoration:underline} 61 61 62 - .hero-inner { 63 - /*max-width: 760px;*/ 64 - margin: auto; 65 - display: flex; 66 - flex-direction: column; 67 - align-items: center; 68 - gap: 1rem; 69 - } 23 + .agnease-landing{isolation:isolate} 24 + .container{max-width:var(--maxw);margin:auto;padding:0 20px} 25 + h1{font-size:clamp(1.8rem,2.5vw + .8rem,3rem);line-height:1.15;margin:.2rem 0 .6rem} 26 + h2{font-size:clamp(1.4rem,1.4vw + .8rem,2rem);line-height:1.2;margin:.2rem 0 .4rem} 27 + h3{font-size:1.12rem;margin:.2rem 0 .25rem} 28 + .lead{color:var(--muted);max-width:72ch} 70 70 71 - h1 { 72 - font-size: clamp(1.9rem, 2.3vw + 1rem, 2.7rem); 73 - line-height: 1.15; 74 - margin: 0.4rem 0 0.5rem; 75 - } 30 + /* Buttons */ 31 + .btn{display:inline-flex;align-items:center;gap:.55rem;padding:.85rem 1.1rem;border-radius:12px;border:2px solid transparent;font-weight:650;letter-spacing:.2px;cursor:pointer;box-shadow:var(--shadow-sm)} 32 + .btn:focus-visible{outline:3px solid var(--brand);outline-offset:2px} 33 + .btn-primary{background:var(--brand);color:#fff} 34 + .btn-primary:hover{background:var(--brand-strong)} 35 + .btn-ghost{background:#fff;color:var(--brand);border-color:var(--brand)} 36 + .btn-ghost:hover{color:var(--brand-strong);border-color:var(--brand-strong)} 76 76 77 - .lead { 78 - color: @muted; 79 - /*max-width: 68ch;*/ 80 - margin: 0 auto 0.9rem; 81 - } 38 + /* Sections */ 39 + section{padding:68px 0;border-top:1px solid var(--line)} 40 + section:first-of-type{border-top:none} 82 82 83 - .hero-cta { 84 - display: flex; 85 - gap: 0.8rem; 86 - flex-wrap: wrap; 87 - justify-content: center; 88 - margin-top: 0.3rem; 89 - } 90 - 91 - .benefits { 92 - display: flex; 93 - flex-wrap: wrap; 94 - justify-content: center; 95 - list-style: none; 96 - padding: 0; 97 - margin: 0.8rem 0 0; 98 - color: @muted; 99 - font-size: 14px; 100 - gap: 5px; 101 - li { 102 - /*margin-left: 5px;*/ 103 - } 104 - li + li::before { 105 - content: "•"; 106 - margin-right: 5px; 107 - } 108 - } 42 + /* Hero */ 43 + .hero{ 44 + background: 45 + radial-gradient(60rem 22rem at 15% -10%, #E7FFF8 0%, transparent 60%), 46 + radial-gradient(60rem 22rem at 85% -20%, #E9F6F2 0%, transparent 60%); 109 109 } 110 - } 48 + .hero-top{display:grid;gap:22px;grid-template-columns:1fr} 49 + @media (min-width:860px){ .hero-top{grid-template-columns:1.05fr .95fr} } 50 + .chip{display:inline-block;background:var(--panel);border:1px solid var(--line);padding:.35rem .65rem;border-radius:999px;font-size:.82rem;color:var(--text)} 51 + .hero-badges{display:flex;flex-wrap:wrap;gap:.5rem} 52 + .hero-cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:10px} 53 + .hero-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:18px;box-shadow:var(--shadow)} 111 111 112 - /* === WHY CHOOSE (widgets with inline icon + title) === */ 113 - .widgets { 114 - display: grid; 115 - gap: 16px; 116 - grid-template-columns: 1fr; 117 - 118 - @media (min-width: 860px) { 119 - grid-template-columns: repeat(4, 1fr); 55 + /* “Why Agnease” widgets */ 56 + .widgets{display:grid;gap:16px;grid-template-columns:1fr} 57 + @media (min-width:860px){ .widgets{grid-template-columns:repeat(4,1fr)} } 58 + .widget{ 59 + background:#fff;border:1px solid var(--line);border-radius:var(--radius); 60 + padding:18px;box-shadow:var(--shadow-sm);display:grid;gap:8px;align-content:start 120 120 } 121 - } 122 - 123 - .widget { 124 - background: #fff; 125 - border: 1px solid @line; 126 - border-radius: @radius; 127 - padding: 18px; 128 - box-shadow: @shadow-sm; 129 - display: flex; 130 - flex-direction: column; 131 - justify-content: flex-start; 132 - gap: 8px; 133 - text-align: left; 134 - transition: transform 0.18s ease, box-shadow 0.18s ease; 135 - 136 - &:hover { 137 - transform: translateY(-2px); 138 - box-shadow: @shadow; 62 + .widget .icon{ 63 + width:38px;height:38px;border-radius:10px;background:var(--panel);display:grid;place-items:center;border:1px solid var(--line) 139 139 } 65 + .widget p{color:var(--muted);margin:0} 140 140 141 - /* The icon + title row */ 142 - .icon { 143 - display: flex; 144 - align-items: center; 145 - gap: 10px; 146 - padding: 6px 0; 147 - border-bottom: 1px solid fade(@line, 60%); 148 - margin-bottom: 6px; 149 - 150 - svg { 151 - width: 24px; 152 - height: 24px; 153 - flex-shrink: 0; 154 - stroke: @text; 155 - } 156 - 157 - h3 { 158 - 159 - font-weight: 700; 160 - margin: 0; 161 - color: @text; 162 - line-height: 1.2; 163 - } 67 + /* Services grid with details drawers */ 68 + .services{display:grid;gap:16px;grid-template-columns:1fr} 69 + @media (min-width:920px){ .services{grid-template-columns:repeat(3,1fr)} } 70 + .card{ 71 + background:#fff;border:1px solid var(--line);border-radius:var(--radius); 72 + padding:18px;box-shadow:var(--shadow-sm);transition:transform .18s ease, box-shadow .18s ease 164 164 } 74 + .card:hover{transform:translateY(-2px);box-shadow:var(--shadow)} 75 + .card p{color:var(--muted);margin:0} 76 + .card details{margin-top:.6rem;border-top:1px dashed var(--line);padding-top:.6rem} 77 + .card summary{cursor:pointer;font-weight:650} 165 165 166 - /* Body paragraph */ 167 - p { 168 - color: @muted; 169 - margin: 0; 170 - line-height: 1.45; 79 + /* Metrics band */ 80 + .metrics{ 81 + display:grid;gap:14px;grid-template-columns:repeat(2,1fr) 171 171 } 172 - } 83 + @media (min-width:720px){ .metrics{grid-template-columns:repeat(4,1fr)} } 84 + .metric{ 85 + background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px;text-align:center;box-shadow:var(--shadow-sm) 86 + } 87 + .metric .num{font-size:1.6rem;font-weight:800;color:var(--brand)} 88 + .metric .label{color:var(--muted);font-size:.92rem} 173 173 174 - /* SERVICES */ 175 - .services { 176 - display: grid; gap: 16px; grid-template-columns: 1fr; 177 - @media (min-width: 920px) { grid-template-columns: repeat(3, 1fr); } 178 - } 179 - .card { 180 - background: #fff; border: 1px solid @line; border-radius: @radius; 181 - padding: 18px; box-shadow: @shadow-sm; transition: transform .18s ease, box-shadow .18s ease; 90 + /* Process steps */ 91 + .steps{display:grid;gap:16px;grid-template-columns:1fr} 92 + @media (min-width:860px){ .steps{grid-template-columns:repeat(3,1fr)} } 93 + .step{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:18px;box-shadow:var(--shadow-sm)} 182 182 183 - &:hover { transform: translateY(-2px); box-shadow: @shadow; } 184 - p { color: @muted; margin: 0; } 185 - details { 186 - margin-top: .6rem; border-top: 1px dashed @line; padding-top: .6rem; 187 - summary { cursor: pointer; font-weight: 650; } 188 - } 189 - } 95 + /* FAQ */ 96 + .faq details{border:1px solid var(--line);border-radius:var(--radius-sm);padding:.75rem .9rem;background:#fff;margin:.6rem 0} 97 + .faq summary{cursor:pointer;font-weight:650} 98 + .faq details[open]{box-shadow:var(--shadow-sm)} 190 190 191 - /* METRICS */ 192 - .metrics { 193 - display: grid; gap: 14px; grid-template-columns: repeat(2, 1fr); 194 - @media (min-width: 720px) { grid-template-columns: repeat(4, 1fr); } 195 - .metric { 196 - background: #fff; border: 1px solid @line; border-radius: 14px; padding: 16px; text-align: center; box-shadow: @shadow-sm; 197 - .num { font-size: 1.6rem; font-weight: 800; color: @brand; } 198 - .label { color: @muted; font-size: .92rem; } 100 + /* CTA band */ 101 + .cta-band{ 102 + background:#fff;border:1px solid var(--line);border-radius:var(--radius); 103 + padding:20px;box-shadow:var(--shadow);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 199 199 } 200 - } 105 +/* Keep primary CTA text white on hover */ 106 +.btn-primary, 107 +.btn-primary:hover, 108 +.btn-primary:focus { 109 + color: #fff; 110 +} 201 201 202 - /* PROCESS */ 203 - .steps { 204 - display: grid; gap: 16px; grid-template-columns: 1fr; 205 - @media (min-width: 860px) { grid-template-columns: repeat(3, 1fr); } 206 - .step { 207 - background: #fff; border: 1px solid @line; border-radius: @radius; padding: 18px; box-shadow: @shadow-sm; 208 - } 209 - } 112 +/* Benefits row under CTAs for quick scannability */ 113 +.benefits { 114 + display:flex;flex-wrap:wrap;gap:.5rem 1rem; 115 + margin:10px 0 0; padding:0; list-style:none; color:#5B6B64; 116 +} 210 210 211 - /* FAQ */ 212 - .faq { 213 - details { 214 - border: 1px solid @line; border-radius: @radius-sm; padding: .75rem .9rem; background: #fff; margin: .6rem 0; 215 - summary { cursor: pointer; font-weight: 650; } 216 - &[open] { box-shadow: @shadow-sm; } 217 - } 218 - } 118 +/* Assurance widgets layout (right column) */ 119 +.widgets { 120 + display:grid; gap:12px; 121 + grid-template-columns:1fr; align-content:start; 122 +} 123 +.widget { 124 + display:grid; grid-template-columns:auto 1fr; gap:10px; 125 + background:#fff; border:1px solid #E4ECE9; border-radius:16px; 126 + padding:14px; box-shadow:0 6px 20px rgba(0,0,0,.06); 127 +} 128 +.widget h3 { margin:.1rem 0 .15rem; font-size:1rem } 129 +.widget p { margin:0; color:#5B6B64 } 130 +.widget .icon { 131 + width:38px;height:38px;border-radius:10px; 132 + background:#F7F9F8;border:1px solid #E4ECE9; 133 + display:grid;place-items:center; 134 +} 219 219 220 - /* CTA BAND */ 221 - #contact { 222 - .cta-band { 223 - background: #fff; border: 1px solid @line; border-radius: @radius; 224 - padding: 20px; box-shadow: @shadow; 225 - display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; 226 - } 227 - } 136 +/* Ensure the hero two-column balance feels filled */ 137 +.hero-top { display:grid; gap:22px; grid-template-columns:1fr } 138 +@media (min-width:860px){ 139 + .hero-top { grid-template-columns:1.15fr .85fr } 140 +} 141 +/* Centered hero layout */ 142 +.hero-centered { 143 + text-align:center; 144 + background: 145 + radial-gradient(60rem 24rem at 50% -20%, #E7FFF8 0%, transparent 60%), 146 + radial-gradient(60rem 24rem at 50% -10%, #E8F6F3 0%, transparent 60%); 147 + display:flex; align-items:center; justify-content:center; 148 + min-height:70vh; 149 +} 228 228 229 - /* ===== Prevent horizontal overflow ===== */ 230 - html, body { 231 - overflow-x: hidden; 232 - } 151 +.hero-inner { 152 + max-width:780px; 153 + margin:auto; 154 + display:flex; 155 + flex-direction:column; 156 + align-items:center; 157 + gap:1.2rem; 158 +} 233 233 234 - /* Ensureherogradientsdon't bleed */235 - .hero {236 - overflow: hidden; /* contain background overflow */237 - background-repeat:no-repeat;238 - background-attachment:scroll;239 - }160 +.hero-badges { 161 + display:flex; 162 + gap:.5rem; 163 + flex-wrap:wrap; 164 + justify-content:center; 165 +} 240 240 241 - /* Fix possiblegridorcardovershoot*/242 - .container{243 - max-width:100%;244 - overflow-x: clip; /* hidessubtlepixel overflow without scroll */245 - }167 +.hero-centered h1 { 168 + font-size:clamp(1.8rem,2.5vw + .8rem,3rem); 169 + line-height:1.15; 170 + margin:.3rem 0 .4rem; 171 +} 246 246 247 - /* Safety for large paddings/margins that might extend */ 248 - section, .widgets, .services, .metrics, .steps { 249 - margin-left: auto; 250 - margin-right: auto; 251 - } 173 +.hero-centered .lead { 174 + color:#5B6B64; 175 + max-width:70ch; 176 + margin:0 auto 1.2rem; 252 252 } 253 253 179 +/* CTA buttons centered */ 180 +.hero-cta { 181 + display:flex; 182 + gap:.8rem; 183 + flex-wrap:wrap; 184 + justify-content:center; 185 + margin-top:.5rem; 186 +} 187 + 188 +.btn-primary, 189 +.btn-primary:hover, 190 +.btn-primary:focus { 191 + background:#00937D; 192 + color:#fff !important; /* ensure white text always */ 193 +} 194 + 195 +/* Benefits under CTAs */ 196 +.benefits { 197 + display:flex; 198 + flex-wrap:wrap; 199 + justify-content:center; 200 + gap:.6rem 1.2rem; 201 + list-style:none; 202 + padding:0; 203 + margin:.8rem 0 0; 204 + color:#5B6B64; 205 + font-size:.95rem; 206 +} - Content Type
-
... ... @@ -1,1 +1,1 @@ 1 - LESS1 +CSS