/* Theme Name: Aimee 2026 Theme URI: https://aimee.ae Description: Purpose-built Astra child theme for the Aimee Digital 2026 rebrand. Ships the global design system (tokens, typography, colour, spacing, components), animation styles and advanced-interaction JavaScript. Page content is built with native Gutenberg + Spectra blocks that carry these semantic classes. All design-system CSS is scoped under .aimee-2026 so it cannot disturb the live site or wp-admin during development. Author: Aimee Digital Template: astra Version: 0.9.7 Text Domain: aimee-2026 */ /* ============================================================ DESIGN TOKENS ============================================================ */ :root{ /* Brand */ --aimee-gold:#f2dc71; /* primary text/line gold (as used across pages) */ --aimee-gold-bright:#f9ea9f; /* CTA/glow gold (brand accent per design.md) */ --aimee-gold-rgb:242,220,113; --aimee-gold-bright-rgb:249,234,159; --aimee-gold-dim:rgba(242,220,113,.35); /* Surfaces */ --aimee-bg:#080807; --aimee-bg-deep:#050504; --aimee-surface:#0d0d0c; --aimee-surface-2:#111110; /* Text */ --aimee-text:#ffffff; --aimee-text-dim:rgba(255,255,255,.74); --aimee-text-faint:rgba(255,255,255,.48); /* Section accents */ --aimee-cyan:#00b4d8; --aimee-fuchsia:#e91e8c; --aimee-purple:#9b6dd4; --aimee-pink:#f06292; --aimee-green:#00c850; --aimee-turquoise:#00b090; /* Type */ --aimee-font-display:'Cormorant Garamond',Georgia,'Times New Roman',serif; --aimee-font-body:'Montserrat',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif; /* Layout */ --aimee-container:1200px; --aimee-container-narrow:900px; --aimee-gutter:3rem; } /* ============================================================ SCOPED RESET (only inside .aimee-2026 — never global) ============================================================ */ .aimee-2026, .aimee-2026 *, .aimee-2026 *::before, .aimee-2026 *::after{ box-sizing:border-box; } .aimee-2026{ background:var(--aimee-bg); color:var(--aimee-text); font-family:var(--aimee-font-body); font-weight:400; line-height:1.7; -webkit-font-smoothing:antialiased; overflow-x:hidden; } /* Fine film-grain noise overlay */ .aimee-2026::before{ content:'';position:fixed;inset:0;pointer-events:none;z-index:1;opacity:.45; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E"); } .aimee-2026 > *{ position:relative; z-index:2; } /* ============================================================ TYPOGRAPHY ============================================================ */ .aimee-2026 h1,.aimee-2026 h2,.aimee-2026 h3,.aimee-2026 h4, .aimee-2026 .aimee-display{ font-family:var(--aimee-font-display); font-weight:300; line-height:1.1; } .aimee-2026 .aimee-eyebrow{ font-family:var(--aimee-font-body); font-size:0.58rem;letter-spacing:0.3em;text-transform:uppercase; color:var(--aimee-gold);margin-bottom:2rem;font-weight:500; } .aimee-2026 .aimee-page-title{ font-size:clamp(3rem,7vw,6rem); margin-bottom:2rem; } .aimee-2026 .aimee-sub{ font-family:var(--aimee-font-display);font-size:1.3rem;font-style:italic;font-weight:300; color:var(--aimee-text-dim);max-width:560px; } .aimee-2026 .aimee-body{ font-size:0.95rem;line-height:2;color:var(--aimee-text-dim); } /* ============================================================ LAYOUT HELPERS ============================================================ */ .aimee-2026 .aimee-wrap{ max-width:var(--aimee-container);margin:0 auto;padding:0 var(--aimee-gutter); } .aimee-2026 .aimee-wrap--narrow{ max-width:var(--aimee-container-narrow); } .aimee-2026 .aimee-section{ padding:6rem var(--aimee-gutter); } .aimee-2026 .aimee-hero{ padding:16rem var(--aimee-gutter) 6rem;text-align:center;position:relative;overflow:hidden; } /* Translucent colour orbs */ .aimee-2026 .aimee-orb{ position:absolute;border-radius:50%;filter:blur(100px);pointer-events:none;z-index:0; } /* Divider */ .aimee-2026 .aimee-divider{ width:1px;height:80px;margin:5rem auto; background:linear-gradient(to bottom,transparent,var(--aimee-gold-dim),transparent); } /* ============================================================ BUTTONS ============================================================ */ .aimee-2026 .aimee-btn{ display:inline-block;font-family:var(--aimee-font-body); font-size:0.58rem;letter-spacing:.3em;text-transform:uppercase; padding:.95rem 2.5rem;border:1px solid rgba(255,255,255,.38); color:rgba(255,255,255,.82);text-decoration:none;cursor:pointer;background:none; transition:all .4s; } .aimee-2026 .aimee-btn:hover{ background:rgba(255,255,255,.08);border-color:var(--aimee-text);color:var(--aimee-text); } .aimee-2026 .aimee-btn--gold{ border-color:rgba(var(--aimee-gold-bright-rgb),.65);color:var(--aimee-gold-bright); box-shadow:0 0 18px 3px rgba(var(--aimee-gold-bright-rgb),.18), inset 0 0 12px rgba(var(--aimee-gold-bright-rgb),.06); } .aimee-2026 .aimee-btn--gold:hover{ background:rgba(var(--aimee-gold-bright-rgb),.1);border-color:var(--aimee-gold-bright); box-shadow:0 0 30px 6px rgba(var(--aimee-gold-bright-rgb),.3), inset 0 0 20px rgba(var(--aimee-gold-bright-rgb),.1);color:var(--aimee-text); } /* ============================================================ HEADER / NAV (applied globally only at go-live via body.aimee-live) ============================================================ */ .aimee-2026 .aimee-nav{ position:fixed;top:0;left:0;right:0;z-index:500;padding:1.4rem 2.8rem; display:flex;align-items:center;justify-content:space-between; background:linear-gradient(to bottom,rgba(8,8,7,.9),transparent); } .aimee-2026 .aimee-nav__logo img{ height:52px;width:auto;display:block; } .aimee-2026 .aimee-nav__links{ display:flex;gap:2.2rem;list-style:none;margin:0;padding:0; } .aimee-2026 .aimee-nav__links a{ font-size:0.82rem;font-weight:500;letter-spacing:0.14em;text-transform:uppercase; color:rgba(255,255,255,.85);text-decoration:none;transition:color .3s; } .aimee-2026 .aimee-nav__links a:hover, .aimee-2026 .aimee-nav__links a.active{ color:var(--aimee-gold-bright); } .aimee-2026 .aimee-nav__cta{ font-size:0.72rem;letter-spacing:.14em;text-transform:uppercase;white-space:nowrap; border:1px solid rgba(var(--aimee-gold-bright-rgb),.55);color:var(--aimee-gold-bright); padding:.6rem 1.4rem;text-decoration:none;transition:all .4s; box-shadow:0 0 12px 2px rgba(var(--aimee-gold-bright-rgb),.18), inset 0 0 10px rgba(var(--aimee-gold-bright-rgb),.06); } .aimee-2026 .aimee-nav__cta:hover{ background:rgba(var(--aimee-gold-bright-rgb),.1);border-color:var(--aimee-gold-bright);color:var(--aimee-text); box-shadow:0 0 28px 6px rgba(var(--aimee-gold-bright-rgb),.38), inset 0 0 18px rgba(var(--aimee-gold-bright-rgb),.12); } /* ============================================================ COMPONENT: two-column editorial (About story) ============================================================ */ .aimee-2026 .aimee-two-col{ display:grid;grid-template-columns:1fr 1fr;gap:5rem;margin-bottom:6rem;align-items:start; } .aimee-2026 .aimee-col-label{ font-size:0.58rem;letter-spacing:0.3em;text-transform:uppercase;color:var(--aimee-gold);margin-bottom:1.5rem; } .aimee-2026 .aimee-col-title{ font-size:clamp(1.8rem,3vw,2.6rem);margin-bottom:1.5rem; } /* COMPONENT: stats row */ .aimee-2026 .aimee-stats{ display:grid;grid-template-columns:repeat(3,1fr);gap:3rem;margin:5rem 0;text-align:center; } .aimee-2026 .aimee-stat__num{ font-family:var(--aimee-font-display);font-size:clamp(2.5rem,5vw,4rem);font-weight:300;color:var(--aimee-gold);margin-bottom:.5rem; } .aimee-2026 .aimee-stat__label{ font-size:.58rem;letter-spacing:0.22em;text-transform:uppercase;color:var(--aimee-text-dim); } /* COMPONENT: value / feature cards grid */ .aimee-2026 .aimee-cards{ display:grid;grid-template-columns:repeat(2,1fr);gap:2px;margin:5rem 0; } .aimee-2026 .aimee-card{ background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.06);padding:2.5rem;transition:background .3s; } .aimee-2026 .aimee-card:hover{ background:rgba(var(--aimee-gold-rgb),.04); } .aimee-2026 .aimee-card__num{ font-family:var(--aimee-font-display);font-size:2rem;font-weight:300;color:var(--aimee-gold);margin-bottom:1rem; } .aimee-2026 .aimee-card__title{ font-family:var(--aimee-font-display);font-size:1.4rem;font-weight:300;margin-bottom:.8rem;color:var(--aimee-text); } .aimee-2026 .aimee-card__body{ font-size:.82rem;line-height:1.9;color:rgba(255,255,255,.78); } /* COMPONENT: work / case-study card */ .aimee-2026 .aimee-work-card{ position:relative;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.02);overflow:hidden;transition:border-color .45s,transform .45s,box-shadow .45s;display:flex;flex-direction:column; } .aimee-2026 .aimee-work-card:hover{ border-color:rgba(var(--aimee-gold-rgb),.5);transform:translateY(-6px);box-shadow:0 26px 60px -30px rgba(var(--aimee-gold-rgb),.5); } .aimee-2026 .aimee-work-card__media{ position:relative;aspect-ratio:16/10;overflow:hidden;background:#0d0d0c;border-bottom:1px dashed rgba(255,255,255,.14); } .aimee-2026 .aimee-work-card__media img{ width:100%;height:100%;object-fit:cover;display:block; } .aimee-2026 .aimee-badge{ position:absolute;top:1rem;left:1rem;z-index:4;font-size:.44rem;letter-spacing:0.22em;text-transform:uppercase;color:var(--aimee-gold);background:rgba(6,6,5,.7);border:1px solid rgba(var(--aimee-gold-rgb),.45);padding:.35rem .7rem;backdrop-filter:blur(6px); } .aimee-2026 .aimee-tag{ position:absolute;top:1rem;right:1rem;z-index:4;font-size:.44rem;letter-spacing:0.22em;text-transform:uppercase;color:rgba(255,255,255,.75);background:rgba(6,6,5,.55);padding:.35rem .7rem;backdrop-filter:blur(6px); } .aimee-2026 .aimee-work-card__body{ padding:1.6rem 1.7rem 1.8rem;display:flex;flex-direction:column;flex:1; } .aimee-2026 .aimee-work-card__h{ font-family:var(--aimee-font-display);font-size:1.6rem;font-weight:400;line-height:1.14;margin-bottom:1.1rem;color:var(--aimee-text); } /* COMPONENT: pricing plan card */ .aimee-2026 .aimee-plan{ background:var(--aimee-surface);border:1px solid rgba(var(--aimee-gold-rgb),.15);padding:2.5rem;display:flex;flex-direction:column;transition:border-color .4s; } .aimee-2026 .aimee-plan:hover{ border-color:rgba(var(--aimee-gold-rgb),.4); } .aimee-2026 .aimee-plan__name{ font-family:var(--aimee-font-display);font-size:1.6rem;font-weight:300;margin-bottom:.5rem; } .aimee-2026 .aimee-plan__price{ font-family:var(--aimee-font-display);font-size:2.6rem;color:var(--aimee-gold);margin:.5rem 0; } .aimee-2026 .aimee-plan__cycle{ font-size:0.72rem;color:var(--aimee-text-dim);margin-bottom:1.5rem; } .aimee-2026 .aimee-plan__features{ list-style:none;padding:0;margin:0 0 2rem;flex:1; } .aimee-2026 .aimee-plan__features li{ font-size:0.82rem;color:rgba(255,255,255,.78);padding:.55rem 0;border-bottom:1px solid rgba(255,255,255,.06);display:flex;gap:.7rem; } .aimee-2026 .aimee-plan__features li::before{ content:'';width:14px;height:1px;background:var(--aimee-gold);flex-shrink:0;margin-top:.55rem; } /* COMPONENT: CTA bar */ .aimee-2026 .aimee-cta-bar{ text-align:center;padding:5rem var(--aimee-gutter);border-top:1px solid rgba(255,255,255,.06); } .aimee-2026 .aimee-cta-bar h2{ font-size:clamp(1.8rem,4vw,3rem);margin-bottom:2rem; } /* ============================================================ FOOTER ============================================================ */ .aimee-2026 .aimee-footer{ background:var(--aimee-bg-deep);padding:4rem var(--aimee-gutter);text-align:center;border-top:1px solid rgba(255,255,255,.05); } .aimee-2026 .aimee-footer__links{ display:flex;gap:2rem;justify-content:center;list-style:none;margin:0 0 1.5rem;padding:0;flex-wrap:wrap; } .aimee-2026 .aimee-footer__links a{ font-size:0.58rem;letter-spacing:0.22em;text-transform:uppercase;color:var(--aimee-text-dim);text-decoration:none;transition:color .3s; } .aimee-2026 .aimee-footer__links a:hover{ color:var(--aimee-gold); } .aimee-2026 .aimee-footer__social{ display:flex;gap:1.5rem;justify-content:center;margin-bottom:1.5rem; } .aimee-2026 .aimee-footer__social a{ font-size:0.58rem;letter-spacing:0.14em;text-transform:uppercase;color:var(--aimee-text-faint);text-decoration:none;transition:color .3s; } .aimee-2026 .aimee-footer__social a:hover{ color:var(--aimee-gold); } .aimee-2026 .aimee-footer__copy{ font-size:0.58rem;letter-spacing:0.06em;color:rgba(255,255,255,.22); } /* ============================================================ SUREFORMS — contact form skin (scoped) ============================================================ */ .aimee-2026 .srfm-form input, .aimee-2026 .srfm-form textarea, .aimee-2026 .srfm-form select{ background:rgba(255,255,255,.03)!important;border:1px solid rgba(255,255,255,.1)!important; color:var(--aimee-text)!important;font-family:var(--aimee-font-body)!important;font-size:0.82rem!important;border-radius:0!important; } .aimee-2026 .srfm-form label{ color:rgba(255,255,255,.75)!important;font-size:.58rem!important;letter-spacing:.22em!important;text-transform:uppercase!important;font-weight:500!important; } .aimee-2026 .srfm-form button[type=submit]{ background:none!important;border:1px solid var(--aimee-gold-dim)!important;color:var(--aimee-gold-bright)!important; letter-spacing:.3em!important;text-transform:uppercase!important;border-radius:0!important;transition:all .4s!important; } .aimee-2026 .srfm-form button[type=submit]:hover{ background:rgba(var(--aimee-gold-bright-rgb),.1)!important;border-color:var(--aimee-gold-bright)!important;color:var(--aimee-text)!important; } /* ============================================================ ANIMATION UTILITIES (respect reduced motion) ============================================================ */ .aimee-2026 .aimee-fade{ opacity:0;transform:translateY(14px);transition:opacity 1s ease,transform 1s ease; } .aimee-2026 .aimee-fade.is-in{ opacity:1;transform:none; } @media (prefers-reduced-motion:reduce){ .aimee-2026 .aimee-fade{ opacity:1;transform:none;transition:none; } } /* ============================================================ RESPONSIVE ============================================================ */ @media (max-width:820px){ .aimee-2026 .aimee-two-col, .aimee-2026 .aimee-cards, .aimee-2026 .aimee-stats{ grid-template-columns:1fr; } .aimee-2026 .aimee-nav{ padding:1.2rem 1.4rem; } .aimee-2026 .aimee-nav__links{ display:none; } /* mobile menu handled by JS toggle */ .aimee-2026 .aimee-hero{ padding:11rem 1.5rem 3rem; } .aimee-2026 .aimee-section{ padding:4rem 1.5rem; } :root{ --aimee-gutter:1.5rem; } } /* ============================================================ GUTENBERG BUTTON FIX Gutenberg outputs .wp-block-button (wrapper) > a.wp-block-button__link. The wrapper must stay chrome-free or the theme border draws a second box around WordPress's own button styling. All visuals live on the inner . ============================================================ */ .aimee-2026 .wp-block-button.aimee-btn, .aimee-2026 .wp-block-button.aimee-btn--gold{ border:0!important;background:none!important;box-shadow:none!important;padding:0!important; } .aimee-2026 .wp-block-button.aimee-btn > .wp-block-button__link{ display:inline-block;font-family:var(--aimee-font-body); font-size:0.58rem;letter-spacing:.3em;text-transform:uppercase; padding:.95rem 2.5rem;border:1px solid rgba(255,255,255,.38);border-radius:0; color:rgba(255,255,255,.82);text-decoration:none;background:none;transition:all .4s; } .aimee-2026 .wp-block-button.aimee-btn > .wp-block-button__link:hover{ background:rgba(255,255,255,.08);border-color:var(--aimee-text);color:var(--aimee-text); } .aimee-2026 .wp-block-button.aimee-btn--gold > .wp-block-button__link{ border-color:rgba(var(--aimee-gold-bright-rgb),.65);color:var(--aimee-gold-bright); box-shadow:0 0 18px 3px rgba(var(--aimee-gold-bright-rgb),.18), inset 0 0 12px rgba(var(--aimee-gold-bright-rgb),.06); } .aimee-2026 .wp-block-button.aimee-btn--gold > .wp-block-button__link:hover{ background:rgba(var(--aimee-gold-bright-rgb),.1);border-color:var(--aimee-gold-bright); box-shadow:0 0 30px 6px rgba(var(--aimee-gold-bright-rgb),.3), inset 0 0 20px rgba(var(--aimee-gold-bright-rgb),.1);color:var(--aimee-text); } /* ============================================================ SHARED GRID NORMALISER WordPress block-gap adds margin-block-start to every sibling except the first, which knocks grid/flex children out of alignment (first item ends up 24px taller). These components are used on every page, so the fix lives here in the shared stylesheet rather than the homepage-only one. ============================================================ */ .aimee-2026 .aimee-cards > *, .aimee-2026 .aimee-stats > *, .aimee-2026 .aimee-minigrid > *, .aimee-2026 .aimee-loop > *, .aimee-2026 .aimee-cases > *, .aimee-2026 .aimee-tags > *, .aimee-2026 .aimee-btn-row > *{ margin-top:0!important; margin-block-start:0!important; margin-bottom:0!important; } .aimee-2026 .aimee-cards, .aimee-2026 .aimee-stats, .aimee-2026 .aimee-minigrid, .aimee-2026 .aimee-loop, .aimee-2026 .aimee-cases{ align-items:stretch; } /* Gutenberg columns bring their own gap; keep the editorial two-column block top-aligned and stop the gap doubling up. */ .aimee-2026 .wp-block-columns.aimee-two-col{ align-items:flex-start;gap:5rem;margin-bottom:6rem; } .aimee-2026 .wp-block-columns.aimee-two-col > .wp-block-column{ margin:0; } /* ==== FIX PACK 3 ========================================================= Accent-reactive chrome, matching the original design: - cards/loop stages/case cards lift on hover with an accent-tinted glow - the header CTA tracks the active slide accent (JS sets --aimee-accent) ======================================================================== */ /* Card hover: lift + accent glow (accent falls back to gold outside slides) */ .aimee-2026 .aimee-minicard, .aimee-2026 .aimee-card, .aimee-2026 .aimee-case, .aimee-2026 .aimee-loop-stage{ transition:border-color .4s, transform .4s, box-shadow .4s, background .4s; } .aimee-2026 .aimee-minicard:hover, .aimee-2026 .aimee-card:hover{ border-color:rgba(var(--slide-accent-rgb,var(--aimee-accent-rgb,242,220,113)),.45); transform:translateY(-3px); box-shadow:0 12px 30px -18px rgba(var(--slide-accent-rgb,var(--aimee-accent-rgb,242,220,113)),.4); } .aimee-2026 .aimee-loop-stage:hover{ border-color:rgba(var(--slide-accent-rgb,var(--aimee-accent-rgb,242,220,113)),.5); background:rgba(var(--slide-accent-rgb,var(--aimee-accent-rgb,242,220,113)),.05); transform:translateY(-3px); } .aimee-2026 .aimee-case:hover{ border-color:rgba(var(--slide-accent-rgb,var(--aimee-accent-rgb,242,220,113)),.45); transform:translateY(-4px); box-shadow:0 12px 32px -16px rgba(var(--slide-accent-rgb,var(--aimee-accent-rgb,242,220,113)),.35); } /* Tag pills carry the accent too */ .aimee-2026 .aimee-tags .pill{ color:var(--slide-accent,var(--aimee-accent,#f2dc71)); border-color:rgba(var(--slide-accent-rgb,var(--aimee-accent-rgb,242,220,113)),.3); } /* Header CTA follows the active accent (JS keeps --aimee-accent in sync) */ .aimee-2026 .aimee-nav__cta{ border-color:rgba(var(--aimee-accent-rgb,249,234,159),.55)!important; color:var(--aimee-accent,#f9ea9f)!important; box-shadow:0 0 12px 2px rgba(var(--aimee-accent-rgb,249,234,159),.18), inset 0 0 10px rgba(var(--aimee-accent-rgb,249,234,159),.06); transition:all .4s; } .aimee-2026 .aimee-nav__cta:hover{ background:rgba(var(--aimee-accent-rgb,249,234,159),.1)!important; border-color:var(--aimee-accent,#f9ea9f)!important;color:var(--aimee-text)!important; box-shadow:0 0 28px 6px rgba(var(--aimee-accent-rgb,249,234,159),.38), inset 0 0 18px rgba(var(--aimee-accent-rgb,249,234,159),.12); } /* Active nav link also picks up the accent */ .aimee-2026 .aimee-nav__links a:hover, .aimee-2026 .aimee-nav__links .current-menu-item > a{ color:var(--aimee-accent,#f9ea9f); } /* Honour reduced motion for the decorative lift */ @media (prefers-reduced-motion:reduce){ .aimee-2026 .aimee-minicard:hover, .aimee-2026 .aimee-card:hover, .aimee-2026 .aimee-case:hover, .aimee-2026 .aimee-loop-stage:hover{ transform:none; } } /* ============================================================ VIDEO SHOWCASE (Digital Presence, Reimagined) Each card holds an editable video/embed. The slot keeps a 16:9 box so the grid stays even before any media is added, and collapses to one column on small screens. ============================================================ */ .aimee-2026 .aimee-video-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem; margin:2.5rem 0; align-items:stretch; } .aimee-2026 .aimee-video-grid > *{ margin:0!important; } .aimee-2026 .aimee-video-card{ border:1px solid rgba(255,255,255,.08); background:rgba(255,255,255,.02); display:flex; flex-direction:column; overflow:hidden; transition:border-color .4s, transform .4s, box-shadow .4s; } .aimee-2026 .aimee-video-card:hover{ border-color:rgba(var(--aimee-accent-rgb,0,200,80),.45); transform:translateY(-4px); box-shadow:0 12px 32px -16px rgba(var(--aimee-accent-rgb,0,200,80),.35); } .aimee-2026 .aimee-video-slot{ aspect-ratio:16/9; background:#0d0d0c; display:flex; align-items:center; justify-content:center; border-bottom:1px dashed rgba(255,255,255,.14); position:relative; } .aimee-2026 .aimee-video-slot .ph{ font-size:0.58rem; letter-spacing:0.14em; text-transform:uppercase; color:rgba(255,255,255,.3); text-align:center; padding:0 1rem; } /* Real media dropped into the card takes the slot's place cleanly */ .aimee-2026 .aimee-video-card .wp-block-video, .aimee-2026 .aimee-video-card .wp-block-embed{ margin:0; } .aimee-2026 .aimee-video-card video, .aimee-2026 .aimee-video-card iframe{ width:100%; aspect-ratio:16/9; display:block; border:0; } .aimee-2026 .aimee-video-card__body{ padding:1.3rem 1.4rem 1.5rem; } @media (max-width:1024px){ .aimee-2026 .aimee-video-grid{ grid-template-columns:repeat(2,1fr); } } @media (max-width:640px){ .aimee-2026 .aimee-video-grid{ grid-template-columns:1fr; } } /* ==== FIX PACK 6 ========================================================= Two real defects found on the PUBLISHED pages: 1) Double logo in the header on every non-home page. The nav logo rules lived in aimee-home.css, which only loads on the home template, so the second (crossfade) image was never hidden and stacked below the first. These rules are shared chrome — they belong here. 2) Text drifting left/right between slides. .aimee-slide is a flex container, so .aimee-slide__inner shrink-wrapped to its own content and each slide ended up a different width (820/941/1069/1080). Give the inner a deterministic measure so every slide shares the same optical centre. ======================================================================== */ /* --- 1) Shared nav logo (crossfade pair) --- */ .aimee-2026 .aimee-nav__logo{ position:relative; display:inline-block; height:52px; line-height:0; flex-shrink:0; } .aimee-2026 .aimee-nav__logo img{ height:52px; width:auto; display:block; position:static; transition:opacity .7s ease; } .aimee-2026 .aimee-nav__logo img + img{ position:absolute; top:0; left:0; } .aimee-2026 .aimee-nav__logo img.fade{ opacity:0; } /* --- 2) Deterministic content measure --- */ .aimee-2026 .aimee-slide__inner{ width:100%; max-width:820px; margin-inline:auto; } .aimee-2026 .aimee-slide__inner--wide{ max-width:1080px; } /* Supporting copy keeps a readable, consistent line length on every slide */ .aimee-2026 .aimee-slide__body{ max-width:620px; margin-inline:auto; } .aimee-2026 .aimee-slide__italic{ max-width:760px; margin-inline:auto; } /* Grids always fill the measure, so card rows line up slide to slide */ .aimee-2026 .aimee-minigrid, .aimee-2026 .aimee-cases, .aimee-2026 .aimee-loop, .aimee-2026 .aimee-tags, .aimee-2026 .aimee-btn-row{ width:100%; } .aimee-2026 .aimee-loop{ max-width:100%; } /* ==== SHARED COMPONENT LIBRARY =========================================== ROOT CAUSE of the left-drift: these components are used on EVERY page, but their rules lived in aimee-home.css, which only loads on the home template. Inner pages therefore rendered them unstyled — centred flex rows packed to the left, fixed-width blocks lost their auto margins. Everything shared now lives here. aimee-home.css keeps only deck-specific chrome (entry splash, slide transitions, bar rail, matrix canvas). ======================================================================== */ /* --- Centred content blocks --- */ .aimee-2026 .aimee-sub{ margin-inline:auto; } .aimee-2026 .aimee-body{ margin-inline:auto; } .aimee-2026 .aimee-hero, .aimee-2026 .aimee-cta-bar{ text-align:center; } /* --- Button rows: always centred, on every page --- */ .aimee-2026 .aimee-btn-row, .aimee-2026 .wp-block-buttons.aimee-btn-row{ display:flex; gap:1rem; justify-content:center; align-items:center; flex-wrap:wrap; } .aimee-2026 .aimee-trust{ font-size:0.58rem; letter-spacing:.22em; text-transform:uppercase; color:rgba(255,255,255,.4); margin-top:1.6rem; text-align:center; } /* --- Footer: the PHP fallback emits .aimee-nav__links, so centre both --- */ .aimee-2026 .aimee-footer ul, .aimee-2026 .aimee-footer .aimee-nav__links, .aimee-2026 .aimee-footer__links{ display:flex; flex-wrap:wrap; gap:2rem; justify-content:center; list-style:none; margin:0 0 1.5rem; padding:0; } .aimee-2026 .aimee-footer .aimee-nav__links a{ font-size:0.58rem; letter-spacing:0.22em; text-transform:uppercase; color:var(--aimee-text-dim); text-decoration:none; } .aimee-2026 .aimee-footer .aimee-nav__links a:hover{ color:var(--aimee-gold); } .aimee-2026 .aimee-footer__social{ display:flex; gap:1.5rem; justify-content:center; flex-wrap:wrap; } /* --- Card grids (used on About, service pages, Work) --- */ .aimee-2026 .aimee-minigrid{ display:grid; grid-template-columns:repeat(2,1fr); gap:.9rem; margin:1.5rem 0 1.2rem; text-align:left; align-items:stretch; width:100%; } .aimee-2026 .aimee-minicard{ background:rgba(255,255,255,.025); border:1px solid rgba(255,255,255,.08); padding:1.25rem 1.35rem; } .aimee-2026 .aimee-minicard h4{ font-family:var(--aimee-font-display); font-size:1.2rem; font-weight:400; margin:0 0 .5rem; color:var(--aimee-text); } .aimee-2026 .aimee-minicard p{ font-size:0.82rem; line-height:1.85; color:rgba(255,255,255,.68); margin:0; } .aimee-2026 .aimee-minicard .num{ display:block; font-family:var(--aimee-font-display); font-size:1.05rem; color:var(--slide-accent,var(--aimee-gold)); margin-bottom:.4rem; } /* --- Process loop (used on the Intelligent Content page) --- */ .aimee-2026 .aimee-loop{ display:flex; gap:.6rem; justify-content:center; flex-wrap:wrap; margin:1.6rem 0; width:100%; text-align:left; } .aimee-2026 .aimee-loop-stage{ flex:1 1 140px; min-width:118px; max-width:180px; background:rgba(255,255,255,.025); border:1px solid rgba(255,255,255,.08); padding:1.1rem .85rem; } .aimee-2026 .aimee-loop-stage .n{ width:26px; height:26px; border-radius:50%; border:1px solid var(--slide-accent,var(--aimee-gold)); color:var(--slide-accent,var(--aimee-gold)); display:flex; align-items:center; justify-content:center; font-size:0.58rem; margin-bottom:.7rem; } .aimee-2026 .aimee-loop-stage h4{ font-family:var(--aimee-font-display); font-size:1.05rem; font-weight:400; margin:0 0 .35rem; color:var(--aimee-text); } .aimee-2026 .aimee-loop-stage p{ font-size:0.72rem; line-height:1.75; color:rgba(255,255,255,.62); margin:0; } /* --- Tag pills --- */ .aimee-2026 .aimee-tags{ display:flex; gap:.6rem; justify-content:center; flex-wrap:wrap; margin:1.6rem 0 2rem; } .aimee-2026 .aimee-tags .pill{ font-size:.58rem; letter-spacing:0.14em; text-transform:uppercase; color:var(--slide-accent,var(--aimee-gold)); border:1px solid rgba(var(--slide-accent-rgb,var(--aimee-gold-rgb)),.3); padding:.5rem 1rem; margin:0; } /* --- Accent themes also apply outside slides (e.g. a themed hero) --- */ .aimee-2026 .is-gold { --slide-accent:var(--aimee-gold); --slide-accent-rgb:242,220,113; } .aimee-2026 .is-cyan { --slide-accent:var(--aimee-cyan); --slide-accent-rgb:0,180,216; } .aimee-2026 .is-green { --slide-accent:var(--aimee-green); --slide-accent-rgb:0,200,80; } .aimee-2026 .is-fuchsia{ --slide-accent:var(--aimee-fuchsia); --slide-accent-rgb:233,30,140; } .aimee-2026 .is-purple { --slide-accent:var(--aimee-purple); --slide-accent-rgb:155,109,212; } .aimee-2026 .is-pink { --slide-accent:var(--aimee-pink); --slide-accent-rgb:240,98,146; } .aimee-2026 .aimee-hero.is-green .aimee-page-title{ color:var(--aimee-green); } .aimee-2026 .aimee-hero.is-green .aimee-eyebrow{ color:var(--aimee-green); } @media (max-width:640px){ .aimee-2026 .aimee-minigrid{ grid-template-columns:1fr; } .aimee-2026 .aimee-loop{ flex-direction:column; align-items:stretch; } .aimee-2026 .aimee-loop-stage{ max-width:none; } .aimee-2026 .aimee-footer ul{ gap:1rem; } } /* ==== MOBILE NAVIGATION ================================================== The fixed header was transparent and reserved no space, so slide content ran underneath the logo and CTA. Give the bar a solid backdrop, a known height, and add the hamburger + full-screen panel. ======================================================================== */ /* Solid header on small screens so nothing shows through it */ @media (max-width:1024px){ .aimee-2026 .aimee-nav{ background:rgba(6,6,5,.94); backdrop-filter:blur(10px); border-bottom:1px solid rgba(255,255,255,.06); padding:.9rem 1.1rem; min-height:72px; } .aimee-2026 .aimee-nav__logo, .aimee-2026 .aimee-nav__logo img{ height:42px; } /* header CTA is duplicated inside the panel on phones */ .aimee-2026 .aimee-nav__cta{ display:none; } } @media (min-width:1025px){ .aimee-2026 .aimee-burger{ display:none; } } /* Hamburger */ .aimee-2026 .aimee-burger{ display:flex; flex-direction:column; justify-content:center; gap:5px; width:44px; height:44px; padding:0 10px; margin-left:auto; background:none; border:0; cursor:pointer; z-index:9002; } .aimee-2026 .aimee-burger span{ display:block; height:1.5px; width:100%; background:var(--aimee-accent,var(--aimee-gold-bright)); transition:transform .35s ease, opacity .25s ease; } .aimee-menu-open .aimee-burger span:nth-child(1){ transform:translateY(6.5px) rotate(45deg); } .aimee-menu-open .aimee-burger span:nth-child(2){ opacity:0; } .aimee-menu-open .aimee-burger span:nth-child(3){ transform:translateY(-6.5px) rotate(-45deg); } /* Full-screen panel */ .aimee-mobile-panel{ position:fixed; inset:0; z-index:9000; background:rgba(6,6,5,.98); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2rem; opacity:0; visibility:hidden; transform:translateY(-8px); transition:opacity .35s ease, transform .35s ease, visibility .35s; padding:5rem 1.5rem 3rem; } .aimee-menu-open .aimee-mobile-panel{ opacity:1; visibility:visible; transform:none; } .aimee-menu-open{ overflow:hidden; } .aimee-mobile-links{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; align-items:center; gap:1.6rem; width:100%; } .aimee-mobile-links li{ margin:0; } .aimee-mobile-links a{ font-family:var(--aimee-font-body); font-size:0.95rem; letter-spacing:.22em; text-transform:uppercase; font-weight:500; color:rgba(255,255,255,.9); text-decoration:none; transition:color .3s; } .aimee-mobile-links a:hover, .aimee-mobile-links .current-menu-item > a{ color:var(--aimee-accent,var(--aimee-gold-bright)); } .aimee-mobile-cta{ font-size:0.72rem; letter-spacing:0.22em; text-transform:uppercase; text-decoration:none; border:1px solid rgba(var(--aimee-accent-rgb,249,234,159),.6); color:var(--aimee-accent,var(--aimee-gold-bright)); padding:.9rem 2rem; box-shadow:0 0 18px 3px rgba(var(--aimee-accent-rgb,249,234,159),.18); } /* ==== SLIDE CLEARANCE ==================================================== Slides must start below the fixed header, and tall slides must scroll inside themselves on short screens rather than hiding content. ======================================================================== */ @media (max-width:1024px){ .aimee-2026 .aimee-slide, .aimee-deck .aimee-slide{ padding-top:6.5rem!important; padding-bottom:3.5rem!important; } .aimee-deck .aimee-slide{ align-items:flex-start; } .aimee-deck .aimee-slide__inner{ max-height:calc(100vh - 10rem); overflow-y:auto; -webkit-overflow-scrolling:touch; scrollbar-width:thin; } .aimee-deck .aimee-slide__inner::-webkit-scrollbar{ width:3px; } .aimee-deck .aimee-slide__inner::-webkit-scrollbar-thumb{ background:rgba(var(--aimee-accent-rgb,249,234,159),.35); } /* hero page titles need to breathe less on small screens */ .aimee-2026 .aimee-hero{ padding-top:8rem; } } @media (max-width:640px){ .aimee-2026 .aimee-slide, .aimee-deck .aimee-slide{ padding-top:6rem!important; } .aimee-deck .aimee-slide__inner{ max-height:calc(100vh - 9rem); } } /* ==== LAYER ORDER ======================================================= Source design stacks: nav 5000 > matrix curtain 4000 > slides. Ours had the nav at 500, so the transition curtain painted over the header. ======================================================================== */ .aimee-2026 .aimee-nav{ z-index:5000; } .aimee-2026 .aimee-burger{ z-index:5001; } /* ==== MOBILE CARD CAROUSELS ============================================= On phones the card grids stacked into very tall columns, forcing each slide to scroll internally — which pushed headings up under the fixed header and made slides feel endless. Card sets now become horizontal swipe carousels with scroll snapping: one slide, one screen. ======================================================================== */ @media (max-width:820px){ .aimee-2026 .aimee-minigrid, .aimee-2026 .aimee-cases, .aimee-2026 .aimee-loop, .aimee-2026 .aimee-video-grid{ display:flex !important; grid-template-columns:none !important; flex-direction:row !important; flex-wrap:nowrap !important; align-items:stretch; gap:.75rem; overflow-x:auto; overflow-y:hidden; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; scrollbar-width:none; margin-inline:-1.25rem; padding:.25rem 1.25rem .75rem; width:auto; } .aimee-2026 .aimee-minigrid::-webkit-scrollbar, .aimee-2026 .aimee-cases::-webkit-scrollbar, .aimee-2026 .aimee-loop::-webkit-scrollbar, .aimee-2026 .aimee-video-grid::-webkit-scrollbar{ display:none; } .aimee-2026 .aimee-minigrid > *, .aimee-2026 .aimee-cases > *, .aimee-2026 .aimee-loop > *, .aimee-2026 .aimee-video-grid > *, .aimee-2026 .aimee-loop-stage{ flex:0 0 82% !important; max-width:82% !important; min-width:0; scroll-snap-align:center; } .aimee-2026 .aimee-minicard{ padding:1.1rem 1.15rem; } .aimee-2026 .aimee-minicard p{ font-size:0.72rem; line-height:1.7; } .aimee-2026 .aimee-loop-stage{ padding:1rem .9rem; } .aimee-2026 .aimee-case__img{ aspect-ratio:16/9; } .aimee-2026 .aimee-case__body{ padding:1rem 1.1rem 1.2rem; } .aimee-2026 .aimee-case__h{ font-size:1.2rem; } .aimee-2026 .aimee-carousel-hint{ display:block; text-align:center; margin:.1rem 0 .2rem; font-size:.46rem; letter-spacing:.22em; text-transform:uppercase; color:rgba(255,255,255,.3); } .aimee-deck .aimee-slide__inner{ padding-bottom:3.25rem; } #aimee-sound{ bottom:.75rem; right:.75rem; font-size:.4rem; padding:.35rem .6rem; background:rgba(6,6,5,.75); backdrop-filter:blur(6px); } } @media (max-width:400px){ .aimee-2026 .aimee-minigrid > *, .aimee-2026 .aimee-cases > *, .aimee-2026 .aimee-loop > *, .aimee-2026 .aimee-video-grid > *, .aimee-2026 .aimee-loop-stage{ flex-basis:87% !important; max-width:87% !important; } } /* ==== CASE CARD COMPACTION (mobile) ===================================== Case cards carry a media area plus several label/value rows, so even as a carousel they overflowed the slide. Shorten the media and tighten the rows so a whole card fits one screen. ======================================================================== */ @media (max-width:820px){ .aimee-2026 .aimee-case__img{ aspect-ratio:auto; height:120px; } .aimee-2026 .aimee-case__img .ph{ font-size:.46rem; letter-spacing:.14em; } .aimee-2026 .aimee-case__body{ padding:.9rem 1rem 1rem; } .aimee-2026 .aimee-case__h{ font-size:1.05rem; margin-bottom:.6rem; line-height:1.15; } .aimee-2026 .aimee-case__meta{ font-size:.44rem; margin-bottom:.35rem; } .aimee-2026 .aimee-case__row{ font-size:0.72rem; line-height:1.5; margin-bottom:.3rem; gap:.5rem; } .aimee-2026 .aimee-case__row b{ font-size:.42rem; min-width:48px; } .aimee-2026 .aimee-case__status{ font-size:0.82rem; margin-top:.6rem; padding-top:.6rem; } .aimee-2026 .aimee-case__status small{ font-size:.4rem; } .aimee-2026 .aimee-slide__italic{ font-size:.82rem; line-height:1.75; margin-bottom:1rem; } .aimee-2026 .aimee-slide__body{ font-size:0.82rem; line-height:1.9; margin-bottom:1.2rem; } .aimee-2026 .aimee-slide__eyebrow{ margin-bottom:1rem; } .aimee-2026 .aimee-slide h2.aimee-slide__title{ margin-bottom:.6rem; } } /* ==== DENSE SLIDE TRIM (mobile) ========================================= Two slides still exceeded one screen: the case-study carousel and the six-point "Why Aimee" list. Trim their densest parts. ======================================================================== */ @media (max-width:820px){ .aimee-2026 .aimee-case__img{ height:92px; } .aimee-2026 .aimee-why li{ font-size:0.72rem; line-height:1.55; padding:.5rem 0; gap:.7rem; } .aimee-2026 .aimee-why li::before{ width:14px; margin-top:.5rem; } .aimee-2026 .aimee-why{ margin:1rem auto 1.4rem; } .aimee-2026 .aimee-btn-row{ margin-top:.5rem; } .aimee-2026 .aimee-btn-row .wp-block-button__link{ padding:.8rem 1.8rem; } } /* ==== CASE CARD MOBILE SUMMARY ========================================== On phones a case card shows only its media and title — enough to scan and swipe. The detail rows stay in the markup (and on desktop) but are hidden here so the slide's CTA is never pushed off screen. ======================================================================== */ @media (max-width:820px){ /* !important because aimee-home.css is enqueued after this file and sets display:flex on these at equal specificity. */ .aimee-2026 .aimee-case__row, .aimee-2026 .aimee-case__status{ display:none !important; } .aimee-2026 .aimee-case__img{ height:132px; } .aimee-2026 .aimee-case__body{ padding:.9rem 1rem 1.1rem; } .aimee-2026 .aimee-case__h{ margin-bottom:0; font-size:1.05rem; } .aimee-2026 .aimee-case__meta{ margin-bottom:.4rem; } } /* ==== CONTACT PAGE + SUREFORMS ========================================== Contact details column, and a skin for the SureForms fields so the form inherits the dark/gold system instead of the plugin's defaults. ======================================================================== */ .aimee-2026 .aimee-contact-cols{ text-align:left; align-items:flex-start; } .aimee-2026 .aimee-info-item{ margin-bottom:1.6rem; padding-bottom:1.6rem; border-bottom:1px solid rgba(255,255,255,.07); } .aimee-2026 .aimee-info-item:last-child{ border-bottom:none; } .aimee-2026 .aimee-info-label{ font-size:0.58rem; letter-spacing:0.3em; text-transform:uppercase; color:var(--aimee-gold); margin:0 0 .5rem; } .aimee-2026 .aimee-info-val{ font-size:0.82rem; color:rgba(255,255,255,.78); line-height:1.9; } .aimee-2026 .aimee-info-val a{ color:rgba(255,255,255,.78); text-decoration:none; transition:color .3s; } .aimee-2026 .aimee-info-val a:hover{ color:var(--aimee-gold); } .aimee-2026 .aimee-info-item:last-child .aimee-info-val{ display:flex; gap:.6rem; flex-wrap:wrap; } .aimee-2026 .aimee-info-item:last-child .aimee-info-val a{ font-size:0.58rem; letter-spacing:0.14em; text-transform:uppercase; border:1px solid rgba(255,255,255,.12); padding:.45rem .9rem; } .aimee-2026 .aimee-info-item:last-child .aimee-info-val a:hover{ border-color:var(--aimee-gold-dim); } /* SureForms skin */ .aimee-2026 .srfm-form-container, .aimee-2026 .srfm-form{ background:transparent!important; padding:0!important; } .aimee-2026 .srfm-form-container *{ font-family:var(--aimee-font-body)!important; } .aimee-2026 .srfm-input-common, .aimee-2026 .srfm-form input[type=text], .aimee-2026 .srfm-form input[type=email], .aimee-2026 .srfm-form input[type=tel], .aimee-2026 .srfm-form input[type=url], .aimee-2026 .srfm-form input[type=number], .aimee-2026 .srfm-form select, .aimee-2026 .srfm-form textarea{ background:rgba(255,255,255,.03)!important; border:1px solid rgba(255,255,255,.14)!important; border-radius:0!important; color:var(--aimee-text)!important; font-size:0.82rem!important; padding:.85rem 1.1rem!important; box-shadow:none!important; } .aimee-2026 .srfm-form input:focus, .aimee-2026 .srfm-form select:focus, .aimee-2026 .srfm-form textarea:focus{ border-color:var(--aimee-gold-dim)!important; outline:none!important; } .aimee-2026 .srfm-form input::placeholder, .aimee-2026 .srfm-form textarea::placeholder{ color:rgba(255,255,255,.35)!important; } .aimee-2026 .srfm-block-label, .aimee-2026 .srfm-form label{ color:rgba(255,255,255,.75)!important; font-size:0.58rem!important; letter-spacing:.22em!important; text-transform:uppercase!important; font-weight:500!important; margin-bottom:.5rem!important; } .aimee-2026 .srfm-form textarea{ min-height:130px!important; } .aimee-2026 .srfm-submit-button, .aimee-2026 .srfm-form button[type=submit], .aimee-2026 .srfm-button{ background:none!important; border:1px solid rgba(var(--aimee-gold-bright-rgb),.65)!important; color:var(--aimee-gold-bright)!important; border-radius:0!important; font-size:.58rem!important; letter-spacing:.3em!important; text-transform:uppercase!important; padding:1rem 2.4rem!important; width:100%!important; box-shadow:0 0 18px 3px rgba(var(--aimee-gold-bright-rgb),.18)!important; transition:all .4s!important; } .aimee-2026 .srfm-submit-button:hover, .aimee-2026 .srfm-form button[type=submit]:hover{ background:rgba(var(--aimee-gold-bright-rgb),.1)!important; border-color:var(--aimee-gold-bright)!important; color:var(--aimee-text)!important; } .aimee-2026 .srfm-success-box, .aimee-2026 .srfm-error-message{ color:var(--aimee-text)!important; } @media (max-width:820px){ .aimee-2026 .aimee-contact-cols{ gap:2rem; } .aimee-2026 .aimee-contact-cols > .wp-block-column{ flex-basis:100%!important; } } /* ==== CASE CARD LIBRARY ================================================= Case cards are used on the Work page as well as the homepage, so (like the other shared components) they must live here rather than in the home-only stylesheet. Same class of bug as the nav logo and button rows. ======================================================================== */ .aimee-2026 .aimee-cases{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem; margin:2rem 0 1.4rem; text-align:left; align-items:stretch; width:100%; } .aimee-2026 .aimee-case{ border:1px solid rgba(255,255,255,.08); background:rgba(255,255,255,.025); display:flex; flex-direction:column; overflow:hidden; transition:border-color .4s, transform .4s, box-shadow .4s; } .aimee-2026 .aimee-case__img{ aspect-ratio:16/10; background:#0d0d0c; position:relative; border-bottom:1px dashed rgba(255,255,255,.14); display:flex; align-items:center; justify-content:center; } .aimee-2026 .aimee-case__img img{ width:100%; height:100%; object-fit:cover; display:block; } .aimee-2026 .aimee-case__img .ph{ font-size:0.58rem; letter-spacing:0.14em; text-transform:uppercase; color:rgba(255,255,255,.28); text-align:center; padding:0 1rem; } .aimee-2026 .aimee-badge{ position:absolute; top:1rem; left:1rem; z-index:4; font-size:.44rem; letter-spacing:0.22em; text-transform:uppercase; color:var(--slide-accent,var(--aimee-gold)); background:rgba(6,6,5,.7); border:1px solid rgba(var(--slide-accent-rgb,var(--aimee-gold-rgb)),.45); padding:.35rem .7rem; backdrop-filter:blur(6px); } .aimee-2026 .aimee-tag{ position:absolute; top:1rem; right:1rem; z-index:4; font-size:.44rem; letter-spacing:0.22em; text-transform:uppercase; color:rgba(255,255,255,.75); background:rgba(6,6,5,.55); padding:.35rem .7rem; backdrop-filter:blur(6px); } .aimee-2026 .aimee-case__body{ padding:1.2rem 1.3rem 1.4rem; display:flex; flex-direction:column; flex:1; } .aimee-2026 .aimee-case__meta{ font-size:0.58rem; letter-spacing:.22em; text-transform:uppercase; color:var(--slide-accent,var(--aimee-gold)); margin-bottom:.5rem; } .aimee-2026 .aimee-case__h{ font-family:var(--aimee-font-display); font-size:1.2rem; font-weight:400; line-height:1.15; margin:0 0 .8rem; color:var(--aimee-text); } .aimee-2026 .aimee-case__row{ display:flex; gap:.7rem; font-size:.72rem; line-height:1.6; margin-bottom:.45rem; } .aimee-2026 .aimee-case__row b{ font-weight:500; font-size:.46rem; letter-spacing:0.22em; text-transform:uppercase; color:rgba(255,255,255,.42); min-width:58px; flex-shrink:0; padding-top:.2rem; } .aimee-2026 .aimee-case__row span{ color:rgba(255,255,255,.76); } .aimee-2026 .aimee-case__status{ font-family:var(--aimee-font-display); font-size:.95rem; color:var(--slide-accent,var(--aimee-gold)); margin-top:auto; padding-top:.8rem; border-top:1px solid rgba(255,255,255,.08); } .aimee-2026 .aimee-case__status small{ display:block; font-family:var(--aimee-font-body); font-size:.44rem; letter-spacing:0.14em; text-transform:uppercase; color:rgba(255,255,255,.45); margin-top:.25rem; } @media (max-width:1024px){ .aimee-2026 .aimee-cases{ grid-template-columns:repeat(2,1fr); } } /* ==== SERVICE PAGE COMPONENTS =========================================== Plans grid, FAQ accordion and checklist. Defined here (shared) with their mobile behaviour included up front, so inner pages don't repeat the trapped-CSS problem we hit with the nav logo, buttons and case cards. ======================================================================== */ /* --- Package / plan cards --- */ .aimee-2026 .aimee-plans{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem; margin:2.5rem 0; align-items:stretch; width:100%; text-align:left; } .aimee-2026 .aimee-plans.cols-2{ grid-template-columns:repeat(2,1fr); } .aimee-2026 .aimee-plans > *{ margin:0!important; } .aimee-2026 .aimee-plan{ background:var(--aimee-surface); border:1px solid rgba(var(--aimee-gold-rgb),.15); padding:2rem 1.8rem; display:flex; flex-direction:column; transition:border-color .4s, transform .4s, box-shadow .4s; } .aimee-2026 .aimee-plan:hover{ border-color:rgba(var(--aimee-gold-rgb),.45); transform:translateY(-4px); box-shadow:0 14px 34px -20px rgba(var(--aimee-gold-rgb),.45); } .aimee-2026 .aimee-plan--featured{ border-color:rgba(var(--aimee-gold-bright-rgb),.5); box-shadow:0 0 26px 2px rgba(var(--aimee-gold-bright-rgb),.12); } .aimee-2026 .aimee-plan__badge{ align-self:flex-start; font-size:.44rem; letter-spacing:.22em; text-transform:uppercase; color:var(--aimee-gold-bright); border:1px solid rgba(var(--aimee-gold-bright-rgb),.5); padding:.3rem .7rem; margin-bottom:.9rem; } .aimee-2026 .aimee-plan__name{ font-family:var(--aimee-font-display); font-size:1.5rem; font-weight:300; margin:0 0 .3rem; color:var(--aimee-text); } .aimee-2026 .aimee-plan__price{ font-family:var(--aimee-font-display); font-size:2.3rem; color:var(--aimee-gold); margin:.4rem 0 .1rem; line-height:1; } .aimee-2026 .aimee-plan__cycle{ font-size:0.58rem; letter-spacing:0.14em; text-transform:uppercase; color:var(--aimee-text-dim); margin:0 0 1.3rem; } .aimee-2026 .aimee-plan__features{ list-style:none; padding:0; margin:0 0 1.6rem; flex:1; } .aimee-2026 .aimee-plan__features li{ font-size:0.72rem; line-height:1.6; color:rgba(255,255,255,.78); padding:.5rem 0; border-bottom:1px solid rgba(255,255,255,.06); display:flex; gap:.7rem; align-items:flex-start; } .aimee-2026 .aimee-plan__features li::before{ content:''; width:12px; height:1px; background:var(--aimee-gold); flex-shrink:0; margin-top:.62rem; } .aimee-2026 .aimee-plan__note{ font-size:0.72rem; line-height:1.7; color:rgba(255,255,255,.6); border-left:1px solid rgba(var(--aimee-gold-rgb),.4); padding-left:.9rem; margin:1.4rem 0; } /* --- FAQ accordion (native details/summary — no JS needed) --- */ .aimee-2026 .aimee-faq{ margin:2rem 0; text-align:left; width:100%; } .aimee-2026 .aimee-faq details{ border-bottom:1px solid rgba(255,255,255,.08); padding:0; } .aimee-2026 .aimee-faq summary{ cursor:pointer; list-style:none; padding:1.1rem 2rem 1.1rem 0; position:relative; font-family:var(--aimee-font-display); font-size:1.05rem; font-weight:400; color:var(--aimee-text); transition:color .3s; } .aimee-2026 .aimee-faq summary::-webkit-details-marker{ display:none; } .aimee-2026 .aimee-faq summary::after{ content:'+'; position:absolute; right:.25rem; top:50%; transform:translateY(-50%); color:var(--aimee-gold); font-size:1.05rem; transition:transform .3s; } .aimee-2026 .aimee-faq details[open] summary::after{ content:'\2013'; } .aimee-2026 .aimee-faq summary:hover{ color:var(--aimee-gold); } .aimee-2026 .aimee-faq details p{ font-size:.82rem; line-height:1.95; color:rgba(255,255,255,.72); margin:0 0 1.1rem; padding-right:2rem; } /* --- Checklist ("what we review") --- */ .aimee-2026 .aimee-checklist{ list-style:none; padding:0; margin:1.5rem 0; width:100%; text-align:left; display:grid; grid-template-columns:repeat(2,1fr); gap:.1rem 1.6rem; } .aimee-2026 .aimee-checklist li{ font-size:0.82rem; line-height:1.6; color:rgba(255,255,255,.76); padding:.6rem 0; border-bottom:1px solid rgba(255,255,255,.06); display:flex; gap:.8rem; align-items:flex-start; } .aimee-2026 .aimee-checklist li::before{ content:''; width:14px; height:1px; background:var(--slide-accent,var(--aimee-gold)); flex-shrink:0; margin-top:.6rem; } /* --- Section intro helper --- */ .aimee-2026 .aimee-section-head{ text-align:center; margin:3.5rem 0 1.5rem; } /* --- Mobile: plans become a swipe carousel, checklist single column --- */ @media (max-width:820px){ .aimee-2026 .aimee-plans{ display:flex!important; grid-template-columns:none!important; flex-wrap:nowrap; gap:.75rem; overflow-x:auto; overflow-y:hidden; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; scrollbar-width:none; margin-inline:-1.25rem; padding:.25rem 1.25rem .75rem; width:auto; } .aimee-2026 .aimee-plans::-webkit-scrollbar{ display:none; } .aimee-2026 .aimee-plans > *{ flex:0 0 82%!important; max-width:82%!important; min-width:0; scroll-snap-align:center; } .aimee-2026 .aimee-plan{ padding:1.4rem 1.3rem; } .aimee-2026 .aimee-plan__price{ font-size:2rem; } .aimee-2026 .aimee-checklist{ grid-template-columns:1fr; } .aimee-2026 .aimee-faq summary{ font-size:0.95rem; padding-right:1.6rem; } } @media (max-width:1024px) and (min-width:821px){ .aimee-2026 .aimee-plans{ grid-template-columns:repeat(2,1fr); } } /* ==== THEMED HERO ACCENTS =============================================== Any hero carrying an accent class colours its eyebrow and title with that accent (previously only the green case was handled). Section headings on themed pages follow the same accent. ======================================================================== */ .aimee-2026 .aimee-hero.is-gold, .aimee-2026 .aimee-hero.is-cyan, .aimee-2026 .aimee-hero.is-green, .aimee-2026 .aimee-hero.is-fuchsia, .aimee-2026 .aimee-hero.is-purple, .aimee-2026 .aimee-hero.is-pink{ /* scope holder */ } .aimee-2026 .aimee-hero[class*="is-"] .aimee-page-title, .aimee-2026 .aimee-hero[class*="is-"] .aimee-eyebrow{ color:var(--slide-accent,var(--aimee-gold)); } .aimee-2026 .aimee-hero[class*="is-"] .aimee-eyebrow{ text-shadow:0 0 20px rgba(var(--slide-accent-rgb,var(--aimee-gold-rgb)),.35); } /* the primary CTA inside a themed hero adopts the accent too */ .aimee-2026 .aimee-hero[class*="is-"] .wp-block-button.aimee-btn--gold > .wp-block-button__link{ border-color:rgba(var(--slide-accent-rgb,var(--aimee-gold-bright-rgb)),.65); color:var(--slide-accent,var(--aimee-gold-bright)); box-shadow:0 0 18px 3px rgba(var(--slide-accent-rgb,var(--aimee-gold-bright-rgb)),.18), inset 0 0 12px rgba(var(--slide-accent-rgb,var(--aimee-gold-bright-rgb)),.06); } .aimee-2026 .aimee-hero[class*="is-"] .wp-block-button.aimee-btn--gold > .wp-block-button__link:hover{ background:rgba(var(--slide-accent-rgb,var(--aimee-gold-bright-rgb)),.1); border-color:var(--slide-accent,var(--aimee-gold-bright)); color:var(--aimee-text); } /* ==== PRICING JUMP NAV + TERMS ========================================== Anchor navigation rather than JS tabs: works on every template, is linkable and printable, and needs no script the page might not load. ======================================================================== */ .aimee-2026 .aimee-jumpnav{ display:flex; flex-wrap:wrap; gap:.5rem; justify-content:center; margin:2rem auto 1rem; width:100%; } .aimee-2026 .aimee-jumpnav a{ font-size:0.58rem; letter-spacing:0.22em; text-transform:uppercase; color:rgba(255,255,255,.7); text-decoration:none; border:1px solid rgba(255,255,255,.14); padding:.55rem 1.05rem; transition:all .3s; } .aimee-2026 .aimee-jumpnav a:hover{ border-color:rgba(var(--aimee-gold-rgb),.55); color:var(--aimee-gold); box-shadow:0 0 14px 1px rgba(var(--aimee-gold-rgb),.14); } /* anchored sections clear the fixed header when jumped to */ .aimee-2026 .aimee-anchor{ scroll-margin-top:110px; } /* Commercial terms list */ .aimee-2026 .aimee-terms{ list-style:none; padding:0; margin:1.5rem auto; max-width:760px; text-align:left; } .aimee-2026 .aimee-terms li{ font-size:0.82rem; line-height:1.75; color:rgba(255,255,255,.72); padding:.65rem 0; border-bottom:1px solid rgba(255,255,255,.06); display:flex; gap:.8rem; align-items:flex-start; } .aimee-2026 .aimee-terms li::before{ content:''; width:12px; height:1px; background:var(--aimee-gold); flex-shrink:0; margin-top:.62rem; } /* Flagship package band */ .aimee-2026 .aimee-flagship{ background:linear-gradient(180deg, rgba(var(--aimee-gold-rgb),.05), transparent); border:1px solid rgba(var(--aimee-gold-bright-rgb),.35); padding:2.5rem 2rem; margin:2.5rem 0; box-shadow:0 0 34px 2px rgba(var(--aimee-gold-bright-rgb),.10); } .aimee-2026 .aimee-flagship .aimee-plan__price{ font-size:2rem; } @media (max-width:820px){ .aimee-2026 .aimee-jumpnav{ gap:.4rem; } .aimee-2026 .aimee-jumpnav a{ font-size:.48rem; padding:.45rem .8rem; } .aimee-2026 .aimee-flagship{ padding:1.6rem 1.2rem; } .aimee-2026 .aimee-anchor{ scroll-margin-top:90px; } } /* ==== UNIFORM CARD ROWS ================================================= Grid rows size independently, so a card set that wraps to a second row produced two different card heights. Force equal rows. ======================================================================== */ @media (min-width:821px){ .aimee-2026 .aimee-plans, .aimee-2026 .aimee-minigrid, .aimee-2026 .aimee-cases, .aimee-2026 .aimee-cards, .aimee-2026 .aimee-video-grid{ grid-auto-rows:1fr; } } /* ==== LEGAL / PROSE PAGES =============================================== Long-form text (privacy, terms) rendered in the design system: readable measure, left-aligned, clear hierarchy. Content itself is unchanged. ======================================================================== */ .aimee-2026 .aimee-prose{ max-width:760px; margin-inline:auto; text-align:left; padding-bottom:4rem; } .aimee-2026 .aimee-prose h2, .aimee-2026 .aimee-prose h3{ font-family:var(--aimee-font-display); font-weight:300; color:var(--aimee-text); margin:2.4rem 0 .8rem; line-height:1.2; } .aimee-2026 .aimee-prose h2{ font-size:1.7rem; } .aimee-2026 .aimee-prose h3{ font-size:1.3rem; } .aimee-2026 .aimee-prose p{ font-size:0.82rem; line-height:2; color:rgba(255,255,255,.76); margin:0 0 1.1rem; } .aimee-2026 .aimee-prose strong{ color:var(--aimee-text); font-weight:500; } .aimee-2026 .aimee-prose a{ color:var(--aimee-gold); text-decoration:none; border-bottom:1px solid rgba(var(--aimee-gold-rgb),.35); } .aimee-2026 .aimee-prose a:hover{ color:var(--aimee-text); border-color:var(--aimee-text); } .aimee-2026 .aimee-prose ul, .aimee-2026 .aimee-prose ol{ margin:0 0 1.3rem; padding-left:1.1rem; } .aimee-2026 .aimee-prose li{ font-size:0.82rem; line-height:1.95; color:rgba(255,255,255,.76); margin-bottom:.5rem; } .aimee-2026 .aimee-prose li::marker{ color:var(--aimee-gold); } .aimee-2026 .aimee-prose hr{ border:0; height:1px; background:rgba(255,255,255,.08); margin:2.5rem 0; } .aimee-2026 .aimee-prose table{ width:100%; border-collapse:collapse; margin:0 0 1.5rem; } .aimee-2026 .aimee-prose td, .aimee-2026 .aimee-prose th{ border:1px solid rgba(255,255,255,.08); padding:.7rem .9rem; font-size:0.82rem; color:rgba(255,255,255,.76); text-align:left; } .aimee-2026 .aimee-prose .aimee-effective{ font-size:.58rem; letter-spacing:0.22em; text-transform:uppercase; color:var(--aimee-gold); margin-bottom:2rem; } @media (max-width:820px){ .aimee-2026 .aimee-prose h2{ font-size:1.4rem; } .aimee-2026 .aimee-prose{ padding-bottom:2.5rem; } } /* ==== SELECT OPTION LEGIBILITY ========================================== The select control inherits cream-on-dark, but the dropdown list is drawn by the browser/OS on a light surface — cream text there is unreadable. Style the options explicitly so the list matches the design where the platform allows it, and stays legible where it does not. ======================================================================== */ .aimee-2026 .srfm-form select option, .aimee-2026 [class*=srfm] select option{ background-color:#0d0d0c; color:#ffffff; font-size:0.95rem; padding:.5rem; } /* the placeholder option reads as secondary, not disabled */ .aimee-2026 .srfm-form select option[value=""], .aimee-2026 [class*=srfm] select option:disabled{ color:rgba(255,255,255,.55); } /* keep the closed control clearly readable */ .aimee-2026 .srfm-form select, .aimee-2026 [class*=srfm] select{ color:var(--aimee-text)!important; -webkit-appearance:none; appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='rgba(255,255,255,0.45)'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 1.1rem center; background-size:10px; padding-right:2.4rem!important; } /* ========================================================================== AIMEE 2026 — BLOG RESTYLE [BLOG-START] Applies to: blog index, category/tag/date/search archives, single posts. Scoped to those body classes only — static pages and the .aimee-2026 design pages are untouched. To revert: delete everything between [BLOG-START] and [BLOG-END]. ========================================================================== */ /* --- 1. Canvas ---------------------------------------------------------- */ body:is(.blog,.archive,.category,.tag,.search,.date,.single-post){ background:var(--aimee-bg); color:var(--aimee-text); font-family:var(--aimee-font-body); } body:is(.blog,.archive,.category,.tag,.search,.date,.single-post) .site-content, body:is(.blog,.archive,.category,.tag,.search,.date,.single-post) #primary, body:is(.blog,.archive,.category,.tag,.search,.date,.single-post) .ast-separate-container, body:is(.blog,.archive,.category,.tag,.search,.date,.single-post) .ast-separate-container .ast-article-post, body:is(.blog,.archive,.category,.tag,.search,.date,.single-post) .ast-separate-container .ast-article-single{ background:transparent; } body:is(.blog,.archive,.category,.tag,.search,.date) :is(.ast-archive-title,.page-title,.ast-archive-description h1){ font-family:var(--aimee-font-display); font-weight:300; font-size:clamp(2.4rem,5vw,3.6rem); line-height:1.1; letter-spacing:0.015em; color:var(--aimee-text); margin:0 0 .6rem; } body:is(.blog,.archive,.category,.tag,.search,.date) .ast-archive-description{ background:transparent; border:0; padding:3.5rem 0 2rem; max-width:var(--aimee-container); margin-inline:auto; } body:is(.blog,.archive,.category,.tag,.search,.date) .ast-archive-description p{ color:var(--aimee-text-dim); font-size:0.95rem; line-height:1.7; max-width:60ch; } /* --- 2. Archive: card grid --------------------------------------------- */ body:is(.blog,.archive,.category,.tag,.search,.date) .site-main .ast-row{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:2rem; margin:0; padding:0; } body:is(.blog,.archive,.category,.tag,.search,.date) .site-main .ast-row > *{ margin:0!important; padding:0!important; width:auto!important; max-width:none!important; float:none!important; } body:is(.blog,.archive,.category,.tag,.search,.date) .site-main article.post{ background:var(--aimee-surface); border:1px solid rgba(var(--aimee-gold-rgb),.16); border-radius:12px; overflow:hidden; box-shadow:none; transition:transform .35s cubic-bezier(.2,.7,.3,1), border-color .35s ease, box-shadow .35s ease; } body:is(.blog,.archive,.category,.tag,.search,.date) .site-main article.post:hover{ transform:translateY(-6px); border-color:rgba(var(--aimee-gold-rgb),.45); box-shadow:0 18px 42px -18px rgba(var(--aimee-gold-bright-rgb),.5); } body:is(.blog,.archive,.category,.tag,.search,.date) .ast-article-inner{ display:flex!important; flex-direction:column; height:100%; background:transparent; border:0; padding:0; } body:is(.blog,.archive,.category,.tag,.search,.date) .ast-blog-featured-section{ width:100%!important; max-width:none!important; flex:0 0 auto; margin:0!important; padding:0!important; } body:is(.blog,.archive,.category,.tag,.search,.date) .post-thumb-img-content, body:is(.blog,.archive,.category,.tag,.search,.date) .post-thumb-img-content a{ display:block; margin:0; line-height:0; overflow:hidden; } body:is(.blog,.archive,.category,.tag,.search,.date) .post-thumb-img-content img{ width:100%; aspect-ratio:16/10; object-fit:cover; display:block; border-radius:0; transition:transform .6s cubic-bezier(.2,.7,.3,1); } body:is(.blog,.archive,.category,.tag,.search,.date) article.post:hover .post-thumb-img-content img{ transform:scale(1.045); } body:is(.blog,.archive,.category,.tag,.search,.date) .post-content{ width:100%!important; max-width:none!important; flex:1 1 auto; display:flex; flex-direction:column; gap:.85rem; padding:1.5rem 1.6rem 1.7rem!important; } body:is(.blog,.archive,.category,.tag,.search,.date) .entry-title{ font-family:var(--aimee-font-display); font-size:1.5rem; line-height:1.22; font-weight:400; letter-spacing:.005em; margin:0; } body:is(.blog,.archive,.category,.tag,.search,.date) .entry-title a{ color:var(--aimee-text); text-decoration:none; transition:color .3s ease; } body:is(.blog,.archive,.category,.tag,.search,.date) .entry-title a:hover{ color:var(--aimee-gold); } body:is(.blog,.archive,.category,.tag,.search,.date) .ast-excerpt-container p{ color:var(--aimee-text-dim); font-size:0.95rem; line-height:1.75; margin:0; } body:is(.blog,.archive,.category,.tag,.search,.date) .ast-read-more-container{ padding-top:.9rem; margin:auto 0 0!important; border-top:1px solid rgba(var(--aimee-gold-rgb),.14); } body:is(.blog,.archive,.category,.tag,.search,.date) .ast-read-more-container a{ color:var(--aimee-gold); font-size:.72rem; font-weight:500; letter-spacing:0.14em; text-transform:uppercase; text-decoration:none; display:inline-flex; align-items:center; gap:.5rem; transition:gap .3s ease,color .3s ease; } body:is(.blog,.archive,.category,.tag,.search,.date) .ast-read-more-container a::after{ content:"\2192"; font-size:0.95rem; letter-spacing:0; } body:is(.blog,.archive,.category,.tag,.search,.date) .ast-read-more-container a:hover{ color:var(--aimee-gold-bright); gap:.85rem; } /* --- 3. Pagination ------------------------------------------------------ */ body:is(.blog,.archive,.category,.tag,.search,.date) .ast-pagination{ margin:3.5rem 0 4.5rem; padding:0; } body:is(.blog,.archive,.category,.tag,.search,.date) .ast-pagination .nav-links{ display:flex; flex-wrap:wrap; justify-content:center; gap:.5rem; } body:is(.blog,.archive,.category,.tag,.search,.date) .ast-pagination .page-numbers{ min-width:2.6rem; height:2.6rem; padding:0 .8rem; display:inline-flex; align-items:center; justify-content:center; border:1px solid rgba(var(--aimee-gold-rgb),.28); border-radius:999px; background:transparent!important; color:var(--aimee-text-dim)!important; font-size:0.82rem; letter-spacing:0.06em; text-decoration:none; transition:all .3s ease; } body:is(.blog,.archive,.category,.tag,.search,.date) .ast-pagination a.page-numbers:hover{ border-color:rgba(var(--aimee-gold-rgb),.7); color:var(--aimee-text)!important; background:rgba(var(--aimee-gold-rgb),.08)!important; } body:is(.blog,.archive,.category,.tag,.search,.date) .ast-pagination .page-numbers.current{ background:var(--aimee-gold)!important; border-color:var(--aimee-gold); color:#080807!important; font-weight:600; } body:is(.blog,.archive,.category,.tag,.search,.date) .ast-pagination .page-numbers.dots{ border-color:transparent; } /* --- 4. Single post ----------------------------------------------------- */ body.single-post .entry-header{ padding:0 0 1.6rem; margin-bottom:2rem; border-bottom:1px solid rgba(var(--aimee-gold-rgb),.18); } body.single-post .entry-title{ font-family:var(--aimee-font-display); font-weight:300; font-size:clamp(2.1rem,4.4vw,3.3rem); line-height:1.14; letter-spacing:.005em; color:var(--aimee-text); margin:0 0 1rem; } body.single-post .entry-meta, body.single-post .entry-meta *{ color:var(--aimee-text-faint)!important; font-size:0.72rem!important; letter-spacing:.14em; text-transform:uppercase; font-weight:400; } body.single-post .entry-meta a:hover{ color:var(--aimee-gold)!important; } body.single-post .post-thumb img, body.single-post .ast-single-post-featured-section img{ width:100%; border-radius:12px; border:1px solid rgba(var(--aimee-gold-rgb),.16); } body.single-post .entry-content{ font-size:1.05rem; line-height:1.85; color:rgba(255,255,255,.93); } body.single-post .entry-content > * + *{ margin-top:1.35rem; } body.single-post .entry-content p{ margin:0; } body.single-post .entry-content :is(h2,h3,h4), body.single-post .entry-content .uagb-heading-text{ font-family:var(--aimee-font-display)!important; font-weight:400!important; color:var(--aimee-text)!important; line-height:1.22!important; letter-spacing:.005em; } body.single-post .entry-content h2, body.single-post .entry-content h2.uagb-heading-text{ font-size:clamp(1.7rem,3.2vw,2.3rem)!important; margin-top:2.8rem!important; margin-bottom:.2rem!important; } body.single-post .entry-content h3{ font-size:1.5rem!important; margin-top:2.2rem!important; } body.single-post .entry-content h4{ font-size:1.2rem!important; } body.single-post .entry-content .wp-block-uagb-advanced-heading{ margin-bottom:0!important; } body.single-post .entry-content .uagb-desc-text{ color:var(--aimee-text-dim)!important; } body.single-post .entry-content a{ color:var(--aimee-gold); text-decoration:none; border-bottom:1px solid rgba(var(--aimee-gold-rgb),.4); transition:border-color .3s ease,color .3s ease; } body.single-post .entry-content a:hover{ color:var(--aimee-gold-bright); border-bottom-color:var(--aimee-gold-bright); } body.single-post .entry-content :is(ul,ol){ padding-left:1.3rem; display:flex; flex-direction:column; gap:.6rem; } body.single-post .entry-content li{ line-height:1.8; } body.single-post .entry-content li::marker{ color:var(--aimee-gold); } body.single-post .entry-content strong{ color:var(--aimee-text); font-weight:600; } body.single-post .entry-content blockquote{ margin:2.2rem 0; padding:1.4rem 1.6rem; border-left:2px solid var(--aimee-gold); background:rgba(var(--aimee-gold-rgb),.05); border-radius:0 10px 10px 0; font-family:var(--aimee-font-display); font-size:1.3rem; font-style:italic; line-height:1.5; color:var(--aimee-text); } body.single-post .entry-content blockquote p{ margin:0; } body.single-post .entry-content :is(img,figure img){ border-radius:12px; } body.single-post .entry-content figcaption{ color:var(--aimee-text-faint); font-size:0.82rem; text-align:center; margin-top:.6rem; } body.single-post .entry-content hr{ border:0; height:1px; background:rgba(var(--aimee-gold-rgb),.2); margin:2.8rem 0; } body.single-post .entry-content table{ width:100%; border-collapse:collapse; font-size:0.95rem; } body.single-post .entry-content :is(th,td){ border:1px solid rgba(var(--aimee-gold-rgb),.18); padding:.7rem .9rem; text-align:left; } body.single-post .entry-content th{ background:rgba(var(--aimee-gold-rgb),.08); color:var(--aimee-text); font-weight:600; } body.single-post .post-navigation a{ color:var(--aimee-text-dim); text-decoration:none; transition:color .3s ease; } body.single-post .post-navigation a:hover{ color:var(--aimee-gold); } /* --- 5. Sidebar widgets ------------------------------------------------- */ body:is(.blog,.archive,.category,.tag,.search,.date,.single-post) .widget-area .widget{ background:var(--aimee-surface); border:1px solid rgba(var(--aimee-gold-rgb),.14); border-radius:12px; padding:1.4rem 1.5rem; margin-bottom:1.6rem; } body:is(.blog,.archive,.category,.tag,.search,.date,.single-post) .widget-area :is(.widget-title,.wp-block-heading){ font-family:var(--aimee-font-display); font-weight:400; font-size:1.2rem; color:var(--aimee-text); margin:0 0 .9rem; padding-bottom:.6rem; border-bottom:1px solid rgba(var(--aimee-gold-rgb),.18); } body:is(.blog,.archive,.category,.tag,.search,.date,.single-post) .widget-area li{ list-style:none; margin:0; padding:.45rem 0; border-bottom:1px solid rgba(255,255,255,.07); } body:is(.blog,.archive,.category,.tag,.search,.date,.single-post) .widget-area li:last-child{ border-bottom:0; } body:is(.blog,.archive,.category,.tag,.search,.date,.single-post) .widget-area :is(ul,ol){ padding-left:0; margin:0; } body:is(.blog,.archive,.category,.tag,.search,.date,.single-post) .widget-area a{ color:var(--aimee-text-dim); text-decoration:none; font-size:0.95rem; line-height:1.5; transition:color .3s ease; } body:is(.blog,.archive,.category,.tag,.search,.date,.single-post) .widget-area a:hover{ color:var(--aimee-gold); } /* --- 6. Responsive ------------------------------------------------------ */ @media (max-width:900px){ body:is(.blog,.archive,.category,.tag,.search,.date) .site-main .ast-row{ grid-template-columns:1fr; gap:1.6rem; } body:is(.blog,.archive,.category,.tag,.search,.date) .entry-title{ font-size:1.4rem; } body:is(.blog,.archive,.category,.tag,.search,.date) .ast-archive-description{ padding:2.5rem 0 1.5rem; } } @media (max-width:600px){ body:is(.blog,.archive,.category,.tag,.search,.date) .post-content{ padding:1.25rem 1.25rem 1.4rem!important; } body:is(.blog,.archive,.category,.tag,.search,.date) .post-thumb-img-content img{ aspect-ratio:16/9; } body.single-post .entry-content{ font-size:0.95rem; } } /* --- 7. Native