Systems Secured | Branded and Booked

Phylicia Daniel

7mo

posted in

Section Code

<style>

.svc3-wrap{

background:#0b72a6;

padding:70px 18px 90px;

font-family:Montserrat, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;

color:#fff;

}

.svc3{

max-width:1180px;

margin:0 auto;

text-align:center;

}

.svc3-title{

font-size:28px;

font-weight:800;

letter-spacing:2px;

text-transform:uppercase;

margin:0 0 10px;

}

.svc3-sub{

margin:0 auto 44px;

max-width:760px;

opacity:.92;

line-height:1.6;

font-size:15.5px;

}

.svc3-grid{

display:grid;

grid-template-columns:repeat(3, minmax(0,1fr));

gap:44px;

}

.svc-card{

display:flex;

flex-direction:column;

align-items:center;

text-align:center;

padding:6px 8px 0;

}

.svc-badge{

width:270px;

height:270px;

border-radius:50%;

position:relative;

display:grid;

place-items:center;

margin-bottom:22px;

background:

radial-gradient(circle at center, transparent 63%, #f1d278 66%, #c58e2c 76%, transparent 78%),

radial-gradient(circle at 35% 30%, rgba(255,255,255,.22), transparent 55%);

filter:drop-shadow(0 18px 28px rgba(0,0,0,.35));

transition: transform .25s ease, filter .25s ease;

}

.svc-badge::before{

content:"";

position:absolute;

inset:18px;

border-radius:50%;

background:linear-gradient(135deg,#1caa68,#00784e);

box-shadow: inset 0 0 0 1px rgba(255,255,255,.10);

}

.svc-thumb{

position:relative;

z-index:2;

width:230px;

height:230px;

display:grid;

place-items:center;

}

.svc-thumb img{

width:100%;

height:100%;

object-fit:contain;

filter:drop-shadow(0 16px 24px rgba(0,0,0,.4));

transform: translateY(-4px);

}

.svc-card:hover .svc-badge{

transform: translateY(-7px);

filter: drop-shadow(0 24px 34px rgba(0,0,0,.42));

}

.svc-name{

font-size:22px;

font-weight:800;

margin:4px 0 10px;

}

.svc-desc{

font-size:15.5px;

line-height:1.7;

max-width:320px;

opacity:.95;

margin: 0;

}

.svc-actions{

display:flex;

gap:10px;

align-items:center;

justify-content:center;

flex-wrap:wrap;

margin-top:16px;

}

/* Primary button */

.svc-btn{

padding:10px 24px;

font-size:14px;

font-weight:800;

border-radius:999px;

background:#fff;

color:#0b72a6;

text-decoration:none;

transition:all .25s ease;

display:inline-flex;

align-items:center;

justify-content:center;

min-width: 140px;

}

.svc-btn:hover{

background:#f1d278;

color:#0b0b0b;

transform:translateY(-2px);

}

/* Toggle button */

.svc-toggle{

padding:10px 18px;

font-size:14px;

font-weight:800;

border-radius:999px;

background: rgba(255,255,255,.14);

color:#fff;

border:1px solid rgba(255,255,255,.30);

cursor:pointer;

transition:all .25s ease;

display:inline-flex;

align-items:center;

gap:10px;

}

.svc-toggle:hover{

background: rgba(255,255,255,.22);

transform:translateY(-2px);

}

.svc-toggle .chev{

width: 10px;

height: 10px;

border-right: 2px solid #fff;

border-bottom: 2px solid #fff;

transform: rotate(45deg);

transition: transform .25s ease;

margin-top:-2px;

}

/* Expand area */

.svc-more{

width:100%;

max-width: 360px;

margin-top:14px;

text-align:left;

background: rgba(0,0,0,.12);

border: 1px solid rgba(255,255,255,.18);

border-radius: 14px;

padding: 14px 14px;

overflow:hidden;

max-height: 0;

padding-top: 0;

padding-bottom: 0;

opacity: 0;

transition: max-height .35s ease, opacity .25s ease, padding .25s ease;

}

.svc-more p{

margin: 0 0 10px;

line-height: 1.65;

opacity:.96;

font-size: 14.5px;

}

.svc-more ul{

margin: 0;

padding-left: 18px;

}

.svc-more li{

margin: 6px 0;

line-height: 1.5;

font-size: 14.5px;

}

/* Open state */

.svc-card.is-open .svc-more{

max-height: 420px; /* enough room for content */

opacity: 1;

padding: 14px 14px;

}

.svc-card.is-open .svc-toggle .chev{

transform: rotate(-135deg); /* points up */

margin-top: 2px;

}

@media(max-width:980px){

.svc3-grid{grid-template-columns:1fr; gap:36px;}

.svc-badge{width:250px;height:250px;}

.svc-thumb{width:210px;height:210px;}

}

</style>

<div class="svc3-title">Service We Offer</div>

Choose the support you need — tap <strong>Show details</strong> to see what’s included and how we help you move faster with confidence.

</p>

</div>

<div class="svc-name">Credit Repair</div>

<p class="svc-desc">Dispute support, strategy, and guidance to help improve your credit profile.</p>

<a href="#" class="svc-btn">Get Started</a>

Show details <span class="chev"></span>

</button>

</div>

<p><strong>What you can expect:</strong></p>

<ul>

<li>Personalized credit review + action plan</li>

<li>Dispute support for inaccurate items</li>

<li>Ongoing progress tracking & tips</li>

<li>Education to help you maintain results</li>

</ul>

</div>

</div>

<div class="svc-name">Bookkeeping</div>

<p class="svc-desc">Clean, consistent books so you can make decisions with real numbers.</p>

<a href="#" class="svc-btn">Get Started</a>

Show details <span class="chev"></span>

</button>

</div>

<p><strong>What’s included:</strong></p>

<ul>

<li>Monthly categorization & reconciliation</li>

<li>Profit & loss reporting</li>

<li>Cleanup options (if you’re behind)</li>

<li>Year-round support for tax readiness</li>

</ul>

</div>

</div>

<div class="svc-name">Tax Preparation</div>

<p class="svc-desc">File accurately, maximize eligible deductions, and stay compliant.</p>

<a href="#" class="svc-btn">Get Started</a>

Show details <span class="chev"></span>

</button>

</div>

<ul>

<li>Individual & small business filing support</li>

<li>Organized document checklist</li>

<li>Guidance for common deductions/credits</li>

<li>Next-step recommendations after filing</li>

</ul>

</div>

</section>

(function(){

var cards = document.querySelectorAll('.svc-card');

function closeAll(except){

cards.forEach(function(c){

if(except && c === except) return;

c.classList.remove('is-open');

var btn = c.querySelector('.svc-toggle');

if(btn) btn.setAttribute('aria-expanded','false');

});

}

cards.forEach(function(card){

var btn = card.querySelector('.svc-toggle');

if(!btn) return;

btn.addEventListener('click', function(){

var isOpen = card.classList.contains('is-open');

closeAll(card); /* accordion behavior (only one open) */

card.classList.toggle('is-open', !isOpen);

btn.setAttribute('aria-expanded', String(!isOpen));

});

})();

</script>

Phylicia Daniel

7mo

posted in

First Live Workshop!

As members you get an exclusive discount to any live workshop. If you would like to attend enter the code ssmember25 to gain access. This code should not be shared with anyone outside of the group.

Registration Now Open: https://brandedandbanked.app.clientclub.net/.../b572188d...

Phylicia Daniel

7mo

posted in

Live Session in One Hour

If you will be attending tonight night cap, please comment or like below.

Scroll to load more

Public Group

Systems Secured

Class series on marketing, content, and CRM systems.

Members

Posts

Admins