/* Inner pages share one rotating starfield; homepage artwork stays in style.css. */
:root { scroll-padding-top: 110px; }
:focus-visible { outline: 3px solid #6ee7b7; outline-offset: 5px; }
.has-dropdown:focus-within .dropdown { opacity: 1; visibility: visible; pointer-events: auto; }
@media (min-width: 1201px) {
    .has-dropdown::after { content: ''; position: absolute; top: 100%; left: 0; width: 100%; height: 22px; }
}
/* Dedicated variables avoid legacy nested .dark-mode classes fixing the palette. */
body.inner-page {
    --inner-panel: rgba(255, 255, 255, .94);
    --inner-panel-text: #17211d;
    --inner-panel-muted: #35433c;
    --inner-border: #7d9286;
    --inner-field: #fff;
    --inner-placeholder: #53685d;
    --inner-hover: #e9eeeb;
    --inner-link: #096140;
    --inner-selected: #e4efe8;
    position: relative;
    isolation: isolate;
    background: #030403;
    color: var(--text-primary);
}
body.inner-page.dark-mode {
    --inner-panel: rgba(8, 10, 12, .86);
    --inner-panel-text: #f3f5f4;
    --inner-panel-muted: #d0d6d3;
    --inner-border: #65746c;
    --inner-field: rgba(0, 0, 0, .7);
    --inner-placeholder: #aebdb5;
    --inner-hover: #252b28;
    --inner-link: #8debc1;
    --inner-selected: #202a25;
}
/* Fixed page-level background: the same image and 240-second full rotation as home. */
body.inner-page::before {
    content: '';
    position: fixed;
    top: 50%;
    left: 50%;
    width: 220vmax;
    height: 220vmax;
    background: url('/assets/images/galaxy-background.webp') center / contain;
    transform: translate(-50%, -50%);
    transform-origin: center;
    animation: page-stars-rotate 240s linear infinite;
    pointer-events: none;
    z-index: -1;
}
@keyframes page-stars-rotate {
    from { transform: translate(-50%, -50%) rotate(0deg); }
    to { transform: translate(-50%, -50%) rotate(360deg); }
}
body.inner-page main,
body.inner-page.dark-mode main,
body.inner-page main > section,
body.inner-page.dark-mode main > section { background: transparent !important; color: #f3f5f4; }
body.inner-page main::before,
body.inner-page main::after,
body.inner-page .hero::before,
body.inner-page .hero::after { content: none !important; animation: none !important; }
body.inner-page .hero {
    min-height: 620px !important;
    padding: 190px 0 100px;
    color: #fff;
}
body.inner-page .hero > * { position: relative; z-index: 1; }
body.inner-page main .container,
body.inner-page.dark-mode main .container { background: transparent; overflow: visible; padding: 0 24px; border-radius: 0; }
body.inner-page .hero-inner { margin: 0 auto; }
body.inner-page .hero h1 { color: #fff; font-size: clamp(2.05rem, 4.2vw, 3.65rem); line-height: 1.2; }
body.inner-page .hero .eyebrow {
    display: inline-block;
    color: #6ee7b7;
    background: none;
    -webkit-text-fill-color: currentColor;
    font-size: clamp(.82rem, 1.4vw, 1.1rem);
    letter-spacing: .12em;
    line-height: 1.65;
}
body.inner-page .hero-sub,
body.inner-page.dark-mode .hero-sub { color: #e4e9e6; filter: none; max-width: 780px; font-size: 1.15rem; }
body.inner-page .hero h1,
body.inner-page .hero-sub,
body.inner-page .hero-actions,
body.inner-page .eyebrow { animation: fadeInUp .5s ease-out both; }
body.inner-page main > section:not(.hero) { min-height: 0; padding: 76px 0; }
body.inner-page .section-heading-box,
body.inner-page.dark-mode .section-heading-box {
    position: static; display: block; transform: none; margin: 0 auto 24px; padding: 0;
    background: transparent; border: 0; box-shadow: none; text-align: center;
}
body.inner-page .section-heading-box h2 { position: relative; left: auto; top: auto; width: auto; margin: 0; transform: none; color: #f3f5f4; font-size: clamp(1.65rem, 3vw, 2.3rem); line-height: 1.35; }
body.inner-page main :is(h2,h3,h4,h5) { color: #f3f5f4; }
body.inner-page main :is(p,li),
body.inner-page main .section-intro,
body.inner-page.dark-mode main .section-intro { color: #e0e6e2; filter: none; }
body.inner-page .section-intro { max-width: 850px; margin: 0 auto 36px; font-size: 1.1rem; font-weight: 400; line-height: 1.75; }
body.inner-page .grid,
body.inner-page .threegrid { gap: 24px; align-items: stretch; }
/* Neutral translucent surfaces provide readable light and dark themes over the stars. */
body.inner-page :is(.card,.twocard,.icon-card,.case-card,.case-study,.styled-form) {
    --text-primary: var(--inner-panel-text);
    --text-secondary: var(--inner-panel-muted);
    background: var(--inner-panel) !important;
    color: var(--inner-panel-text);
    border: 1px solid var(--inner-border);
    box-shadow: 0 10px 26px rgba(0,0,0,.2);
    backdrop-filter: blur(3px);
}
body.inner-page :is(.card,.twocard,.icon-card,.case-card,.case-study,.styled-form) :is(h2,h3,h4,h5,label,legend) { color: var(--inner-panel-text); }
body.inner-page :is(.card,.twocard,.icon-card,.case-card,.case-study,.styled-form) :is(p,li,span) { color: var(--inner-panel-muted); }
body.inner-page :is(.card,.twocard,.icon-card) { padding: 28px; }
body.inner-page :is(.card,.icon-card,.case-card):hover { transform: translateY(-3px); box-shadow: 0 12px 28px rgba(0,0,0,.25); }
body.inner-page .card p { padding: 0; margin: 16px 0; }
body.inner-page .card ul { padding-left: 1.2rem; margin: 16px 0 24px; }
body.inner-page .card li { margin: 9px 0; }
body.inner-page .card .bottom { position: static; display: inline-block; margin-top: 20px; }
body.inner-page :is(.text-link,.card-link,.brand-link),
body.inner-page .contact-details a { color: #8debc1; }
body.inner-page :is(.card,.case-card,.case-study) :is(.text-link,.card-link,.brand-link) { color: var(--inner-link); }
body.inner-page :is(.btn-primary,.styled-form button) { background: #6ee7b7; color: #062417; border: 2px solid #6ee7b7; box-shadow: none; }
body.inner-page .btn-primary span { color: #062417; }
body.inner-page .btn-primary::before,
body.inner-page .btn-secondary::before { display: none; }
body.inner-page :is(.btn-primary,.styled-form button):hover { background: #a7f3d0 !important; border-color: #a7f3d0; color: #062417; transform: translateY(-2px); }
body.inner-page .btn-secondary { color: #f3f5f4; background: rgba(0,0,0,.45); border: 2px solid #899d91; }
body.inner-page .btn-secondary span { color: #f3f5f4; }
body.inner-page .btn-secondary:hover { background: rgba(255,255,255,.12) !important; }
body.inner-page .seo-case-table th { background: var(--inner-hover); color: var(--inner-panel-text); }
body.inner-page .seo-case-table td { background: var(--inner-panel); color: var(--inner-panel-muted); border-color: var(--inner-border); }
/* Header, footer, navigation and theme icon deliberately use the shared homepage rules in style.css. */
body.inner-page .styled-form { max-width: 850px; margin: 28px auto; }
body.inner-page .styled-form fieldset { min-width: 0; border: 0; padding: 0; margin-bottom: 28px; }
body.inner-page .styled-form legend { font-weight: 700; font-size: 1.12rem; margin-bottom: 12px; }
body.inner-page .styled-form :is(input,textarea,select) { background: var(--inner-field); border: 1px solid var(--inner-border); border-radius: 7px; color: var(--inner-panel-text); min-height: 46px; font: inherit; }
body.inner-page .styled-form input::placeholder,
body.inner-page .styled-form textarea::placeholder { color: var(--inner-placeholder); opacity: 1; }
body.inner-page .service-options { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; }
body.inner-page .service-options label { flex-direction: row; align-items: flex-start; gap: 12px; margin: 0; font-weight: 400; border-color: var(--inner-border); }
body.inner-page .service-options label:hover,
body.inner-page .service-options label:has(input:checked) { background: var(--inner-selected); border-color: var(--inner-link); }
body.inner-page .service-options input[type="checkbox"] { flex: 0 0 18px; min-height: 18px; width: 18px; height: 18px; margin: 3px 0 0; accent-color: #08744c; }
body.inner-page.dark-mode .service-options input[type="checkbox"] { accent-color: #6ee7b7; }
body.inner-page .service-options input:checked + span { color: var(--inner-link); }
body.inner-page .form-error { background: #35191b; border: 1px solid #fda4af; color: #ffe4e6; padding: 18px; border-radius: 8px; margin-bottom: 24px; }
body.inner-page .form-error :is(p,li,h3) { color: #ffe4e6; }
body.inner-page .form-notice { background: var(--inner-hover); color: var(--inner-panel-text); padding: 18px; border: 1px solid var(--inner-border); border-radius: 8px; margin: 20px 0; }
body.inner-page .styled-form button:disabled { opacity: .7; cursor: wait; transform: none; }
body.inner-page .contact-details { color: #e0e6e2; }
body.inner-page .service-scope-note { max-width: 860px; margin: 30px auto; text-align: center; line-height: 1.75; }
body.inner-page .form-note { font-size: .94rem; margin: 10px 0 18px; }
body.inner-page .service-description { font-size: .92rem; }
/* Home subtitles follow their section's theme, not the legacy mobile colors.
   The light portfolio gradient needs a pale base after its image ends; otherwise
   the main starfield shows through and the same text crosses dark and light areas. */
body.home-page:not(.dark-mode) .section.portfolio { background-color: #f8fafc; }
body.home-page .section.portfolio .section-intro {
    color: var(--text-secondary);
    filter: none;
}
body.home-page .portfolio-group > h4 { color: #096140; }
body.home-page.dark-mode .portfolio-group > h4 { color: #8debc1; }
body.home-page.dark-mode .about-block :is(h2,h3,p) {
    color: var(--text-secondary) !important;
    filter: none;
}
body.home-page.dark-mode .about-block h2 { color: var(--text-primary) !important; }
/* The enquiry's dark theme keeps the same stars behind the form and footer.
   Only the individual controls retain neutral backings for dependable contrast. */
body.inner-page main.contact > section { background: transparent !important; }
body.inner-page.dark-mode main.contact .styled-form {
    background: transparent !important;
    box-shadow: none;
    backdrop-filter: none;
}
body.inner-page.dark-mode main.contact .service-options label {
    background: rgba(0, 0, 0, .7);
}
body.inner-page.dark-mode main.contact .service-options label:is(:hover,:has(input:checked)) {
    background: rgba(20, 38, 29, .88);
}
body.inner-page.dark-mode main.contact ~ .site-footer { background: transparent; }
@media (max-width: 1200px) {
    body.inner-page .hero { padding: 150px 0 75px; min-height: 530px !important; }
    body.inner-page .breadcrumb-nav { margin-top: 72px; }
    body.inner-page .grid,
    body.inner-page .threegrid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px; }
}
@media (max-width: 600px) {
    body.inner-page .hero { padding: 142px 0 65px; min-height: 0 !important; }
    body.inner-page main .container,
    body.inner-page.dark-mode main .container { width: 100%; padding: 0 20px; }
    body.inner-page .hero-sub { font-size: 1.03rem; margin-bottom: 30px; }
    body.inner-page main > section:not(.hero) { padding: 52px 0; }
    body.inner-page .grid,
    body.inner-page .threegrid,
    body.inner-page .service-options { grid-template-columns: minmax(0,1fr); }
    body.inner-page :is(.card,.twocard,.icon-card,.styled-form) { padding: 22px; }
    body.inner-page .hero-actions { gap: 14px; }
    body.inner-page .seo-case-table { display: block; overflow-x: auto; max-width: 100%; }
    body.inner-page .breadcrumb { max-width: calc(100vw - 36px); border-radius: 12px; }
    /* Existing home fix retained unchanged. */
    .home-page .home-hero { padding-top: calc(100px + 22vh); }
}
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto !important; }
    *, *::before, *::after { animation: none !important; transition: none !important; }
    html body .hero::before,
    html body .hero::after,
    html body .home-hero::before,
    html body.inner-page .hero::before,
    html body.inner-page::before { animation: none !important; }
}