/* * Corporate One — INDUSTRIAL / ENGINEERING (Phase 37 real visual theme). * * Target sectors: bearings, gearboxes, machinery, automation, manufacturing, * heavy industry, engineering, industrial equipment. Character: bold, * technical, high-contrast, controlled grid, restrained motion. * * Loaded LAST in the cascade (`frontend.css` → the Phase 36 token bridge → * this file — see `resources/views/frontend/layouts/app.blade.php`), so * every rule here only needs to be as specific as the shared shell rule it * restyles. Every selector is scoped under `.cms-theme-corporate01` (the * class `frontend.layouts.app` already puts on ``) — this file is only * ever served/loaded when corporate01 is the active theme, but the scope is * kept anyway as defence in depth (Phase 37 §16: a theme must never be able * to leak into another theme or the admin shell). No generic bare-element * selectors (`div`, `a`, `button`, `body *`) — only the CMS's own * `.cms-fe-*` / `.cms-module-*` design-system classes are ever targeted, so * this file can never collide with anything Core, Admin, or another theme * owns. The `ProductCard`/`ServiceCard`/etc. DATA contracts are completely * untouched — this is presentation only. */ /* Colour / radius / shadow token VALUES come from this theme's own `manifest.php` `design_tokens`, applied via the Phase 36 `ThemeDesignTokenBridge` (`/themes/corporate01/tokens.css`, loaded just before this file) — never redeclared here, so there is exactly one place that owns each token's value. */ /* ------------------------------------------------------------------ */ /* Typography — bold, high-contrast, tight tracking on labels */ /* ------------------------------------------------------------------ */ .cms-theme-corporate01 .cms-fe-section__eyebrow, .cms-theme-corporate01 .cms-module-hero-eyebrow, .cms-theme-corporate01 .cms-fe-card__meta, .cms-theme-corporate01 .cms-fe-product-card__cat { font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; } .cms-theme-corporate01 .cms-fe-section__eyebrow { display: inline-flex; align-items: center; gap: 0.6rem; } .cms-theme-corporate01 .cms-fe-section__eyebrow::before { content: ''; width: 2.25rem; height: 3px; background: var(--cms-fe-color-accent); } .cms-theme-corporate01 .cms-fe-section__title, .cms-theme-corporate01 .cms-module-hero-title { font-weight: 800; letter-spacing: -0.01em; text-transform: uppercase; } .cms-theme-corporate01 .cms-fe-section__title { font-size: 1.85rem; } /* ------------------------------------------------------------------ */ /* Section rhythm — dense, industrial dividers between bands */ /* ------------------------------------------------------------------ */ .cms-theme-corporate01 .cms-fe-section + .cms-fe-section { border-top: 1px solid var(--cms-fe-color-border); } /* ------------------------------------------------------------------ */ /* Header / nav — solid, high-contrast bar with a bottom accent rule */ /* ------------------------------------------------------------------ */ /* This theme's default header treatment is "solid" with a thick accent rule — but still yields to the Theme Customizer's "header treatment" setting (FAZ 38.3) when the customer has changed it away from that default. */ .cms-theme-corporate01 .cms-fe-header:not([data-header-style]), .cms-theme-corporate01 .cms-fe-header[data-header-style='solid'] { border-bottom: 3px solid var(--cms-fe-color-primary); } .cms-theme-corporate01 .cms-fe-brand { text-transform: uppercase; letter-spacing: 0.06em; font-weight: 800; } .cms-theme-corporate01 .cms-fe-nav__link { font-weight: 700; font-size: 0.85rem; text-transform: uppercase; letter-spacing: 0.04em; } .cms-theme-corporate01 .cms-fe-nav__link[aria-current='page'] { color: var(--cms-fe-color-primary); } .cms-theme-corporate01 .cms-fe-navtoggle { border-radius: 0; text-transform: uppercase; letter-spacing: 0.06em; font-weight: 700; font-size: 0.75rem; } /* ------------------------------------------------------------------ */ /* Hero — full-bleed, cinematic industrial imagery, sharp diagonal cut */ /* ------------------------------------------------------------------ */ .cms-theme-corporate01 .cms-module-hero-root { position: relative; background: var(--cms-fe-color-heading); overflow: hidden; } .cms-theme-corporate01 .cms-module-hero-slide { position: relative; display: flex; flex-direction: column; justify-content: flex-end; min-height: 32rem; padding: 3.5rem var(--cms-fe-container-padding) 4.5rem; color: #fff; } .cms-theme-corporate01 .cms-module-hero-slide::before { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(15, 23, 42, 0.55) 0%, rgba(15, 23, 42, 0.88) 100%); z-index: 0; } .cms-theme-corporate01 .cms-module-hero-background { position: absolute; inset: 0; z-index: -1; } .cms-theme-corporate01 .cms-module-hero-background img { width: 100%; height: 100%; object-fit: cover; } .cms-theme-corporate01 .cms-module-hero-eyebrow, .cms-theme-corporate01 .cms-module-hero-title, .cms-theme-corporate01 .cms-module-hero-subtitle, .cms-theme-corporate01 .cms-module-hero-actions { position: relative; z-index: 1; max-width: 42rem; } .cms-theme-corporate01 .cms-module-hero-eyebrow { color: var(--cms-fe-color-accent); font-weight: 800; letter-spacing: 0.16em; text-transform: uppercase; font-size: 0.85rem; } .cms-theme-corporate01 .cms-module-hero-title { color: #fff; font-size: clamp(2rem, 4.5vw, 3.4rem); line-height: 1.1; margin: 0.75rem 0 1rem; } .cms-theme-corporate01 .cms-module-hero-subtitle { color: rgba(255, 255, 255, 0.85); font-size: 1.05rem; max-width: 34rem; } .cms-theme-corporate01 .cms-module-hero-actions { margin-top: 1.75rem; display: flex; gap: 1rem; flex-wrap: wrap; } .cms-theme-corporate01 .cms-module-hero-inner::after { content: ''; position: absolute; inset-inline: 0; bottom: 0; height: 1.5rem; background: var(--cms-fe-color-bg); clip-path: polygon(0 100%, 100% 0, 100% 100%); } /* ------------------------------------------------------------------ */ /* Buttons — sharp, bold, industrial */ /* ------------------------------------------------------------------ */ .cms-theme-corporate01 .cms-fe-button, .cms-theme-corporate01 .cms-module-hero-button, .cms-theme-corporate01 .cms-module-hero-button-secondary, .cms-theme-corporate01 .cms-module-cta-button, .cms-theme-corporate01 .cms-module-cta-button-secondary { text-transform: uppercase; letter-spacing: 0.05em; font-weight: 700; font-size: 0.85rem; } /* This theme's default button treatment is "square" — but still yields to the Theme Customizer's "button treatment" setting (FAZ 38.3, [data-style] from App\Core\Theme\ThemeStyleSettings) when the customer has actually changed it away from that default. */ .cms-theme-corporate01 .cms-fe-button:not([data-style]), .cms-theme-corporate01 .cms-fe-button[data-style='square'] { border-radius: 0; } .cms-theme-corporate01 .cms-fe-button--primary, .cms-theme-corporate01 .cms-fe-button:not([class*='cms-fe-button--']) { background: var(--cms-fe-color-accent); color: var(--cms-fe-color-heading); } /* ------------------------------------------------------------------ */ /* About — split, technical, image with a sharp accent frame */ /* ------------------------------------------------------------------ */ .cms-theme-corporate01 .cms-module-about-image { position: relative; border: 4px solid var(--cms-fe-color-heading); } /* ------------------------------------------------------------------ */ /* Plain-link items (Services/Projects/Blog homepage modules) — same */ /* square-edged, thick-border treatment as the card component so every */ /* homepage section reads as one consistent industrial system. */ /* ------------------------------------------------------------------ */ .cms-theme-corporate01 .cms-module-services-item, .cms-theme-corporate01 .cms-module-projects-item, .cms-theme-corporate01 .cms-module-blog-item { border-width: 2px; border-radius: 0; transition: border-color 0.18s ease, transform 0.18s ease; } .cms-theme-corporate01 .cms-module-services-item:hover, .cms-theme-corporate01 .cms-module-projects-item:hover, .cms-theme-corporate01 .cms-module-blog-item:hover { border-color: var(--cms-fe-color-accent); transform: translateY(-2px); } /* ------------------------------------------------------------------ */ /* Cards — square-edged, thick border, bold meta, accent hover */ /* ------------------------------------------------------------------ */ .cms-theme-corporate01 .cms-fe-card { border-width: 2px; border-radius: var(--cms-fe-radius); transition: border-color 0.18s ease, transform 0.18s ease; } .cms-theme-corporate01 .cms-fe-card:hover { border-color: var(--cms-fe-color-accent); transform: translateY(-2px); } .cms-theme-corporate01 .cms-fe-card__media img { transition: transform 0.35s ease; } .cms-theme-corporate01 .cms-fe-card:hover .cms-fe-card__media img { transform: scale(1.06); } .cms-theme-corporate01 .cms-fe-card__title { font-weight: 800; } .cms-theme-corporate01 .cms-fe-card__badge { border-radius: 0; } /* ------------------------------------------------------------------ */ /* Statistics — technical data-panel grid, thick top accent per cell */ /* ------------------------------------------------------------------ */ .cms-theme-corporate01 .cms-module-statistics-grid { background: var(--cms-fe-color-heading); border-radius: 0; } .cms-theme-corporate01 .cms-module-statistics-item { border-top: 3px solid var(--cms-fe-color-accent); padding: 1.75rem 1.5rem; text-align: center; } .cms-theme-corporate01 .cms-module-statistics-value { font-weight: 800; font-size: 2.25rem; letter-spacing: -0.02em; color: #fff; } .cms-theme-corporate01 .cms-module-statistics-label { color: rgba(255, 255, 255, 0.7); font-weight: 700; font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.06em; } .cms-theme-corporate01 .cms-module-statistics-item-description { color: rgba(255, 255, 255, 0.55); } /* ------------------------------------------------------------------ */ /* Sectors — industrial grid cards, sharp edges, accent rule on hover */ /* ------------------------------------------------------------------ */ .cms-theme-corporate01 .cms-module-sectors-item { display: block; border: 2px solid var(--cms-fe-color-border); border-radius: 0; padding: 1.5rem; text-decoration: none; color: inherit; transition: border-color 0.18s ease, transform 0.18s ease; } .cms-theme-corporate01 a.cms-module-sectors-item:hover { border-color: var(--cms-fe-color-accent); transform: translateY(-2px); } .cms-theme-corporate01 .cms-module-sectors-item-title { font-weight: 800; text-transform: uppercase; letter-spacing: 0.04em; font-size: 0.95rem; color: var(--cms-fe-color-heading); } .cms-theme-corporate01 .cms-module-sectors-item-description { color: var(--cms-fe-color-muted); font-size: 0.875rem; } /* ------------------------------------------------------------------ */ /* Footer — solid, structured */ /* ------------------------------------------------------------------ */ .cms-theme-corporate01 .cms-fe-footer { border-top-width: 3px; border-top-color: var(--cms-fe-color-primary); } .cms-theme-corporate01 .cms-fe-footer__heading { text-transform: uppercase; letter-spacing: 0.08em; font-size: 0.8rem; } /* ------------------------------------------------------------------ */ /* Motion — subtle only; this theme deliberately avoids showy effects */ /* (Phase 37 §2: "abartılı animation yapma"). Respected globally by */ /* frontend.css's own `prefers-reduced-motion` rule already. */ /* ------------------------------------------------------------------ */ .cms-theme-corporate01 [data-reveal] { opacity: 0; transform: translateY(10px); transition: opacity 0.4s ease, transform 0.4s ease; } .cms-theme-corporate01 [data-reveal-visible] { opacity: 1; transform: none; } @media (prefers-reduced-motion: reduce) { .cms-theme-corporate01 [data-reveal] { opacity: 1; transform: none; } }