/*
Theme Name: Northside Approved
Theme URI: https://northsidecomputers.net/
Author: Northside Computers & Cellular
Description: Custom editable WordPress block theme for Northside Computers & Cellular.
Version: 1.4.1
Requires at least: 6.4
Tested up to: 6.8
Requires PHP: 7.4
Text Domain: northside-approved
*/
:root{--ns-blue:#344B91;--ns-pink:#AE3C82}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0} .ns-topbar{background:#edf0f6;padding:8px 24px;text-align:center;font-size:.82rem}.ns-topbar p{margin:0}.ns-header{position:sticky;top:0;z-index:100;background:#fff;box-shadow:0 2px 12px #0002;padding:12px 24px}.admin-bar .ns-header{top:32px}.ns-header>.wp-block-group{max-width:1160px}.ns-logo{max-width:290px;margin:0 auto 12px}.ns-logo img{display:block;max-width:100%;height:auto}.ns-header .wp-block-navigation{margin:0 auto 12px}.ns-header .wp-block-buttons{justify-content:center}.ns-hero{background:#14264a;color:white;padding:80px 24px}.ns-hero h1{color:#fff;line-height:1.13;font-size:clamp(2.1rem,5vw,3.6rem)}.ns-hero p{color:#e2e8f5}.ns-section{padding:75px 24px}.ns-section h2{color:var(--ns-blue);font-size:clamp(1.7rem,3vw,2.5rem);line-height:1.25}.ns-section h3{color:var(--ns-blue)}.ns-alt{background:#f5f6fa}.ns-card{padding:22px;border:1px solid #dce2ec;border-radius:12px;background:white;margin-bottom:16px;height:100%}.ns-card h3{margin-top:0}.ns-footer{background:#172747;color:#f2f5fa;padding:45px 24px}.ns-footer p{color:#e0e6f0}.ns-map iframe{width:100%;height:360px;border:0;border-radius:12px}.wp-block-button.is-style-outline .wp-block-button__link{background:transparent;border:1px solid var(--ns-blue);color:var(--ns-blue)}.ns-hero .wp-block-button.is-style-outline .wp-block-button__link{border-color:white;color:white}.wp-block-button__link:hover{filter:brightness(.9)}@media(max-width:780px){.ns-header{padding:10px 14px}.ns-logo{max-width:230px}.ns-section{padding:48px 18px}.ns-hero{padding:55px 18px}.wp-block-columns{gap:12px}.admin-bar .ns-header{top:46px}}

/* Header refinements for desktop and mobile */
.ns-header{display:grid;grid-template-columns:minmax(200px,1fr) auto;align-items:center;column-gap:20px;row-gap:12px;max-width:none!important;margin:0!important;padding:12px max(24px,calc((100vw - 1160px)/2))!important}
.ns-header > .ns-logo{grid-column:1;grid-row:1;justify-self:start;width:250px;max-width:100%;margin:0!important}
.ns-header > .wp-block-buttons{grid-column:2;grid-row:1;justify-self:end;display:flex;gap:12px;justify-content:flex-end;margin:0!important}
.ns-header > .wp-block-navigation{grid-column:1/-1;grid-row:2;justify-self:center;width:auto;max-width:100%;margin:0!important}
.ns-header .wp-block-navigation__container{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;column-gap:24px!important;row-gap:10px!important}
.ns-header .wp-block-navigation-item{margin:0!important}
.ns-header .wp-block-navigation-item__content{display:inline-block;padding:5px 0!important;white-space:nowrap;font-weight:600;text-decoration:none;color:#344B91}
.ns-header .wp-block-navigation-item__content:hover{color:#AE3C82}
.ns-header .wp-block-buttons .wp-block-button__link{white-space:nowrap;padding:10px 17px;font-size:0.92rem}
.ns-header .wp-block-image img{display:block;max-width:100%;height:auto}
@media(max-width:800px){.ns-header{grid-template-columns:minmax(0,1fr) auto;gap:12px;padding:12px 16px!important}.ns-header > .ns-logo{grid-row:1;grid-column:1;width:min(100%,210px)}.ns-header > .wp-block-navigation{grid-column:2;grid-row:1;justify-self:end}.ns-header > .wp-block-buttons{grid-column:1/-1;grid-row:2;justify-self:center;flex-wrap:wrap}.ns-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container{display:flex;flex-direction:column;align-items:stretch;gap:12px!important}.ns-header .wp-block-navigation__responsive-container-open{display:flex}}
@media(max-width:480px){.ns-topbar{font-size:.73rem}.ns-header > .ns-logo{width:180px}}


/* Northside brand balance: blue for structure, magenta for accents */
.ns-hero{position:relative;border-bottom:5px solid var(--ns-pink)}
.ns-hero > *:first-child{position:relative}
.ns-hero p:first-of-type{color:#f0b8d8;font-weight:700;letter-spacing:.035em}
.ns-section h2::before{content:"";display:block;width:50px;height:4px;background:var(--ns-pink);border-radius:8px;margin-bottom:18px}
.ns-card{border-top:3px solid var(--ns-pink)}
.ns-card a:not(.wp-block-button__link),.ns-section a:not(.wp-block-button__link):not(.wp-block-navigation-item__content){color:var(--ns-pink);text-underline-offset:3px}
.ns-card a:hover,.ns-section a:hover{color:var(--ns-blue)}
.ns-section .wp-block-button.is-style-outline .wp-block-button__link{border-color:var(--ns-pink);color:var(--ns-pink)}
.ns-section .wp-block-button.is-style-outline .wp-block-button__link:hover{background:var(--ns-pink);color:#fff}
.ns-header .wp-block-button.is-style-outline .wp-block-button__link{border-color:var(--ns-pink);color:var(--ns-pink)}
.ns-header .wp-block-button.is-style-outline .wp-block-button__link:hover{background:var(--ns-pink);color:white}
.ns-footer{border-top:4px solid var(--ns-pink)}
.ns-footer a:hover{color:#f2a3cc}
.ns-hero .wp-block-button.is-style-outline .wp-block-button__link{border-color:#fff;color:#fff}
.ns-hero .wp-block-button.is-style-outline .wp-block-button__link:hover{background:white;color:#14264a}

/* Anchored homepage sections and accessible inquiry form */
#ns-services,#ns-computer-sales,#ns-about,#ns-business-it,#ns-internet,#ns-boost,#ns-contact,#northside-contact-form{scroll-margin-top:190px}
.ns-card-link{margin-top:14px;font-weight:650}.ns-card-link a{color:var(--ns-pink);text-decoration:none}.ns-card-link a:hover{text-decoration:underline}
.ns-lead-section{background:#f5f6fa}.ns-lead-form{background:#fff;border:1px solid #dce2ec;border-top:4px solid var(--ns-pink);border-radius:12px;max-width:820px;padding:clamp(18px,3vw,36px);display:grid;gap:18px;box-shadow:0 3px 16px #14264a0d}
.ns-lead-form label{display:grid;gap:6px;font-weight:650;color:#344B91}.ns-lead-form input,.ns-lead-form select,.ns-lead-form textarea{display:block;width:100%;border:1px solid #a9b6cf;border-radius:6px;padding:12px;background:white;color:#26354e;font:inherit;font-weight:400}.ns-lead-form input:focus-visible,.ns-lead-form select:focus-visible,.ns-lead-form textarea:focus-visible{outline:3px solid #ae3c8270;outline-offset:1px}.ns-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.ns-lead-form button{padding:14px 22px;background:var(--ns-blue);color:white;border:none;border-radius:7px;font:inherit;font-weight:650;cursor:pointer;justify-self:start}.ns-lead-form button:hover{background:var(--ns-pink)}.ns-form-small{font-size:.85rem;color:#53627e;margin:0}.ns-form-hp{position:absolute!important;left:-10000px!important;height:1px;overflow:hidden}.ns-form-success{padding:16px;background:#eaf5ec;border-left:4px solid #387b4d}.ns-form-error{padding:16px;background:#fff0f0;border-left:4px solid #af3c3c}
@media(max-width:650px){.ns-form-grid{grid-template-columns:1fr}#ns-services,#ns-computer-sales,#ns-about,#ns-business-it,#ns-internet,#ns-boost,#ns-contact,#northside-contact-form{scroll-margin-top:175px}}

/* v1.4.1: keep service inquiries inside their cards, no overflow or collisions */
#ns-services .wp-block-columns{align-items:stretch;gap:24px;margin-bottom:24px}
#ns-services .wp-block-column{display:flex;min-width:0}
#ns-services .ns-card{display:flex;flex-direction:column;flex:1;min-width:0;min-height:225px;height:auto;margin:0;padding:24px;gap:0}
#ns-services .ns-card .ns-card-link{margin-top:auto;padding-top:22px;margin-bottom:0;position:static;line-height:1.5}
#ns-services .ns-card .ns-card-link a{display:inline-block;position:static}
@media(max-width:781px){#ns-services .wp-block-columns{gap:18px;margin-bottom:18px}#ns-services .ns-card{min-height:0}}