Theme Name:Foster Care-Sonnet 4 Description:A professional directory theme for Foster Care UK services Version:1 Author:Custom Theme */ *{margin:0;padding:0;box-sizing:border-box}body{font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;line-height:1.6;color:#333;background-color:#f8f9fa}.container{max-width:1200px;margin:0 auto;padding:0 20px}.site-main .container{max-width:none;width:100%}.site-main .section{width:100%;overflow:visible}.site-header{background:#fff;box-shadow:0 2px 10px rgb(0 0 0 / .1)}.header-content{display:flex;justify-content:space-between;align-items:center;padding:1rem 0}.site-logo img{max-height:140px;width:auto}.main-navigation ul{display:flex;list-style:none;gap:2rem}.main-navigation a{text-decoration:none;color:#333;font-weight:500;transition:color 0.3s ease}.main-navigation a:hover{color:#007cba}.hero-section{background:linear-gradient(rgb(0 124 186 / .6),rgb(0 124 186 / .6)),url(/wp-content/themes/Foster_care_uk_sonnet4/assets/hero-section.png);background-size:cover;background-position:center;color:#fff;text-align:center;padding:100px 0}.hero-content h1{font-size:3rem;margin-bottom:1rem;font-weight:700}.hero-content p{font-size:1.2rem;max-width:600px;margin:0 auto}.cards-grid{display:grid;gap:2rem;margin:2rem 0}.cards-grid.cols-2{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}.cards-grid.cols-3{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}.cards-grid.cols-4{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}.card{background:#fff;border-radius:12px;box-shadow:0 4px 15px rgb(0 0 0 / .1);overflow:hidden;transition:transform 0.3s ease,box-shadow 0.3s ease}.card:hover{transform:translateY(-5px);box-shadow:0 8px 25px rgb(0 0 0 / .15)}.card-image{width:100%;height:200px;object-fit:cover}.card-content{padding:1.5rem}.card-title{font-size:1.2rem;font-weight:600;margin-bottom:.5rem;color:#333}.card-title a{text-decoration:none;color:inherit}.card-title a:hover{color:#007cba}.card-meta{color:#666;font-size:.9rem;margin-bottom:1rem}.card-description{color:#555;line-height:1.5}.rating{display:flex;align-items:center;gap:.5rem;margin:.5rem 0}.stars{color:#ffc107}.rating-text{font-size:.9rem;color:#666}.work-hours{background:#f8f9fa;border-radius:8px;padding:1rem;margin:1rem 0}.work-hours h4{margin-bottom:.5rem;color:#333}.hours-list{list-style:none}.hours-list li{display:flex;justify-content:space-between;padding:.25rem 0;border-bottom:1px solid #e9ecef}.hours-list li:last-child{border-bottom:none}.contact-info{background:#e3f2fd;border-radius:8px;padding:1rem;margin:1rem 0}.contact-item{display:flex;align-items:center;gap:.5rem;margin:.5rem 0}.contact-icon{width:20px;height:20px;color:#007cba}.attributes{margin:1.5rem 0}.attributes h4{margin-bottom:1rem;color:#333}.attribute-group{margin-bottom:1rem}.attribute-group h5{color:#007cba;margin-bottom:.5rem;text-transform:capitalize}.attribute-list{list-style:none;display:flex;flex-wrap:wrap;gap:.5rem}.attribute-item{background:#e8f5e8;color:#2e7d32;padding:.25rem .75rem;border-radius:20px;font-size:.85rem}.attribute-item.unavailable{background:#ffebee;color:#c62828}.dropdown-section{background:#fff;padding:3rem 0;margin:2rem 0}.dropdown-container{display:flex;gap:1rem;max-width:600px;margin:0 auto}.dropdown-group{flex:1}.dropdown-group label{display:block;margin-bottom:.5rem;font-weight:600;color:#333}.dropdown-group select{width:100%;padding:.75rem;border:2px solid #ddd;border-radius:8px;font-size:1rem;background:#fff;transition:border-color 0.3s ease}.dropdown-group select:focus{outline:none;border-color:#007cba}.breadcrumbs{background:#e9ecef;padding:1rem 0;margin-bottom:2rem}.breadcrumbs ul{list-style:none;display:flex;align-items:center;gap:.5rem}.breadcrumbs a{text-decoration:none;color:#007cba}.breadcrumbs a:hover{text-decoration:underline}.breadcrumb-separator{color:#666}.nav-links{margin:2rem 0}.nav-link{display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 1.5rem;background:#007cba;color:#fff;text-decoration:none;border-radius:8px;transition:background-color 0.3s ease}.nav-link:hover{background:#005a8b}.section{margin:3rem 0}.section h2,.section h3{margin-bottom:2rem;color:#333;text-align:center}.section h2{font-size:2.5rem}.section h3{font-size:2rem}.site-footer{background:#333;color:#fff;padding:3rem 0 1rem;margin-top:4rem}.footer-content{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:2rem;margin-bottom:2rem}.footer-section h4{margin-bottom:1rem;color:#fff}.footer-menu ul{list-style:none}.footer-menu a{color:#ccc;text-decoration:none;line-height:2;transition:color 0.3s ease}.footer-menu a:hover{color:#fff}.footer-bottom{border-top:1px solid #555;padding-top:1rem;text-align:center;color:#ccc}.footer-logo img{max-height:40px;margin-bottom:1rem}@media (max-width:768px){.header-content{flex-direction:column;gap:1rem}.main-navigation ul{flex-direction:column;text-align:center;gap:1rem}.hero-content h1{font-size:2rem}.dropdown-container{flex-direction:column}.cards-grid.cols-4{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.cards-grid.cols-3{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}}@media (max-width:480px){.container{padding:0 15px}.hero-section{padding:60px 0}.hero-content h1{font-size:1.8rem}.cards-grid{grid-template-columns:1fr}}.text-center{text-align:center}.mb-2{margin-bottom:2rem}.mt-2{margin-top:2rem}.hidden{display:none}.icon{width:1.2em;height:1.2em;display:inline-block;vertical-align:middle}.featured-agencies{background:linear-gradient(135deg,#f8f9fa 0%,#e9ecef 100%);border-radius:12px;padding:2rem;margin:3rem 0}.featured-card{position:relative;border:2px solid #007cba}.featured-badge{position:absolute;top:10px;right:10px;background:#007cba;color:#fff;padding:.25rem .75rem;border-radius:20px;font-size:.8rem;font-weight:600;z-index:10}.featured-card:hover{transform:translateY(-8px);box-shadow:0 12px 30px rgb(0 124 186 / .2)}.learn-more-banner{background:linear-gradient(135deg,#28a745 0%,#20c997 100%);color:#fff;padding:3rem 0;text-align:center;margin:2rem 0}.banner-content h3{font-size:2rem;margin-bottom:1rem;font-weight:600}.banner-content p{font-size:1.1rem;margin-bottom:2rem;max-width:600px;margin-left:auto;margin-right:auto}.banner-btn{display:inline-block;background:#fff;color:#28a745;padding:1rem 2rem;text-decoration:none;border-radius:50px;font-weight:600;font-size:1.1rem;transition:all 0.3s ease;box-shadow:0 4px 15px rgb(0 0 0 / .1)}.banner-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgb(0 0 0 / .15);color:#20c997}.ad-zone{background:#f8f9fa;border:2px dashed #dee2e6;padding:2rem;text-align:center;margin:2rem 0;border-radius:8px}.ad-zone.header-ad{margin:1rem 0}.ad-zone.sidebar-ad{margin:1rem 0;padding:1rem}.ad-zone.footer-ad{margin:2rem 0 1rem}.ad-zone p{color:#6c757d;font-style:italic;margin:0}.ad-zone.has-content{background:#fff0;border:none;padding:0}.lead{font-size:1.2rem;color:#666;margin-bottom:2rem}.resources-hero{background:linear-gradient(135deg,#f8f9fa 0%,#e9ecef 100%);border-radius:12px;padding:3rem;margin:2rem 0}.hero-grid{display:grid;grid-template-columns:2fr 1fr;gap:3rem;align-items:center}.hero-text h2{font-size:2.2rem;margin-bottom:1rem;color:#333}.hero-text p{font-size:1.1rem;line-height:1.6;color:#555;margin-bottom:2rem}.hero-stats{display:flex;gap:2rem}.stat-item{text-align:center}.stat-item strong{display:block;font-size:1.8rem;color:#007cba;font-weight:700}.stat-item span{font-size:.9rem;color:#666}.resources-image{width:100%;border-radius:8px;box-shadow:0 4px 15px rgb(0 0 0 / .1)}.quick-links-section{margin:3rem 0}.quick-links-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1.5rem;margin-top:2rem}.quick-link-card{background:#fff;border-radius:12px;padding:2rem;text-align:center;text-decoration:none;color:inherit;box-shadow:0 4px 15px rgb(0 0 0 / .1);transition:transform 0.3s ease,box-shadow 0.3s ease}.quick-link-card:hover{transform:translateY(-5px);box-shadow:0 8px 25px rgb(0 0 0 / .15);text-decoration:none;color:inherit}.quick-link-icon{font-size:3rem;margin-bottom:1rem}.quick-link-card h4{margin-bottom:.5rem;color:#333}.quick-link-card p{color:#666;font-size:.9rem}.resources-grid-section{margin:4rem 0}.resources-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:2rem;margin-top:2rem}.resource-category{background:#fff;border-radius:12px;padding:2rem;box-shadow:0 4px 15px rgb(0 0 0 / .1)}.resource-category h4{margin-bottom:1.5rem;color:#333;font-size:1.3rem;border-bottom:2px solid #007cba;padding-bottom:.5rem}.resource-list{list-style:none}.resource-list li{margin-bottom:.75rem}.resource-list a{color:#007cba;text-decoration:none;display:flex;align-items:center;padding:.5rem;border-radius:6px;transition:background-color 0.3s ease}.resource-list a:before{content:"→";margin-right:.5rem;font-weight:700}.resource-list a:hover{background:#f8f9fa;text-decoration:none}.cta-section{background:linear-gradient(135deg,#007cba 0%,#005a8b 100%);color:#fff;border-radius:12px;padding:3rem;text-align:center;margin:3rem 0}.cta-content h3{font-size:2rem;margin-bottom:1rem}.cta-content p{font-size:1.1rem;margin-bottom:2rem;opacity:.9}.btn{display:inline-block;padding:12px 24px;border-radius:8px;text-decoration:none;font-weight:600;transition:all 0.3s ease;border:none;cursor:pointer;font-size:16px;text-align:center}.btn-primary{background-color:#007cba;color:#fff;border:2px solid #007cba}.btn-primary:hover{background-color:#005a8b;border-color:#005a8b;transform:translateY(-2px);box-shadow:0 4px 12px rgb(0 124 186 / .3)}.btn-secondary{background-color:#6c757d;color:#fff;border:2px solid #6c757d}.btn-secondary:hover{background-color:#5a6268;border-color:#5a6268;transform:translateY(-2px);box-shadow:0 4px 12px rgb(0 0 0 / .15)}.page-header{text-align:center;margin-bottom:3rem;padding:2rem 0}.page-title{font-size:2.5rem;color:#2c3e50;margin-bottom:1rem;font-weight:700}.page-description{font-size:1.2rem;color:#6c757d;max-width:600px;margin:0 auto;line-height:1.6}.pagination{display:flex;justify-content:center;align-items:center;margin:3rem 0;gap:.5rem}.page-numbers{display:inline-block;padding:.75rem 1rem;margin:0 .25rem;border:2px solid #e9ecef;border-radius:8px;text-decoration:none;color:#333;transition:all 0.3s ease}.page-numbers:hover,.page-numbers.current{background:#007cba;color:#fff;border-color:#007cba;text-decoration:none}.page-numbers.prev,.page-numbers.next{font-weight:600}.widget{background:#fff;border-radius:8px;padding:1.5rem;margin-bottom:2rem;box-shadow:0 2px 10px rgb(0 0 0 / .1)}.widget-title{color:#333;margin-bottom:1rem;font-size:1.2rem;font-weight:600;border-bottom:2px solid #007cba;padding-bottom:.5rem}.widget ul{list-style:none;padding:0}.widget ul li{padding:.5rem 0;border-bottom:1px solid #f0f0f0}.widget ul li:last-child{border-bottom:none}.widget ul li a{color:#333;text-decoration:none;transition:color 0.3s ease}.widget ul li a:hover{color:#007cba}.widget p{margin-bottom:1rem;line-height:1.6}.page-sidebar{background:#f8f9fa;padding:1rem;border-radius:8px}.row{display:flex;flex-wrap:wrap;margin:0 -15px}.col{padding:0 15px;margin-bottom:30px}.col-4{flex:0 0 33.333333%;max-width:33.333333%}.archive-description{color:#666;font-size:1.1rem;margin-bottom:2rem;text-align:center}.card-text{color:#555;line-height:1.6;margin-bottom:1rem}.posted-on{color:#999;font-size:.9rem}.posted-on span{margin-right:1rem}.posted-on a{color:#007cba;text-decoration:none}.post-image{margin:2rem 0}.post-image img{width:100%;height:auto;border-radius:8px}.post-content{font-size:1.1rem;line-height:1.7;color:#444}.post-content h2,.post-content h3,.post-content h4{margin:2rem 0 1rem 0;color:#333}.post-content h2{font-size:1.8rem}.post-content h3{font-size:1.5rem}.post-content p{margin-bottom:1.5rem}.post-content ul,.post-content ol{margin:1.5rem 0;padding-left:2rem}.post-content img{max-width:100%;width:100%;height:auto;border-radius:8px;margin:1rem 0;object-fit:cover}.back-link{margin-top:3rem;padding-top:2rem;border-top:1px solid #eee}.blog-sidebar{background:#f8f9fa;padding:2rem;border-radius:8px;height:fit-content}.sidebar-widget{background:#fff;padding:1.5rem;border-radius:8px;margin-bottom:2rem;box-shadow:0 2px 5px rgb(0 0 0 / .05)}.sidebar-widget:last-child{margin-bottom:0}.sidebar-widget h3{color:#333;margin-bottom:1rem;font-size:1.2rem;font-weight:600;border-bottom:2px solid #007cba;padding-bottom:.5rem}.sidebar-widget ul{list-style:none;padding:0}.sidebar-widget ul li{padding:.5rem 0;border-bottom:1px solid #f0f0f0}.sidebar-widget ul li:last-child{border-bottom:none}.sidebar-widget ul li a{color:#333;text-decoration:none;transition:color 0.3s ease}.sidebar-widget ul li a:hover{color:#007cba}@media (max-width:480px){.col-4{flex:0 0 100%;max-width:100%}.posts-navigation .nav-links{flex-direction:column;gap:1rem}}.single-agency{max-width:1400px;margin:0 auto;padding:2rem 0}.agency-header{margin-bottom:4rem;text-align:center}.agency-title{font-size:3rem;font-weight:700;color:#2c3e50;margin-bottom:.5rem;line-height:1.2}.location-subtitle{display:block;font-size:1.4rem;color:#6c757d;font-weight:400;margin-top:.5rem}.nav-links{margin-top:2rem}.agency-header .nav-link{color:#007cba;text-decoration:none;font-weight:500;transition:all 0.3s ease;display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 1.5rem;background:#f8f9fa;border-radius:8px;border:2px solid #e9ecef}.agency-header .nav-link:hover{color:#005a8b;background:#e3f2fd;border-color:#007cba}.agency-image-container{text-align:center;margin-bottom:4rem;padding:0 2rem}.agency-featured-image{max-width:85%;height:auto;max-height:500px;border-radius:16px;box-shadow:0 12px 48px rgb(0 0 0 / .15);object-fit:cover;transition:transform 0.3s ease}.agency-featured-image:hover{transform:scale(1.02)}.agency-content-wrapper{margin-top:4rem;max-width:1200px;margin-left:auto;margin-right:auto}.agency-content-grid{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:start}.agency-main-content{background:#fff;border-radius:16px;padding:3rem;box-shadow:0 8px 32px rgb(0 0 0 / .1)}.agency-sidebar{display:flex;flex-direction:column;gap:2rem}.agency-section{margin-bottom:3rem}.agency-section:last-child{margin-bottom:0}.agency-section h2{font-size:2rem;font-weight:600;color:#2c3e50;margin-bottom:1.5rem;padding-bottom:.75rem;border-bottom:3px solid #007cba;position:relative}.agency-section h2:after{content:'';position:absolute;bottom:-3px;left:0;width:60px;height:3px;background:#28a745}.agency-description{font-size:1.1rem;line-height:1.8;color:#444}.agency-contact-card,.agency-map-section,.agency-actions{background:#fff;border-radius:16px;padding:2.5rem;box-shadow:0 8px 32px rgb(0 0 0 / .1);border:1px solid #f0f0f0}.agency-contact-card h3,.agency-map-section h3,.agency-actions h3{font-size:1.5rem;font-weight:600;color:#2c3e50;margin-bottom:2rem;text-align:center;position:relative;padding-bottom:1rem}.agency-contact-card h3:after,.agency-map-section h3:after,.agency-actions h3:after{content:'';position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:40px;height:2px;background:#007cba}.contact-item{display:flex;align-items:flex-start;gap:1rem;margin-bottom:2rem;padding:1.5rem;background:#f8f9fa;border-radius:12px;transition:all 0.3s ease}.contact-item:hover{background:#e3f2fd;transform:translateY(-2px)}.contact-item:last-child{margin-bottom:0}.contact-item i{color:#007cba;font-size:1.4rem;margin-top:.2rem;width:24px}.contact-item strong{display:block;color:#2c3e50;font-weight:600;margin-bottom:.5rem;font-size:1.1rem}.contact-item p{margin:0;color:#555;line-height:1.6}.contact-item a{color:#007cba;text-decoration:none;font-weight:500}.contact-item a:hover{text-decoration:underline;color:#005a8b}.agency-map{height:400px;border-radius:12px;overflow:hidden;border:2px solid #e9ecef;box-shadow:0 4px 15px rgb(0 0 0 / .1)}.map-placeholder{height:400px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#f8f9fa 0%,#e9ecef 100%);border-radius:12px;color:#6c757d;font-size:1.1rem}.action-buttons{display:flex;flex-direction:column;gap:1rem}.action-buttons .btn{display:flex;align-items:center;justify-content:center;gap:.75rem;padding:1.25rem;border-radius:12px;text-decoration:none;font-weight:600;font-size:1.1rem;transition:all 0.3s ease;border:2px solid #fff0}.action-buttons .btn-primary{background:linear-gradient(135deg,#007cba 0%,#005a8b 100%);color:#fff;box-shadow:0 4px 15px rgb(0 124 186 / .3)}.action-buttons .btn-primary:hover{transform:translateY(-3px);box-shadow:0 8px 25px rgb(0 124 186 / .4)}.action-buttons .btn-secondary{background:linear-gradient(135deg,#28a745 0%,#20c997 100%);color:#fff;box-shadow:0 4px 15px rgb(40 167 69 / .3)}.action-buttons .btn-secondary:hover{transform:translateY(-3px);box-shadow:0 8px 25px rgb(40 167 69 / .4)}.nearby-agencies{margin-top:5rem;padding-top:4rem;border-top:2px solid #e9ecef}.nearby-agencies h2{text-align:center;margin-bottom:3rem;color:#2c3e50;font-size:2.2rem}@media (max-width:992px){.agency-content-grid{grid-template-columns:1fr;gap:3rem}.agency-main-content,.agency-sidebar{order:0}}@media (max-width:768px){.agency-title{font-size:2.2rem}.location-subtitle{font-size:1.2rem}.agency-featured-image{width:100%;max-height:500px;min-height:300px}.agency-main-content,.agency-contact-card,.agency-map-section,.agency-actions{padding:2rem;margin-bottom:1.5rem}.agency-content-wrapper{padding:0 1rem;margin-top:2rem}.agency-content-grid{gap:2rem}.action-buttons{flex-direction:column;gap:1rem}.action-buttons .btn{width:100%;padding:1rem;font-size:1rem}.agency-header{margin-bottom:2rem;padding:0 1rem}.agency-image-container{margin-bottom:2rem;padding:0 1rem}}@media (max-width:480px){.single-agency{padding:1rem 0}.agency-title{font-size:1.8rem;line-height:1.3}.location-subtitle{font-size:1rem}.agency-featured-image{width:100%;max-height:400px;min-height:250px}.agency-main-content,.agency-contact-card,.agency-map-section,.agency-actions{padding:1.5rem;margin-bottom:1rem;border-radius:12px}.agency-content-wrapper{padding:0 .5rem;margin-top:1rem}.agency-content-grid{gap:1rem}.action-buttons .btn{width:100%;padding:.875rem;font-size:.95rem}.agency-map{height:250px}.map-placeholder{height:250px;font-size:1rem}.agency-header{margin-bottom:1.5rem;padding:0 .5rem}.agency-image-container{margin-bottom:1.5rem;padding:0 .5rem}.contact-item{padding:1rem;margin-bottom:1rem}.agency-section h2{font-size:1.5rem}.nearby-agencies{margin-top:3rem;padding-top:2rem}.nearby-agencies h2{font-size:1.8rem}}.foster-slim-banner{position:relative;display:block;border-radius:14px;overflow:hidden;color:#fff;text-align:center;min-height:100px;transition:transform .25s ease,box-shadow .25s ease;text-decoration:none;margin:30px auto;max-width:1200px}.foster-slim-banner.blue{background:linear-gradient(135deg,#00a7c9 0%,#0084b4 100%);box-shadow:0 6px 18px rgb(0 100 160 / .25)}.foster-slim-banner.blue::before{content:"";position:absolute;inset:0;background:url(https://fostercareagencies.co.uk/wp-content/uploads/2025/10/hero-section-capstone.png) center/cover no-repeat;filter:blur(2px) brightness(.9);opacity:.55;transform:scale(1.04);z-index:0}.foster-slim-banner.blue::after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgb(0 167 201 / .65) 0%,rgb(0 132 180 / .65) 100%);z-index:1}.foster-slim-banner.blue:hover{transform:translateY(-2px);box-shadow:0 8px 22px rgb(0 132 180 / .35)}.foster-slim-inner{position:relative;z-index:2;padding:20px 20px;max-width:920px;margin:0 auto;text-align:center}.foster-slim-inner h2{margin:0 0 8px;font-size:clamp(26px,4vw,36px);font-weight:900;line-height:1.2;color:#fff;letter-spacing:.5px;text-shadow:0 3px 12px rgb(0 0 0 / .45)}.foster-slim-list{list-style:none;margin:0 auto 8px;padding:0;display:inline-block;text-align:center}.foster-slim-list li{display:inline-block;margin:0 14px;font-size:clamp(16px,2.4vw,20px);font-weight:600;line-height:1.4;position:relative;padding-left:18px}.foster-slim-list li::before{content:"•";position:absolute;left:0;top:0;color:#fff;font-size:22px;line-height:1;opacity:.9}.foster-slim-btn{display:inline-block;margin-top:4px;background:#fff;color:#0084b4;font-weight:800;padding:6px 20px;border-radius:10px;text-decoration:none;font-size:17px;letter-spacing:.3px;transition:background .25s ease,color .25s ease,transform .25s ease;box-shadow:0 3px 10px rgb(0 0 0 / .25)}.foster-slim-btn:hover{background:#e0f7ff;color:#005e8c;transform:translateY(-1px)}.reveal-on-scroll{opacity:0;transform:translateY(16px)}.reveal-on-scroll.is-visible{opacity:1;transform:translateY(0);transition:opacity .6s ease,transform .6s ease}.page-two-col{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:2rem;align-items:start}@media (max-width:1200px){.page-two-col{grid-template-columns:minmax(0,1fr) 280px}}@media (max-width:992px){.page-two-col{grid-template-columns:minmax(0,1fr) 260px;gap:1.5rem}}@media (max-width:768px){.page-two-col{grid-template-columns:1fr}.page-two-col main{order:1}.page-two-col .page-sidebar{order:2}}.entry-thumbnail img{width:100%;height:auto;display:block}@media (max-width:768px){.page-sidebar .widget{width:100%}}.container .page-two-col{display:grid;gap:2rem;align-items:start}@media (min-width:992px){.container .page-two-col{grid-template-columns:minmax(0,1fr) 300px}.container .page-two-col .page-sidebar{align-self:start}}@media (min-width:768px) and (max-width:991.98px){.container .page-two-col{grid-template-columns:minmax(0,1fr) 260px;gap:1.5rem}}@media (max-width:767.98px){.container .page-two-col{grid-template-columns:1fr}.container .page-two-col .page-main{order:1}.container .page-two-col .page-sidebar{order:2}}.entry-thumbnail img{width:100%;height:auto;display:block}@media (max-width:767.98px){.page-sidebar .widget{width:100%}}.container .page-two-col{display:grid;gap:2rem;align-items:start}@media (min-width:992px){.container .page-two-col{grid-template-columns:minmax(0,1fr) 300px}.container .page-two-col .page-sidebar{align-self:start}}@media (min-width:768px) and (max-width:991.98px){.container .page-two-col{grid-template-columns:minmax(0,1fr) 260px;gap:1.5rem}}@media (max-width:767.98px){.container .page-two-col{grid-template-columns:1fr}.container .page-two-col .page-main{order:1}.container .page-two-col .page-sidebar{order:2}}.entry-thumbnail img{width:100%;height:auto;display:block}@media (max-width:767.98px){.page-sidebar .widget{width:100%}}.single-blog-layout{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:3rem;margin:2rem auto;max-width:1200px}.blog-content{background:#fff;padding:3rem;border-radius:12px;box-shadow:0 6px 24px rgb(0 0 0 / .06)}.blog-sidebar{background:#f8f9fa;padding:2rem;border-radius:12px;height:fit-content;box-shadow:0 4px 18px rgb(0 0 0 / .05);border:1px solid #e9ecef}.sidebar-widget+.sidebar-widget{margin-top:1.25rem}.post-featured-image{margin:2rem 0}.share-buttons{display:flex;gap:.6rem;flex-wrap:wrap}.share-btn{display:inline-flex;align-items:center;gap:.4rem;padding:.55rem .95rem;background:#f1f5f9;color:#333;text-decoration:none;border-radius:8px;font-weight:600;transition:all .2s ease;border:1px solid #e2e8f0}.share-btn:hover{background:#e9f2ff;border-color:#cfe4ff}.post-meta{display:none!important}@media (max-width:1024px){.single-blog-layout{grid-template-columns:minmax(0,1fr) 300px;gap:2rem}.blog-content{padding:2rem}}@media (max-width:768px){.single-blog-layout{grid-template-columns:1fr;gap:1.25rem}.blog-sidebar{order:2}.blog-content{order:1;padding:1.5rem}.share-btn{width:100%;justify-content:center}}@media (max-width:480px){.post-title{font-size:1.8rem}}@media (max-width:768px){.container{padding-left:14px!important;padding-right:14px!important}}.single-blog-layout{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:3rem;margin:2rem auto;max-width:1200px}@media (max-width:1024px){.single-blog-layout{grid-template-columns:1fr;gap:1.25rem}.blog-content{padding:1.5rem}.blog-sidebar{order:2;margin-top:.5rem}}.post-title{font-size:clamp(1.6rem, 4.8vw, 2.2rem);line-height:1.25;word-break:break-word}.post-content{font-size:clamp(16px, 1.9vw, 18px);line-height:1.75}@media (max-width:768px){.post-content h2{font-size:1.35rem;margin:1.25rem 0 .75rem}.post-content h3{font-size:1.15rem;margin:1rem 0 .5rem}}.post-content img,.featured-image,.post-featured-image img{max-width:100%!important;height:auto!important;display:block}.post-content iframe{max-width:100%!important;width:100%!important;height:auto;aspect-ratio:16/9}.post-content table{width:100%;border-collapse:collapse;display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}.post-content table td,.post-content table th{padding:.6rem;border:1px solid #e9ecef;word-break:break-word}.post-content pre,.post-content code{white-space:pre-wrap;word-break:break-word}.post-content pre{background:#0f172a0d;padding:.85rem;border-radius:8px;overflow:auto}.blog-sidebar{background:#f8f9fa;padding:2rem;border-radius:12px;height:fit-content;box-shadow:0 4px 18px rgb(0 0 0 / .05);border:1px solid #e9ecef}@media (max-width:768px){.blog-sidebar{padding:1rem;border-radius:10px}.blog-sidebar .sidebar-widget+.sidebar-widget{margin-top:.9rem}}.share-buttons{display:flex;gap:.6rem;flex-wrap:wrap}.share-btn{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;padding:.65rem 1rem;border-radius:10px;background:#eef2f7;border:1px solid #dfe6ee;text-decoration:none;font-weight:700;letter-spacing:.1px}@media (max-width:768px){.share-btn{width:100%}}.post-meta,.comments-area,.posted-on,.byline{display:none!important}@media (max-width:768px){.post-featured-image{margin:1rem 0}}@media (max-width:1024px){.cards-grid.cols-3,.cards-grid.cols-4{grid-template-columns:1fr 1fr}}@media (max-width:640px){.cards-grid.cols-3,.cards-grid.cols-4{grid-template-columns:1fr}}@media (max-width:1024px){.blog-content,.blog-sidebar,.single-blog-layout,.container{max-width:100%}}Yes,you are absolutely right. Looking at your CSS file,there are three different sections trying to control .page-two-col and .container. They are conflicting with each other,which is why your changes aren't showing up correctly (or look messy).

Specifically, your CSS has display: grid defined for .page-two-col in multiple places, which fights against the display: flex I gave you in the previous PHP code.

Here is the solution to fix the "untidy" look and make it mobile-friendly.

Step 1: Clean your CSS (The Conflict)
In your style.css file, you have duplicate code blocks. Delete the conflicting sections found around lines 680–760 and replace them with this single, clean version.

Add this to the very bottom of your style.css:

CSS
/* =========================================
   CLEAN PAGE LAYOUT (Add to bottom of CSS)
   ========================================= */

/* 1. Wrapper to fix Top/Bottom Spacing Issues */
.custom-page-wrapper {
    padding: 3rem 0;
    background-color: #f9f9f9;
    min-height: 80vh; /* Ensures footer doesn't float up on empty pages */}.page-two-col{display:grid;grid-template-columns:1fr 320px;gap:3rem;align-items:start}.page-main article{background:#fff;padding:3rem;border-radius:12px;box-shadow:0 4px 20px rgb(0 0 0 / .05)}.page-sidebar{background:#fff;padding:2rem;border-radius:12px;box-shadow:0 4px 20px rgb(0 0 0 / .05)}@media (max-width:1024px){.page-two-col{grid-template-columns:1fr 280px;gap:2rem}.page-main article{padding:2rem}}@media (max-width:768px){.custom-page-wrapper{padding:1.5rem 0}.page-two-col{grid-template-columns:1fr;display:flex;flex-direction:column}.page-main{order:1;width:100%}.page-sidebar{order:2;width:100%;margin-top:2rem}}Step 2:The Final PHP Template Now that the CSS handles the heavy lifting (grids and spacing),we can simplify the PHP. This version uses the custom-page-wrapper class defined above to fix the "untidy" top/bottom gaps. Update your PHP file with this:PHP <?php get_header();?><div class="custom-page-wrapper"><div class="container" style="margin-bottom: 20px;"><?php if (function_exists('foster_care_breadcrumbs')) foster_care_breadcrumbs();?></div><div class="container"><div class="page-two-col"><main class="page-main"><?php while (have_posts()) :the_post();?><article id="post-<?php the_ID(); ?>" <?php post_class();?>><header class="entry-header text-center" style="margin-bottom: 2rem;"><h1 class="entry-title" style="color: #2c3e50; font-size: 2.2rem; margin-bottom: 0.5rem;"><?php the_title();?></h1><div style="width: 50px; height: 3px; background: #e67e22; margin: 10px auto;"></div></header><?php if (has_post_thumbnail()) :?><div class="entry-thumbnail mb-2"><?php the_post_thumbnail('large',['style'=>'width:100%; height:auto; border-radius:8px;']);?></div><?php endif;?><div class="entry-content"><?php the_content();?></div></article><?php endwhile;?></main><aside class="page-sidebar" role="complementary"><?php if (is_active_sidebar('page-sidebar')) :?><?php dynamic_sidebar('page-sidebar');?><?php else :?><div class="widget"><h3>Sidebar</h3><p>Go to Appearance>Widgets to add items here.</p></div><?php endif;?></aside></div></div></div><?php get_footer();?>Why this works:custom-page-wrapper:I added this wrapping div with padding:3rem 0. This physically pushes the content away from the header and footer,fixing the "untidy" squashed look. CSS Grid vs Flex:I switched the CSS to display:grid. This is much more stable than Flexbox for a sidebar layout. It ensures the sidebar stays exactly 320px wide on desktop. Mobile Order:The media query @media (max-width:768px) forces the content to stack,ensuring the Main Content appears before the Sidebar on phones. Important:After saving both files,remember to Clear your Cache (Ctrl+F5) to see the changes. wait,give me the complete style css so i can delete the whole lot and add what you give me Here is the complete,cleaned-up style.css. I have taken your original code,removed the conflicting duplicates that were breaking your layout,and integrated the new "Page Wrapper" and "Grid System" to fix the spacing and mobile issues. You can delete everything currently in your style.css file and paste this entire block in. CSS *{margin:0;padding:0;box-sizing:border-box}body{font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;line-height:1.6;color:#333;background-color:#f8f9fa}img{max-width:100%;height:auto;display:block}.container{max-width:1200px;margin:0 auto;padding:0 20px}.site-main .container{max-width:none;width:100%}.custom-page-wrapper{padding:3rem 0;background-color:#f9f9f9;min-height:80vh}.page-two-col{display:grid;grid-template-columns:1fr 320px;gap:3rem;align-items:start}.page-main article{background:#fff;padding:3rem;border-radius:12px;box-shadow:0 4px 20px rgb(0 0 0 / .05)}.page-sidebar{background:#fff;padding:2rem;border-radius:12px;box-shadow:0 4px 20px rgb(0 0 0 / .05)}.site-header{background:#fff;box-shadow:0 2px 10px rgb(0 0 0 / .1)}.header-content{display:flex;justify-content:space-between;align-items:center;padding:1rem 0}.site-logo img{max-height:140px;width:auto}.main-navigation ul{display:flex;list-style:none;gap:2rem}.main-navigation a{text-decoration:none;color:#333;font-weight:500;transition:color 0.3s ease}.main-navigation a:hover{color:#007cba}.hero-section{background:linear-gradient(rgb(0 124 186 / .6),rgb(0 124 186 / .6)),url(/wp-content/themes/Foster_care_uk_sonnet4/assets/hero-section.png);background-size:cover;background-position:center;color:#fff;text-align:center;padding:100px 0}.hero-content h1{font-size:3rem;margin-bottom:1rem;font-weight:700}.hero-content p{font-size:1.2rem;max-width:600px;margin:0 auto}.cards-grid{display:grid;gap:2rem;margin:2rem 0}.cards-grid.cols-2{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}.cards-grid.cols-3{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}.cards-grid.cols-4{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}.card{background:#fff;border-radius:12px;box-shadow:0 4px 15px rgb(0 0 0 / .1);overflow:hidden;transition:transform 0.3s ease,box-shadow 0.3s ease}.card:hover{transform:translateY(-5px);box-shadow:0 8px 25px rgb(0 0 0 / .15)}.card-image{width:100%;height:200px;object-fit:cover}.card-content{padding:1.5rem}.card-title{font-size:1.2rem;font-weight:600;margin-bottom:.5rem;color:#333}.card-title a{text-decoration:none;color:inherit}.card-title a:hover{color:#007cba}.card-meta{color:#666;font-size:.9rem;margin-bottom:1rem}.card-description{color:#555;line-height:1.5}.rating{display:flex;align-items:center;gap:.5rem;margin:.5rem 0}.stars{color:#ffc107}.rating-text{font-size:.9rem;color:#666}.foster-slim-banner{position:relative;display:block;border-radius:14px;overflow:hidden;color:#fff;text-align:center;min-height:100px;transition:transform .25s ease,box-shadow .25s ease;text-decoration:none;margin:30px auto;max-width:1200px}.foster-slim-banner.blue{background:linear-gradient(135deg,#00a7c9 0%,#0084b4 100%);box-shadow:0 6px 18px rgb(0 100 160 / .25)}.foster-slim-banner.blue:hover{transform:translateY(-2px);box-shadow:0 8px 22px rgb(0 132 180 / .35)}.foster-slim-inner{position:relative;z-index:2;padding:20px;max-width:920px;margin:0 auto}.foster-slim-inner h2{font-size:clamp(26px,4vw,36px);font-weight:900;color:#fff;margin-bottom:8px}.foster-slim-btn{display:inline-block;background:#fff;color:#0084b4;font-weight:800;padding:6px 20px;border-radius:10px;text-decoration:none}.ad-zone{background:#f8f9fa;border:2px dashed #dee2e6;padding:2rem;text-align:center;margin:2rem 0;border-radius:8px}.ad-zone p{color:#6c757d;font-style:italic;margin:0}.btn{display:inline-block;padding:12px 24px;border-radius:8px;text-decoration:none;font-weight:600;transition:all 0.3s ease;border:none;cursor:pointer;font-size:16px;text-align:center}.btn-primary{background-color:#007cba;color:#fff;border:2px solid #007cba}.btn-primary:hover{background-color:#005a8b;transform:translateY(-2px)}.breadcrumbs{background:#e9ecef;padding:1rem 0;margin-bottom:2rem}.breadcrumbs ul{list-style:none;display:flex;align-items:center;gap:.5rem}.breadcrumbs a{text-decoration:none;color:#007cba}.widget{background:#fff;border-radius:8px;padding:1.5rem;margin-bottom:2rem}.widget-title{color:#333;margin-bottom:1rem;font-size:1.2rem;font-weight:600;border-bottom:2px solid #007cba;padding-bottom:.5rem}.widget ul{list-style:none;padding:0}.widget ul li{padding:.5rem 0;border-bottom:1px solid #f0f0f0}.single-agency{max-width:1400px;margin:0 auto;padding:2rem 0}.agency-title{font-size:3rem;font-weight:700;color:#2c3e50}.agency-content-grid{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:start}.agency-main-content{background:#fff;border-radius:16px;padding:3rem;box-shadow:0 8px 32px rgb(0 0 0 / .1)}.agency-contact-card{background:#fff;border-radius:16px;padding:2.5rem;box-shadow:0 8px 32px rgb(0 0 0 / .1)}.site-footer{background:#333;color:#fff;padding:3rem 0 1rem;margin-top:4rem}.footer-content{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:2rem;margin-bottom:2rem}.footer-bottom{border-top:1px solid #555;padding-top:1rem;text-align:center;color:#ccc}@media (max-width:1024px){.page-two-col{grid-template-columns:1fr 280px;gap:2rem}.single-agency .agency-content-grid{grid-template-columns:1fr}}@media (max-width:768px){.container{padding-left:15px;padding-right:15px}.page-two-col{display:flex;flex-direction:column;grid-template-columns:1fr}.page-main{order:1;width:100%}.page-sidebar{order:2;width:100%;margin-top:2rem}.page-main article{padding:1.5rem}.header-content{flex-direction:column;gap:1rem}.main-navigation ul{flex-direction:column;text-align:center;gap:1rem}.hero-content h1{font-size:2rem}.page-title{font-size:1.8rem}}.text-center{text-align:center}.mb-2{margin-bottom:2rem}.hidden{display:none}iframe,video{max-width:100%}table{display:block;overflow-x:auto}