/*
 * Franscella Theme - custom CSS
 * Tutto qui sotto è override mirato. theme.json copre 90% dello styling.
 */

:root {
    --franscella-red: #d30848;
    --franscella-red-dark: #a8063a;
    --franscella-black: #0f0f0f;
    --franscella-grey-dark: #2a2a2a;
    --franscella-grey: #6b6b6b;
    --franscella-grey-light: #f4f3f2;
    --franscella-white: #ffffff;
    --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
}

html { scroll-behavior: smooth; }
body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

/* Header sticky con blur */
.site-header {
    position: sticky;
    top: 0;
    z-index: 100;
    backdrop-filter: saturate(180%) blur(12px);
    background: rgba(255,255,255,0.92) !important;
    border-bottom: 1px solid rgba(15,15,15,0.06);
    transition: background 0.3s var(--ease-out);
}
.site-header .main-nav a {
    transition: color 0.2s var(--ease-out);
    text-decoration: none;
}
.site-header .main-nav a:hover { color: var(--franscella-red); }

/* Hero polish */
.hero-franscella {
    overflow: hidden;
}
.hero-franscella .hero-title {
    font-feature-settings: 'ss01';
}
.hero-franscella .wp-block-cover__image-background {
    transform: scale(1.05);
    transition: transform 8s var(--ease-out);
}
.hero-franscella:hover .wp-block-cover__image-background {
    transform: scale(1.0);
}

/* Accent line - linea rossa standard */
.hero-accent,
.accent-line {
    width: 100px !important;
    height: 4px !important;
    border: 0 !important;
    margin-left: 0 !important;
    background: var(--franscella-red) !important;
}

/* Stat bar columns separator */
.stat-bar .wp-block-columns { gap: 0 !important; }
.stat-bar .stat-cell {
    border-right: 1px solid rgba(255,255,255,0.12);
    padding: 1.5rem 1rem;
    flex: 1;
}
.stat-bar .stat-cell:last-child { border-right: 0; }
@media (max-width: 768px) {
    .stat-bar .stat-cell { border-right: 0; border-bottom: 1px solid rgba(255,255,255,0.12); }
    .stat-bar .stat-cell:last-child { border-bottom: 0; }
}

/* Service card hover */
.servizio-card {
    cursor: pointer;
    overflow: hidden;
    transition: transform 0.5s var(--ease-out);
}
.servizio-card .wp-block-cover__image-background {
    transition: transform 0.8s var(--ease-out), filter 0.4s ease;
    filter: grayscale(0%);
}
.servizio-card:hover {
    transform: translateY(-4px);
}
.servizio-card:hover .wp-block-cover__image-background {
    transform: scale(1.08);
    filter: grayscale(0%);
}
.servizio-card .servizio-eyebrow {
    transform: translateY(8px);
    opacity: 0.85;
    transition: all 0.4s var(--ease-out);
}
.servizio-card:hover .servizio-eyebrow {
    transform: translateY(0);
    opacity: 1;
}
.servizio-card a {
    color: inherit !important;
    text-decoration: none !important;
}
.servizio-card a::after {
    content: " →";
    opacity: 0;
    margin-left: 0;
    transition: all 0.3s var(--ease-out);
}
.servizio-card:hover a::after {
    opacity: 1;
    margin-left: 0.5rem;
}

/* News card */
.news-card {
    transition: transform 0.4s var(--ease-out), box-shadow 0.4s ease;
}
.news-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 20px 40px -20px rgba(15,15,15,0.15);
}
.news-card .wp-block-post-featured-image img {
    transition: transform 0.6s var(--ease-out);
}
.news-card:hover .wp-block-post-featured-image img {
    transform: scale(1.04);
}

/* Process step card */
.step-card {
    transition: transform 0.3s var(--ease-out), border-color 0.3s ease;
}
.step-card:hover {
    transform: translateY(-3px);
}

/* Progetto archive card */
.progetto-card .wp-block-post-featured-image {
    overflow: hidden;
}
.progetto-card .wp-block-post-featured-image img {
    transition: transform 0.7s var(--ease-out);
}
.progetto-card:hover .wp-block-post-featured-image img {
    transform: scale(1.05);
}
.progetto-card .wp-block-post-title a {
    text-decoration: none;
    transition: color 0.2s ease;
}
.progetto-card .wp-block-post-title a:hover {
    color: var(--franscella-red);
}

/* CTA Finale - pattern bg */
.cta-final {
    background-image: url('https://franscella-sa.ch/wp-content/uploads/2022/05/sfondo-progetto2.png');
    background-blend-mode: overlay;
    background-position: center;
    background-repeat: no-repeat;
}

/* Quote parallax */
.quote-parallax h2 {
    quotes: "\201C" "\201D";
}

/* Buttons - hover smooth */
.wp-block-button .wp-element-button {
    transition: all 0.25s var(--ease-out);
    will-change: background-color, color, transform;
}
.wp-block-button.is-style-outline .wp-element-button:hover {
    transform: translateY(-2px);
}

/* Outline button (header CTA, hero secondary) */
.wp-block-button.is-style-outline .wp-element-button {
    background: transparent !important;
}

/* Links inside paragraphs - underline accent */
main a:not(.wp-block-button__link):not(.wp-block-post-title a):not(.servizio-card a):not(.news-card a) {
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 4px;
    text-decoration-color: var(--franscella-red);
    transition: text-decoration-color 0.2s;
}
main a:not(.wp-block-button__link):hover {
    text-decoration-color: var(--franscella-black);
}

/* Selection */
::selection {
    background: var(--franscella-red);
    color: var(--franscella-white);
}

/* Focus accessibility */
:focus-visible {
    outline: 2px solid var(--franscella-red);
    outline-offset: 3px;
}

/* Responsive tweaks */
@media (max-width: 768px) {
    .hero-franscella { min-height: 85vh !important; }
    .servizi-grid { grid-template-columns: repeat(2, 1fr) !important; }
}

@media (max-width: 480px) {
    .servizi-grid { grid-template-columns: 1fr !important; }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}
