/*
Theme Name: RadiusRoar
Theme URI: https://radiusroar.com/
Author: RadiusRoar
Description: A high-conversion, responsive WordPress theme for local SEO and social media marketing agencies.
Version: 1.0.0
Requires at least: 6.4
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: radiusroar
Tags: custom-logo, custom-menu, featured-images, one-column, responsive-layout
*/

@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');

:root { --navy:#071325; --navy-2:#0d1c31; --ink:#101827; --paper:#f5f1e9; --white:#fffdf8; --coral:#ff5a3d; --lime:#d8ff4f; --blue:#49a7ff; --purple:#a887ff; --muted:#687284; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
section[id] { scroll-margin-top:94px; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:"Open Sans",Arial,sans-serif; }
button,input,select,textarea { font:inherit; }
a { color:inherit; text-decoration:none; }
button,a { -webkit-tap-highlight-color:transparent; }
main { overflow:hidden; }

.site-header { height:82px; padding:0 clamp(22px,4vw,68px); display:flex; align-items:center; position:fixed; top:0; left:0; right:0; z-index:50; color:white; background:rgba(7,19,37,.92); border-bottom:1px solid rgba(255,255,255,.12); box-shadow:0 8px 30px rgba(0,0,0,.14); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); }
.logo-link { display:inline-flex; }
.brand { display:inline-flex; align-items:center; gap:9px; color:var(--coral); }
.brand-mark { width:36px; height:36px; overflow:visible; }
.brand-word { color:var(--ink); font-size:21px; font-weight:850; letter-spacing:-.7px; }
.brand-word span { color:var(--coral); }
.brand-light .brand-word { color:white; }
.desktop-nav { display:flex; gap:clamp(20px,2.5vw,36px); margin-left:auto; margin-right:clamp(20px,2.7vw,38px); }
.desktop-nav a { color:#e1e6ee; font-size:15px; font-weight:700; transition:color .2s; white-space:nowrap; }
.desktop-nav a:hover { color:white; }
.nav-cta { display:inline-flex; align-items:center; gap:9px; background:var(--lime); color:var(--navy); padding:12px 18px; border-radius:100px; font-weight:800; font-size:13px; transition:transform .2s,box-shadow .2s; white-space:nowrap; }
.nav-cta:hover,.button:hover { transform:translateY(-2px); }
.mobile-menu { display:none; margin-left:auto; }
.mobile-menu summary { list-style:none; cursor:pointer; }
.mobile-menu summary::-webkit-details-marker { display:none; }
.mobile-menu .close-icon { display:none; }
.mobile-menu[open] .close-icon { display:block; }
.mobile-menu[open] summary>svg:first-child { display:none; }
.mobile-menu .menu-close { display:none; }
.mobile-menu summary { align-items:center; justify-content:center; font-size:27px; line-height:1; }
.mobile-menu[open] .menu-open { display:none; }
.mobile-menu[open] .menu-close { display:inline; }
.mobile-menu nav { position:absolute; left:0; right:0; top:82px; background:rgba(7,19,37,.98); padding:22px; display:grid; border-bottom:1px solid rgba(255,255,255,.12); box-shadow:0 18px 35px rgba(0,0,0,.24); }
.mobile-menu nav a { padding:15px 4px; font-size:15px; font-weight:700; border-bottom:1px solid rgba(255,255,255,.08); }

.hero { min-height:820px; padding:148px clamp(22px,7vw,112px) 118px; background:var(--navy); color:white; position:relative; display:grid; grid-template-columns:1.08fr .92fr; align-items:center; gap:clamp(36px,6vw,96px); }
.hero:before { content:""; position:absolute; width:460px; height:460px; right:18%; top:13%; background:rgba(73,167,255,.11); filter:blur(100px); border-radius:50%; }
.hero-noise { position:absolute; inset:0; opacity:.16; background-image:radial-gradient(rgba(255,255,255,.25) .55px,transparent .55px); background-size:7px 7px; mask-image:linear-gradient(to bottom,black,transparent 78%); }
.hero-copy,.hero-visual { position:relative; z-index:2; }
.eyebrow,.kicker { text-transform:uppercase; letter-spacing:.19em; font-size:11px; font-weight:850; }
.eyebrow { display:inline-flex; align-items:center; gap:9px; color:#dce4f2; margin-bottom:25px; }
.live-dot { width:8px; height:8px; border-radius:50%; background:var(--lime); box-shadow:0 0 0 5px rgba(216,255,79,.12); }
.hero h1 { font-size:clamp(53px,6.3vw,96px); line-height:.91; letter-spacing:-.066em; margin:0; max-width:760px; font-weight:880; }
.hero h1 span { color:var(--coral); display:block; }
.hero-copy>p { font-size:clamp(17px,1.5vw,21px); line-height:1.62; color:#b9c4d4; max-width:650px; margin:30px 0 34px; }
.hero-actions { display:flex; flex-wrap:wrap; gap:12px; }
.button { min-height:50px; display:inline-flex; align-items:center; justify-content:center; gap:10px; padding:0 22px; border-radius:100px; font-size:14px; font-weight:820; transition:transform .2s,box-shadow .2s; }
.button-primary { color:var(--navy); background:var(--lime); box-shadow:0 10px 30px rgba(216,255,79,.12); }
.button-ghost { color:white; border:1px solid rgba(255,255,255,.22); }
.hero-proof { display:flex; flex-wrap:wrap; gap:20px; margin-top:30px; color:#98a5b7; font-size:12px; font-weight:700; }
.hero-proof span { display:flex; align-items:center; gap:6px; }
.hero-proof svg { color:var(--lime); }
.hero-visual { min-height:520px; display:grid; place-items:center; }
.visual-frame { width:min(100%,530px); aspect-ratio:1/1.03; border-radius:38px; position:relative; background:linear-gradient(145deg,rgba(255,255,255,.12),rgba(255,255,255,.025)); border:1px solid rgba(255,255,255,.15); padding:13px; box-shadow:0 35px 100px rgba(0,0,0,.33); transform:rotate(2deg); }
.visual-frame:after { content:""; position:absolute; inset:11px; border-radius:28px; border:1px solid rgba(255,255,255,.11); pointer-events:none; }
.visual-frame>img { width:100%; height:100%; display:block; object-fit:cover; border-radius:28px; }
.metric-card,.status-pill { position:absolute; z-index:5; backdrop-filter:blur(14px); background:rgba(255,253,248,.94); color:var(--navy); border:1px solid rgba(255,255,255,.6); box-shadow:0 18px 45px rgba(0,0,0,.25); }
.metric-card { display:flex; align-items:center; gap:11px; padding:12px 15px; border-radius:16px; }
.metric-card strong { display:block; font-size:14px; }
.metric-card small { display:block; font-size:10px; color:#697588; margin-top:2px; }
.metric-icon { width:34px; height:34px; border-radius:10px; display:grid; place-items:center; background:var(--lime); }
.metric-top { right:-30px; top:55px; transform:rotate(-2deg); }
.metric-bottom { left:-35px; bottom:72px; transform:rotate(-2deg); }
.avatars { display:flex; }
.avatars span { width:28px; height:28px; margin-left:-7px; border-radius:50%; display:grid; place-items:center; color:white; background:#1f6fc2; border:2px solid white; font-size:9px; font-weight:800; }
.avatars span:first-child { margin-left:0; background:var(--coral); }
.avatars span:last-child { background:#6046a5; }
.status-pill { right:15px; bottom:-16px; padding:9px 13px; border-radius:100px; font-size:10px; font-weight:800; }
.status-pill span { display:inline-block; width:7px; height:7px; background:#44bf78; border-radius:50%; margin-right:6px; }
.hero-marquee { position:absolute; left:0; right:0; bottom:0; height:55px; display:flex; align-items:center; gap:28px; overflow:hidden; background:var(--coral); color:var(--navy); font-size:12px; font-weight:900; letter-spacing:.13em; white-space:nowrap; }
.hero-marquee svg { width:13px; flex:0 0 auto; }

.signal-strip { background:var(--white); padding:25px clamp(22px,7vw,112px); display:flex; justify-content:space-between; align-items:center; gap:30px; border-bottom:1px solid #ded8cd; }
.signal-strip p { margin:0; font-size:13px; font-weight:700; color:#79808b; }
.signal-strip div { display:flex; gap:clamp(16px,2.5vw,38px); align-items:center; flex-wrap:wrap; }
.signal-strip span { display:flex; align-items:center; gap:7px; font-size:12px; font-weight:800; }
.x-symbol { font-size:17px!important; }
.section { padding:clamp(78px,10vw,140px) clamp(22px,7vw,112px); }
.section-heading { display:grid; grid-template-columns:1.25fr .75fr; gap:60px; align-items:end; margin-bottom:55px; }
.kicker { display:block; color:var(--coral); margin-bottom:17px; }
.section-heading h2,.process-intro h2,.about-copy h2,.contact h2 { font-size:clamp(42px,5vw,72px); line-height:.98; letter-spacing:-.052em; margin:0; font-weight:860; }
h2 em { font-family:"Open Sans",Arial,sans-serif; font-weight:400; font-style:italic; letter-spacing:-.04em; }
.section-heading p { color:var(--muted); line-height:1.75; font-size:15px; max-width:520px; margin:0; }
.services { background:var(--paper); }
.services-grid { display:grid; grid-template-columns:repeat(4,1fr); border-left:1px solid #d7d0c4; border-top:1px solid #d7d0c4; }
.service-card { min-height:295px; padding:28px; border-right:1px solid #d7d0c4; border-bottom:1px solid #d7d0c4; transition:transform .25s,background .25s; }
.service-card:hover { transform:translateY(-5px); background:var(--white); }
.service-top { display:flex; justify-content:space-between; color:#858b92; font-size:11px; font-weight:800; }
.service-icon { width:46px; height:46px; border-radius:13px; display:grid; place-items:center; color:var(--navy); }
.service-card.coral .service-icon { background:#ffd3c9; }
.service-card.lime .service-icon { background:#e8fba4; }
.service-card.blue .service-icon { background:#c9e5ff; }
.service-card.purple .service-icon { background:#ded2ff; }
.service-card h3 { font-size:19px; margin:37px 0 12px; letter-spacing:-.02em; }
.service-card p { font-size:13px; line-height:1.7; color:var(--muted); margin:0 0 24px; }
.learn-link { display:flex; align-items:center; gap:7px; font-size:11px; font-weight:850; text-transform:uppercase; letter-spacing:.08em; }

.work { background:var(--navy); color:white; }
.light-heading p { color:#9ca9ba; }
.case-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.case-card { min-height:500px; padding:27px; border-radius:26px; color:var(--navy); display:flex; flex-direction:column; overflow:hidden; position:relative; }
.case-card:after { content:""; position:absolute; width:280px; height:280px; right:-100px; top:80px; border:1px solid rgba(7,19,37,.18); border-radius:50%; box-shadow:0 0 0 38px rgba(7,19,37,.04),0 0 0 76px rgba(7,19,37,.035); }
.case-card.coral { background:var(--coral); }
.case-card.lime { background:var(--lime); }
.case-card.blue { background:var(--blue); }
.case-top { display:flex; justify-content:space-between; align-items:center; position:relative; z-index:1; }
.case-top span { font-size:10px; font-weight:900; letter-spacing:.14em; }
.case-body { margin-top:auto; position:relative; z-index:1; }
.case-type { font-size:12px; font-weight:700; opacity:.68; }
.case-card h3 { font-size:clamp(27px,2.5vw,37px); line-height:1.06; letter-spacing:-.045em; max-width:390px; margin:10px 0 28px; }
.case-metrics { display:grid; grid-template-columns:1fr 1fr; gap:14px; padding-top:21px; border-top:1px solid rgba(7,19,37,.25); position:relative; z-index:1; }
.case-metrics strong { font-size:29px; letter-spacing:-.04em; display:block; }
.case-metrics span { display:block; font-size:10px; font-weight:700; margin-top:3px; opacity:.7; }
.results-note { color:#8e9aac; font-size:10px; text-align:right; margin:16px 2px 0; }

.process { display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(50px,9vw,130px); background:var(--white); }
.process-intro { position:sticky; top:40px; align-self:start; }
.process-intro>p { font-size:15px; line-height:1.75; color:var(--muted); max-width:430px; margin:27px 0; }
.text-link { display:inline-flex; align-items:center; gap:9px; font-size:13px; font-weight:850; border-bottom:2px solid var(--coral); padding-bottom:5px; }
.process-steps { border-top:1px solid #d9d5ce; }
.process-steps article { display:grid; grid-template-columns:68px 1fr; gap:14px; padding:34px 0; border-bottom:1px solid #d9d5ce; }
.process-steps article>span { color:var(--coral); font-size:11px; font-weight:900; letter-spacing:.12em; }
.process-steps h3 { font-size:25px; margin:0 0 9px; letter-spacing:-.035em; }
.process-steps p { color:var(--muted); line-height:1.7; font-size:13px; max-width:590px; margin:0; }

.about { background:var(--paper); }
.about-panel { min-height:580px; background:var(--coral); border-radius:36px; padding:clamp(35px,6vw,85px); display:grid; grid-template-columns:.8fr 1.2fr; align-items:center; gap:clamp(45px,8vw,120px); color:var(--navy); }
.about-badge { display:grid; place-items:center; position:relative; font-size:clamp(32px,4vw,55px); line-height:.8; letter-spacing:-.05em; text-align:center; }
.about-badge strong { position:absolute; z-index:3; }
.radar { width:min(100%,390px); aspect-ratio:1; border:1px solid rgba(7,19,37,.3); border-radius:50%; position:relative; display:grid; place-items:center; }
.radar span { position:absolute; border:1px solid rgba(7,19,37,.3); border-radius:50%; }
.radar span:nth-child(1) { width:76%; height:76%; }
.radar span:nth-child(2) { width:52%; height:52%; }
.radar span:nth-child(3) { width:27%; height:27%; background:rgba(216,255,79,.85); border:0; }
.radar i { position:absolute; width:50%; height:50%; left:50%; top:0; border-left:2px solid var(--navy); transform-origin:bottom left; transform:rotate(35deg); opacity:.65; }
.about-copy .kicker { color:var(--navy); }
.about-copy p { max-width:590px; line-height:1.72; font-size:15px; margin:28px 0; }
.about-points { display:grid; grid-template-columns:1fr 1fr; gap:14px 22px; }
.about-points span { display:flex; align-items:center; gap:8px; font-size:12px; font-weight:780; }
.about-points svg { background:var(--lime); border-radius:50%; padding:3px; }

.testimonials { background:var(--paper); }
.testimonial-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.testimonial-grid figure { margin:0; background:var(--white); border:1px solid #ded8cd; border-radius:22px; padding:29px; display:flex; flex-direction:column; min-height:335px; }
.stars { display:flex; gap:4px; color:var(--coral); }
.stars svg { width:14px; height:14px; fill:currentColor; }
.testimonial-grid blockquote { margin:26px 0 34px; font-family:"Open Sans",Arial,sans-serif; font-size:20px; line-height:1.5; color:#283142; }
.testimonial-grid figcaption { display:flex; align-items:center; gap:11px; margin-top:auto; }
.testimonial-grid figcaption>span { width:37px; height:37px; border-radius:50%; display:grid; place-items:center; background:var(--navy); color:white; font-size:12px; font-weight:850; }
.testimonial-grid figcaption strong,.testimonial-grid figcaption small { display:block; }
.testimonial-grid figcaption strong { font-size:11px; }
.testimonial-grid figcaption small { font-size:10px; color:#89909a; margin-top:3px; }

.contact { background:var(--navy); color:white; }
.contact-inner { display:grid; grid-template-columns:.88fr 1.12fr; gap:clamp(46px,7vw,100px); align-items:start; }
.contact h2 { font-size:clamp(50px,7vw,98px); }
.contact h2 em { color:var(--coral); }
.contact-copy p { color:#abb6c6; line-height:1.75; font-size:14px; max-width:540px; margin:28px 0 18px; }
.contact-copy small { display:flex; gap:8px; align-items:center; color:#8996a8; }
.contact-form { background:#0d1c31; border:1px solid rgba(255,255,255,.14); border-radius:28px; padding:clamp(24px,3.5vw,44px); display:grid; gap:19px; box-shadow:0 30px 80px rgba(0,0,0,.2); }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.contact-form label { display:grid; gap:8px; }
.contact-form label>span { color:#dbe2ec; font-size:11px; font-weight:750; }
.contact-form input,.contact-form select,.contact-form textarea { width:100%; color:white; background:#071325; border:1px solid rgba(255,255,255,.16); border-radius:12px; outline:none; padding:13px 14px; font-size:13px; transition:border-color .2s,box-shadow .2s; }
.contact-form input,.contact-form select { min-height:48px; }
.contact-form textarea { resize:vertical; min-height:125px; }
.contact-form input::placeholder,.contact-form textarea::placeholder { color:#68778c; }
.contact-form select:invalid { color:#68778c; }
.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus { border-color:var(--lime); box-shadow:0 0 0 3px rgba(216,255,79,.12); }
.form-submit { width:100%; border:0; cursor:pointer; margin-top:2px; }
.form-note { color:#728096; font-size:10px; line-height:1.5; text-align:center; margin:-7px 0 0; }
footer { background:#040b15; color:white; padding:65px clamp(22px,7vw,112px) 25px; }
.footer-main { display:flex; justify-content:space-between; gap:50px; }
.footer-main>div>p { color:#758195; font-size:13px; line-height:1.65; margin-top:17px; }
.footer-links { display:flex; gap:clamp(55px,9vw,120px); }
.footer-links div { display:grid; gap:12px; min-width:100px; }
.footer-links strong { color:#6f7a8d; font-size:10px; text-transform:uppercase; letter-spacing:.15em; margin-bottom:5px; }
.footer-links a { color:#d0d6df; font-size:12px; }
.footer-bottom { border-top:1px solid rgba(255,255,255,.1); padding-top:22px; margin-top:55px; display:flex; justify-content:space-between; color:#626f82; font-size:10px; text-transform:uppercase; letter-spacing:.09em; }

@media (max-width:1050px) {
  .desktop-nav { display:none; }
  .site-header .nav-cta { margin-left:auto; }
  .hero { grid-template-columns:1fr 1fr; gap:35px; }
  .hero h1 { font-size:clamp(52px,6.5vw,72px); }
  .visual-frame { width:90%; }
  .services-grid { grid-template-columns:repeat(2,1fr); }
  .case-grid { grid-template-columns:1fr; }
  .case-card { min-height:410px; }
}
@media (max-width:760px) {
  section[id] { scroll-margin-top:80px; }
  .site-header { height:70px; padding:0 20px; }
  .brand-mark { width:32px; height:32px; }
  .brand-word { font-size:19px; }
  .site-header .nav-cta { display:none; }
  .mobile-menu { display:block; }
  .mobile-menu nav { top:70px; }
  .hero { min-height:auto; padding-top:124px; grid-template-columns:1fr; }
  .hero h1 { font-size:clamp(50px,14vw,72px); }
  .hero-copy>p { font-size:16px; }
  .hero-visual { min-height:390px; }
  .visual-frame { width:min(88vw,430px); }
  .metric-top { right:-14px; }
  .metric-bottom { left:-14px; }
  .signal-strip { align-items:flex-start; flex-direction:column; }
  .section-heading,.process,.about-panel,.contact-inner { grid-template-columns:1fr; }
  .section-heading { gap:24px; }
  .services-grid { grid-template-columns:1fr; }
  .service-card { min-height:250px; }
  .process-intro { position:static; }
  .about-panel { border-radius:25px; }
  .radar { width:280px; }
  .about-copy h2 { font-size:40px; }
  .about-points { grid-template-columns:1fr; }
  .testimonial-grid { grid-template-columns:1fr; }
  .contact-inner { gap:38px; }
  .form-row { grid-template-columns:1fr; }
  .footer-main { flex-direction:column; }
  .footer-links { justify-content:space-between; }
  .footer-bottom { align-items:flex-start; flex-direction:column; gap:8px; }
}
@media (max-width:420px) {
  .hero-actions .button { width:100%; }
  .hero-proof { gap:12px; }
  .metric-card { transform:scale(.88) rotate(-2deg); }
  .case-card { min-height:450px; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*:before,*:after { transition:none!important; } }

/* WordPress integration */
.screen-reader-text { position:absolute!important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.custom-logo-link { display:inline-flex; align-items:center; }
.custom-logo { width:auto; height:44px; max-width:220px; }
.desktop-nav ul,.mobile-menu ul,.footer-links ul { list-style:none; margin:0; padding:0; }
.desktop-nav ul { display:flex; align-items:center; gap:clamp(20px,2.5vw,36px); }
.mobile-menu ul { display:grid; }
.mobile-menu li { border-bottom:1px solid rgba(255,255,255,.08); }
.mobile-menu nav a { display:block; }
.footer-links ul { display:grid; gap:12px; }
.admin-bar .site-header { top:32px; }
.site-header .current-menu-item>a { color:var(--lime); }
.rr-icon { font-size:21px; font-weight:800; line-height:1; }
.rr-editor-content { max-width:920px; margin:120px auto 80px; padding:0 24px; line-height:1.75; }
.rr-editor-content h1 { font-size:clamp(38px,5vw,68px); letter-spacing:-.04em; }
.rr-empty { padding:140px 24px; text-align:center; }
.contact-alert { border-radius:12px; padding:13px 15px; margin:0 0 18px; font-size:13px; }
.contact-alert.success { background:rgba(216,255,79,.13); border:1px solid rgba(216,255,79,.45); color:#edffc1; }
.contact-alert.error { background:rgba(255,90,61,.13); border:1px solid rgba(255,90,61,.45); color:#ffd4cc; }
.rr-honeypot { position:absolute!important; left:-9999px!important; opacity:0!important; pointer-events:none!important; }
.contact-form .button { border:0; cursor:pointer; }
.wp-caption,.wp-caption img { max-width:100%; height:auto; }
.alignwide { max-width:1200px; margin-left:auto; margin-right:auto; }
.alignfull { width:100vw; margin-left:calc(50% - 50vw); }
@media (max-width:782px) { .admin-bar .site-header { top:46px; } }