Fix colors

This commit is contained in:
Philip Peterson 2026-06-03 19:12:53 -07:00
parent e9bce5aac8
commit 2f624f73ba
7 changed files with 1929 additions and 47 deletions

File diff suppressed because one or more lines are too long

View file

@ -5,6 +5,9 @@
@tailwind utilities; @tailwind utilities;
@layer base { @layer base {
html {
background-color: theme('colors.pt-blue.400');
}
/* Neutralise any theme container constraints */ /* Neutralise any theme container constraints */
.page-wrapper { .page-wrapper {
max-width: none; max-width: none;
@ -27,7 +30,7 @@
order: 10; order: 10;
width: 100%; width: 100%;
background: #fff; background: #fff;
border-top: 1px solid #e5e7eb; border-top: 1px solid theme('colors.gray.200');
max-height: 0; max-height: 0;
overflow: hidden; overflow: hidden;
opacity: 0; opacity: 0;

View file

@ -18,7 +18,7 @@ function ApptType() {
return html` return html`
<div> <div>
<p class="text-xs tracking-widest uppercase text-[#306f8e] font-semibold mb-5">Select Appointment Type</p> <p class="text-xs tracking-widest uppercase text-pt-blue-500 font-semibold mb-5">Select Appointment Type</p>
<div class="grid grid-cols-1 sm:grid-cols-2 gap-3"> <div class="grid grid-cols-1 sm:grid-cols-2 gap-3">
${TYPES.map(function (t) { ${TYPES.map(function (t) {
var active = selected === t.id; var active = selected === t.id;
@ -29,12 +29,12 @@ function ApptType() {
style="text-align:left; cursor:pointer;" style="text-align:left; cursor:pointer;"
class=${ class=${
"flex items-center gap-4 p-4 w-full rounded-xl border transition-colors " + "flex items-center gap-4 p-4 w-full rounded-xl border transition-colors " +
(active ? "bg-[#306f8e] border-[#306f8e]" : "bg-white border-[#b8d4dc] hover:border-[#306f8e]") (active ? "bg-pt-blue-500 border-pt-blue-500" : "bg-white border-pt-blue-200 hover:border-pt-blue-500")
} }
> >
<div class=${ <div class=${
"w-8 h-8 rounded-full shrink-0 flex items-center justify-center border " + "w-8 h-8 rounded-full shrink-0 flex items-center justify-center border " +
(active ? "border-white/60" : "border-[#b8d4dc]") (active ? "border-white/60" : "border-pt-blue-200")
}> }>
${active ? CHECK : null} ${active ? CHECK : null}
</div> </div>
@ -42,7 +42,7 @@ function ApptType() {
<p class=${"font-serif text-[1.0625rem] font-normal leading-snug " + (active ? "text-white" : "text-gray-900")}> <p class=${"font-serif text-[1.0625rem] font-normal leading-snug " + (active ? "text-white" : "text-gray-900")}>
${t.label} ${t.label}
</p> </p>
<p class=${"text-[0.6875rem] tracking-widest font-semibold mt-0.5 " + (active ? "text-white/70" : "text-[#306f8e]")}> <p class=${"text-[0.6875rem] tracking-widest font-semibold mt-0.5 " + (active ? "text-white/70" : "text-pt-blue-500")}>
${t.duration} ${t.duration}
</p> </p>
</div> </div>

View file

@ -4,27 +4,27 @@ import { html } from "https://esm.sh/htm@3/preact";
const TESTIMONIALS = [ const TESTIMONIALS = [
{ {
name: "Sarah M.", category: "Sports Rehab Patient", initials: "SM", color: "#8ab4be", name: "Sarah M.", category: "Sports Rehab Patient", initials: "SM", bgClass: "bg-pt-blue-400",
quote: "After my ACL tear I was terrified I'd never run again. The team here built a plan that had me back on the field in four months. Every session felt purposeful.", quote: "After my ACL tear I was terrified I'd never run again. The team here built a plan that had me back on the field in four months. Every session felt purposeful.",
}, },
{ {
name: "Leon N.", category: "Neurology Patient", initials: "LN", color: "#a3bfc8", name: "Leon N.", category: "Neurology Patient", initials: "LN", bgClass: "bg-pt-blue-300",
quote: "Every new patient begins with a comprehensive diagnostic assessment. From there, they create a fully personalized treatment plan -- whether that means returning to sport, recovering from surgery, or restoring function.", quote: "Every new patient begins with a comprehensive diagnostic assessment. From there, they create a fully personalized treatment plan -- whether that means returning to sport, recovering from surgery, or restoring function.",
}, },
{ {
name: "Diana K.", category: "Surgery Rehab Patient", initials: "DK", color: "#7aa3af", name: "Diana K.", category: "Surgery Rehab Patient", initials: "DK", bgClass: "bg-pt-sage-400",
quote: "Six weeks post-hip replacement and I was walking without a cane -- weeks ahead of what my surgeon expected. The therapists here are genuinely invested in your outcome, not just checking boxes.", quote: "Six weeks post-hip replacement and I was walking without a cane -- weeks ahead of what my surgeon expected. The therapists here are genuinely invested in your outcome, not just checking boxes.",
}, },
{ {
name: "Marcus T.", category: "Sports Rehab Patient", initials: "MT", color: "#6b9dab", name: "Marcus T.", category: "Sports Rehab Patient", initials: "MT", bgClass: "bg-pt-sage-500",
quote: "I came in with chronic shoulder pain that three other clinics couldn't resolve. Two months in, I'm lifting overhead for the first time in years. The diagnostic process here is legitimately different.", quote: "I came in with chronic shoulder pain that three other clinics couldn't resolve. Two months in, I'm lifting overhead for the first time in years. The diagnostic process here is legitimately different.",
}, },
{ {
name: "Rachel O.", category: "Surgery Rehab Patient", initials: "RO", color: "#93b8c3", name: "Rachel O.", category: "Surgery Rehab Patient", initials: "RO", bgClass: "bg-pt-blue-300",
quote: "The booking process is seamless and the staff remembers you. I never felt like just another patient. My recovery from rotator cuff surgery exceeded every milestone.", quote: "The booking process is seamless and the staff remembers you. I never felt like just another patient. My recovery from rotator cuff surgery exceeded every milestone.",
}, },
{ {
name: "James P.", category: "Neurology Patient", initials: "JP", color: "#80aab5", name: "James P.", category: "Neurology Patient", initials: "JP", bgClass: "bg-pt-blue-400",
quote: "After my stroke the neurological therapy program here gave me my independence back. The team combined manual therapy with targeted exercise in a way that made real, measurable progress every single week.", quote: "After my stroke the neurological therapy program here gave me my independence back. The team combined manual therapy with targeted exercise in a way that made real, measurable progress every single week.",
}, },
]; ];
@ -104,7 +104,7 @@ function Testimonials() {
<div class="px-6 py-16"> <div class="px-6 py-16">
<div ref=${containerRef} style="max-width:1200px; margin:0 auto"> <div ref=${containerRef} style="max-width:1200px; margin:0 auto">
<div class="mb-10"> <div class="mb-10">
<p class="text-xs tracking-widest uppercase text-[#306f8e] font-semibold mb-4">Testimonials</p> <p class="text-xs tracking-widest uppercase text-pt-blue-500 font-semibold mb-4">Testimonials</p>
<div class="flex items-end gap-6"> <div class="flex items-end gap-6">
<h2 class="text-[clamp(1.75rem,3vw,2.5rem)] font-serif font-normal text-gray-900 leading-tight max-w-[520px]"> <h2 class="text-[clamp(1.75rem,3vw,2.5rem)] font-serif font-normal text-gray-900 leading-tight max-w-[520px]">
Don${String.fromCharCode(8217)}t take our word for it.<br />Hear it from our patients! Don${String.fromCharCode(8217)}t take our word for it.<br />Hear it from our patients!
@ -136,13 +136,12 @@ function Testimonials() {
${TESTIMONIALS.map(function (t, i) { return html` ${TESTIMONIALS.map(function (t, i) { return html`
<div key=${i} style=${{ width: CARD_W + "px", flexShrink: 0 }} class="border border-gray-200 rounded-lg p-6 flex flex-col gap-5 bg-white"> <div key=${i} style=${{ width: CARD_W + "px", flexShrink: 0 }} class="border border-gray-200 rounded-lg p-6 flex flex-col gap-5 bg-white">
<div <div
class="w-14 h-14 rounded-full flex items-center justify-center text-white font-semibold text-base shrink-0" class=${"w-14 h-14 rounded-full flex items-center justify-center text-white font-semibold text-base shrink-0 " + t.bgClass}
style=${{ backgroundColor: t.color }}
>${t.initials}</div> >${t.initials}</div>
<p class="text-[15px] text-gray-700 leading-relaxed flex-1">${t.quote}</p> <p class="text-[15px] text-gray-700 leading-relaxed flex-1">${t.quote}</p>
<div> <div>
<p class="text-xl font-serif text-gray-900 mb-0.5">${t.name}</p> <p class="text-xl font-serif text-gray-900 mb-0.5">${t.name}</p>
<p class="text-xs tracking-widest uppercase text-[#306f8e] font-semibold">${t.category}</p> <p class="text-xs tracking-widest uppercase text-pt-blue-500 font-semibold">${t.category}</p>
</div> </div>
</div> </div>
`; })} `; })}

View file

@ -11,8 +11,8 @@ function Toggle({ label = 'Toggle' }) {
setChecked(c => !c) setChecked(c => !c)
}} }}
aria-pressed=${checked} aria-pressed=${checked}
class=${`flex items-center gap-2 px-4 py-2 rounded-full border-2 border-[#306f8e] text-sm font-medium cursor-pointer transition-colors ${ class=${`flex items-center gap-2 px-4 py-2 rounded-full border-2 border-pt-blue-500 text-sm font-medium cursor-pointer transition-colors ${
checked ? 'bg-[#306f8e] text-white' : 'bg-transparent text-[#306f8e]' checked ? 'bg-pt-blue-500 text-white' : 'bg-transparent text-pt-blue-500'
}`} }`}
> >
<span class="w-3 h-3 rounded-full bg-current"></span> <span class="w-3 h-3 rounded-full bg-current"></span>

View file

@ -1,16 +1,26 @@
<header class="rpt-header relative md:fixed md:top-0 md:left-0 md:right-0 md:z-50 p-5 bg-white shadow-sm" role="banner"> <header class="rpt-header relative md:fixed md:top-0 md:left-0 md:right-0 md:z-50 p-5 bg-white shadow-sm" role="banner">
<div class="flex flex-wrap items-center md:h-full max-w-[1200px] mx-auto px-6 gap-y-0 gap-x-8 md:gap-8"> <div class="flex flex-wrap items-center md:h-full max-w-[1200px] mx-auto px-6 gap-y-0 gap-x-8 md:gap-8">
<a class="text-lg font-bold text-[#306f8e] no-underline whitespace-nowrap shrink-0 hover:text-[#285a6e]" <a class="text-lg font-bold text-pt-blue-500 no-underline whitespace-nowrap shrink-0 hover:text-[pt-blue-600]"
href="{{ home_url }}">{{ site_name }}</a> href="{{ home_url }}">{{ site_name }}</a>
<nav class="flex-1 min-w-0" id="rpt-main-nav" aria-label="Main navigation"> <nav class="flex-1 min-w-0" id="rpt-main-nav" aria-label="Main navigation">
<ul class="flex items-center list-none m-0 p-0 gap-1"> <ul class="flex items-center list-none my-3 md:my-0 md:m-0 p-0 gap-1">
{% for item in menu_items %} {% for item in menu_items %}
{% if not item.is_cta %} {% if not item.is_cta %}
<li> <li>
<a class="block text-[15px] text-gray-700 no-underline px-3.5 py-1 hover:text-[#1e3a8a]{% if current_path == item.url %} text-[#1e3a8a] font-medium{% endif %}" <a class="
href="{{ item.url }}">{{ item.title }}</a> block text-[15px] text-gray-700 no-underline md:px-3.5
py-3
md:py-1
hover:text-[blue-900]
hover:bg-gray-100
md:hover:bg-transparent
{% if current_path == item.url %}
text-[blue-900] font-medium
{% endif %}
"
href="{{ item.url }}">{{ item.title }}</a>
</li> </li>
{% endif %} {% endif %}
{% endfor %} {% endfor %}
@ -25,10 +35,10 @@
{% for item in menu_items %} {% for item in menu_items %}
{% if item.is_cta %} {% if item.is_cta %}
{% if item.title == 'Contact' %} {% if item.title == 'Contact' %}
<a class="inline-block px-5 py-2 rounded-none bg-white text-[#306f8e] text-sm font-medium no-underline rounded border-2 border-[#306f8e] whitespace-nowrap transition-colors hover:bg-[#e8f2f6] hover:text-[#285a6e]" <a class="inline-block px-5 py-2 rounded-none bg-white text-pt-blue-500 text-sm font-medium no-underline rounded border-2 border-pt-blue-500 whitespace-nowrap transition-colors hover:bg-pt-blue-50 hover:text-[pt-blue-600]"
href="{{ item.url }}">{{ item.title }}</a> href="{{ item.url }}">{{ item.title }}</a>
{% else %} {% else %}
<a class="inline-block px-5 py-2 rounded-none bg-[#306f8e] text-white text-sm font-medium no-underline rounded border border-[#1e3a5f] whitespace-nowrap transition-colors hover:bg-[#1f5a6e] hover:border-[#1f5a6e] hover:text-white" <a class="inline-block px-5 py-2 rounded-none bg-pt-blue-500 text-white text-sm font-medium no-underline rounded border border-pt-navy whitespace-nowrap transition-colors hover:bg-pt-blue-600 hover:border-pt-blue-600 hover:text-white"
href="{{ item.url }}">{{ item.title }}</a> href="{{ item.url }}">{{ item.title }}</a>
{% endif %} {% endif %}
{% endif %} {% endif %}
@ -43,9 +53,9 @@
aria-expanded="false" aria-expanded="false"
aria-controls="rpt-main-nav" aria-controls="rpt-main-nav"
aria-label="Toggle navigation"> aria-label="Toggle navigation">
<span class="block h-1 bg-[#1e3a5f] rounded-[3px] w-[45%] transition-transform duration-[250ms] ease-in-out"></span> <span class="block h-1 bg-pt-navy rounded-[3px] w-[45%] transition-transform duration-[250ms] ease-in-out"></span>
<span class="block h-1 bg-[#1e3a5f] rounded-[3px] w-full transition-[transform,opacity] duration-200 ease-in-out"></span> <span class="block h-1 bg-pt-navy rounded-[3px] w-full transition-[transform,opacity] duration-200 ease-in-out"></span>
<span class="block h-1 bg-[#1e3a5f] rounded-[3px] w-[45%] self-end transition-transform duration-[250ms] ease-in-out"></span> <span class="block h-1 bg-pt-navy rounded-[3px] w-[45%] self-end transition-transform duration-[250ms] ease-in-out"></span>
</button> </button>
</div> </div>

View file

@ -1,4 +1,4 @@
<div class="bg-[linear-gradient(180deg,#83A1A1_0%,#86AAB6_100%)] pt-px"> <div class="bg-gradient-to-b from-pt-sage-400 to-pt-blue-400 pt-px">
<section class=" <section class="
relative md:mt-[78px] min-h-[480px] relative md:mt-[78px] min-h-[480px]
2xl:flex 2xl:flex
@ -19,11 +19,11 @@
<div class="absolute inset-0 bg-gradient-to-t from-black/60 via-black/30 to-transparent sm:hidden"></div> <div class="absolute inset-0 bg-gradient-to-t from-black/60 via-black/30 to-transparent sm:hidden"></div>
{# Box 2: Text — spacer 50% | text 40% | spacer 10% ; 2xl: solid teal panel, text padded to align with nav CTA #} {# Box 2: Text — spacer 50% | text 40% | spacer 10% ; 2xl: solid teal panel, text padded to align with nav CTA #}
<div class="relative flex min-h-[480px] pt-0 pb-4 2xl:flex-1 2xl:bg-[#86AAB6] 2xl:min-h-0 2xl:pb-0"> <div class="relative flex min-h-[480px] pt-0 pb-4 2xl:flex-1 2xl:bg-pt-blue-400 2xl:min-h-0 2xl:pb-0">
<div class="hidden sm:block sm:basis-[50%] sm:grow-[2] 2xl:hidden"></div> <div class="hidden sm:block sm:basis-[50%] sm:grow-[2] 2xl:hidden"></div>
<div class="basis-full sm:basis-[40%] sm:grow flex flex-col justify-end sm:justify-center px-6 sm:px-0 sm:pb-0 gap-[1vw] 2xl:basis-full 2xl:grow-0 2xl:pl-16 2xl:pr-12 2xl:justify-center"> <div class="basis-full sm:basis-[40%] sm:grow flex flex-col justify-end sm:justify-center px-6 sm:px-0 sm:pb-0 gap-[1vw] 2xl:basis-full 2xl:grow-0 2xl:pl-16 2xl:pr-12 2xl:justify-center">
<h1 <h1
class="mt-0 mb-[1vw] text-[clamp(1.5rem,3.5vw,3.25rem)] font-serif font-normal text-white leading-none [text-shadow:-56.21px_2.55px_10.22px_#0000001A]" class="mt-0 mb-[1vw] text-[clamp(1.5rem,3.5vw,3.25rem)] font-serif font-normal text-white leading-none [text-shadow:-56.21px_2.55px_10.22px_rgb(0_0_0/10%)]"
> >
Restore your strength.<br>Reclaim your life. Restore your strength.<br>Reclaim your life.
</h1> </h1>
@ -31,11 +31,11 @@
<div class="flex gap-4 flex-wrap items-center mt-[2vw]"> <div class="flex gap-4 flex-wrap items-center mt-[2vw]">
<a <a
href="/schedule" href="/schedule"
class="w-full sm:w-auto text-center max-sm:text-sm sm:text-[clamp(0.25rem,1vw,1.25vw)] px-[4em] py-[1em] bg-[#306f8e] text-white font-medium no-underline transition-colors border-2 border-[#306f8e] hover:bg-[#1f5a6e] hover:border-[#1f5a6e]" class="w-full sm:w-auto text-center max-sm:text-sm sm:text-[clamp(0.25rem,1vw,1.25vw)] px-[4em] py-[1em] bg-pt-blue-500 text-white font-medium no-underline transition-colors border-2 border-pt-blue-500 hover:bg-pt-blue-600 hover:border-pt-blue-600"
>Book An Appointment</a> >Book An Appointment</a>
<a <a
href="/services" href="/services"
class="hidden sm:inline-block text-[clamp(0.25rem,1vw,1.25vw)] px-[4em] py-[1em] bg-[#86AAB6] text-white font-medium no-underline transition-colors border-2 border-white hover:bg-[#6f8f96]" class="hidden sm:inline-block text-[clamp(0.25rem,1vw,1.25vw)] px-[4em] py-[1em] bg-pt-blue-400 text-white font-medium no-underline transition-colors border-2 border-white hover:bg-pt-sage-500"
>View Our Services</a> >View Our Services</a>
</div> </div>
</div> </div>
@ -47,46 +47,46 @@
<section class="py-16 px-6 bg-white"> <section class="py-16 px-6 bg-white">
<div class="max-w-[1040px] mx-auto mb-12"> <div class="max-w-[1040px] mx-auto mb-12">
<p class="text-sm tracking-widest uppercase text-[#306f8e] font-semibold text-center mb-2">Bringing Relief</p> <p class="text-sm tracking-widest uppercase text-pt-blue-500 font-semibold text-center mb-2">Bringing Relief</p>
<h2 class="text-[2.25rem] font-serif font-normal text-gray-900 leading-tight text-center">Our Wide Range of Physical Therapy Services</h2> <h2 class="text-[2.25rem] font-serif font-normal text-gray-900 leading-tight text-center">Our Wide Range of Physical Therapy Services</h2>
</div> </div>
<div class="grid grid-cols-1 sm:grid-cols-2 xl:grid-cols-4 gap-6 max-w-[1040px] mx-auto"> <div class="grid grid-cols-1 sm:grid-cols-2 xl:grid-cols-4 gap-6 max-w-[1040px] mx-auto">
<div class="flex flex-col border border-[#b8d4dc] bg-white overflow-hidden"> <div class="flex flex-col border border-pt-blue-200 bg-white overflow-hidden">
<img src="/modules/custom/riverside_pt/images/panels/1.jpg" alt="Diagnostic assessment" class="w-full h-48 object-cover" /> <img src="/modules/custom/riverside_pt/images/panels/1.jpg" alt="Diagnostic assessment" class="w-full h-48 object-cover" />
<div class="flex flex-col gap-4 p-6 flex-1"> <div class="flex flex-col gap-4 p-6 flex-1">
<h3 class="text-2xl font-normal text-gray-900">Diagnostic Assessment</h3> <h3 class="text-2xl font-normal text-gray-900">Diagnostic Assessment</h3>
<p class="text-[15px] text-gray-600 leading-relaxed flex-1">Your recovery starts with clarity. We perform a thorough evaluation of your condition, movement, and goals to create a precise, personalized treatment plan from day one.</p> <p class="text-[15px] text-gray-600 leading-relaxed flex-1">Your recovery starts with clarity. We perform a thorough evaluation of your condition, movement, and goals to create a precise, personalized treatment plan from day one.</p>
<a href="/services" class="inline-flex items-center gap-3 px-5 py-3 bg-[#306f8e] text-white text-[15px] font-medium no-underline hover:bg-[#1f5a6e]">More Info &rarr;</a> <a href="/services" class="inline-flex items-center gap-3 px-5 py-3 bg-pt-blue-500 text-white text-[15px] font-medium no-underline hover:bg-pt-blue-600">More Info &rarr;</a>
</div> </div>
</div> </div>
<div class="flex flex-col border border-[#b8d4dc] bg-white overflow-hidden"> <div class="flex flex-col border border-pt-blue-200 bg-white overflow-hidden">
<img src="/modules/custom/riverside_pt/images/panels/2.jpg?v=2" alt="Sports rehabilitation" class="w-full h-48 object-cover" /> <img src="/modules/custom/riverside_pt/images/panels/2.jpg?v=2" alt="Sports rehabilitation" class="w-full h-48 object-cover" />
<div class="flex flex-col gap-4 p-6 flex-1"> <div class="flex flex-col gap-4 p-6 flex-1">
<h3 class="text-2xl font-normal text-gray-900">Sports Rehabilitation</h3> <h3 class="text-2xl font-normal text-gray-900">Sports Rehabilitation</h3>
<p class="text-[15px] text-gray-600 leading-relaxed flex-1">We help athletes recover from injury and return to peak performance with targeted, sport-specific programs built around your body and your goals.</p> <p class="text-[15px] text-gray-600 leading-relaxed flex-1">We help athletes recover from injury and return to peak performance with targeted, sport-specific programs built around your body and your goals.</p>
<a href="/services" class="inline-flex items-center gap-3 px-5 py-3 bg-[#306f8e] text-white text-[15px] font-medium no-underline hover:bg-[#1f5a6e]">More Info &rarr;</a> <a href="/services" class="inline-flex items-center gap-3 px-5 py-3 bg-pt-blue-500 text-white text-[15px] font-medium no-underline hover:bg-pt-blue-600">More Info &rarr;</a>
</div> </div>
</div> </div>
<div class="flex flex-col border border-[#b8d4dc] bg-white overflow-hidden"> <div class="flex flex-col border border-pt-blue-200 bg-white overflow-hidden">
<img src="/modules/custom/riverside_pt/images/panels/3.jpg" alt="Pre and post-surgical rehab" class="w-full h-48 object-cover" /> <img src="/modules/custom/riverside_pt/images/panels/3.jpg" alt="Pre and post-surgical rehab" class="w-full h-48 object-cover" />
<div class="flex flex-col gap-4 p-6 flex-1"> <div class="flex flex-col gap-4 p-6 flex-1">
<h3 class="text-2xl font-normal text-gray-900">Pre/Post-Surgical Rehab</h3> <h3 class="text-2xl font-normal text-gray-900">Pre/Post-Surgical Rehab</h3>
<p class="text-[15px] text-gray-600 leading-relaxed flex-1">Expert care before and after surgery to reduce recovery time, minimize complications, and restore full strength and function.</p> <p class="text-[15px] text-gray-600 leading-relaxed flex-1">Expert care before and after surgery to reduce recovery time, minimize complications, and restore full strength and function.</p>
<a href="/services" class="inline-flex items-center gap-3 px-5 py-3 bg-[#306f8e] text-white text-[15px] font-medium no-underline hover:bg-[#1f5a6e]">More Info &rarr;</a> <a href="/services" class="inline-flex items-center gap-3 px-5 py-3 bg-pt-blue-500 text-white text-[15px] font-medium no-underline hover:bg-pt-blue-600">More Info &rarr;</a>
</div> </div>
</div> </div>
<div class="flex flex-col border border-[#b8d4dc] bg-white overflow-hidden"> <div class="flex flex-col border border-pt-blue-200 bg-white overflow-hidden">
<img src="/modules/custom/riverside_pt/images/panels/4.jpg" alt="Neurological physical therapy" class="w-full h-48 object-cover" /> <img src="/modules/custom/riverside_pt/images/panels/4.jpg" alt="Neurological physical therapy" class="w-full h-48 object-cover" />
<div class="flex flex-col gap-4 p-6 flex-1"> <div class="flex flex-col gap-4 p-6 flex-1">
<h3 class="text-2xl font-normal text-gray-900">Neurological Therapy</h3> <h3 class="text-2xl font-normal text-gray-900">Neurological Therapy</h3>
<p class="text-[15px] text-gray-600 leading-relaxed flex-1">Specialized therapy for nervous system conditions — helping you rebuild strength, coordination, and independence at every stage of recovery.</p> <p class="text-[15px] text-gray-600 leading-relaxed flex-1">Specialized therapy for nervous system conditions — helping you rebuild strength, coordination, and independence at every stage of recovery.</p>
<a href="/services" class="inline-flex items-center gap-3 px-5 py-3 bg-[#306f8e] text-white text-[15px] font-medium no-underline hover:bg-[#1f5a6e]">More Info &rarr;</a> <a href="/services" class="inline-flex items-center gap-3 px-5 py-3 bg-pt-blue-500 text-white text-[15px] font-medium no-underline hover:bg-pt-blue-600">More Info &rarr;</a>
</div> </div>
</div> </div>
</div> </div>
</section> </section>
<section class="bg-[#dde8f0] py-20 px-6 overflow-hidden"> <section class="bg-pt-blue-100 py-20 px-6 overflow-hidden">
<div class="max-w-[1200px] mx-auto flex flex-col md:flex-row gap-12 md:gap-20 items-center"> <div class="max-w-[1200px] mx-auto flex flex-col md:flex-row gap-12 md:gap-20 items-center">
<div class="flex-1 flex flex-col gap-8 min-w-0"> <div class="flex-1 flex flex-col gap-8 min-w-0">
@ -94,12 +94,12 @@
<p class="text-base text-gray-700 font-light leading-relaxed max-w-lg">Every new patient begins with a comprehensive diagnostic assessment. From there, we create a fully personalized treatment plan tailored to your goals — whether that means returning to sport, recovering from surgery, or restoring neurological function.</p> <p class="text-base text-gray-700 font-light leading-relaxed max-w-lg">Every new patient begins with a comprehensive diagnostic assessment. From there, we create a fully personalized treatment plan tailored to your goals — whether that means returning to sport, recovering from surgery, or restoring neurological function.</p>
<div class="flex gap-12 pt-4"> <div class="flex gap-12 pt-4">
<div class="font-hedvig text-center"> <div class="font-hedvig text-center">
<p class="text-[4.5rem] font-light text-[#306f8e] leading-none">15</p> <p class="text-[4.5rem] font-light text-pt-blue-500 leading-none">15</p>
<p class="text-xs tracking-widest uppercase text-[#306f8e] font-semibold mt-2">Years Open</p> <p class="text-xs tracking-widest uppercase text-pt-blue-500 font-semibold mt-2">Years Open</p>
</div> </div>
<div class="font-hedvig text-center"> <div class="font-hedvig text-center">
<p class="text-[4.5rem] text-[#306f8e] leading-none">300</p> <p class="text-[4.5rem] text-pt-blue-500 leading-none">300</p>
<p class="text-xs tracking-widest uppercase text-[#306f8e] font-semibold mt-2">Patients Served</p> <p class="text-xs tracking-widest uppercase text-pt-blue-500 font-semibold mt-2">Patients Served</p>
</div> </div>
</div> </div>
</div> </div>
@ -129,3 +129,5 @@
</section> </section>
<rpt-faq class="block"></rpt-faq> <rpt-faq class="block"></rpt-faq>
<div class="bg-pt-blue-400 h-[240px]"></div>