/* ═══════════════════════════════════════════════════════════════
   Mr.Wings Franchise — Frontend CSS
   Aesthetic: Bold / Industrial / Premium Street Food
   ═══════════════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Barlow:ital,wght@0,400;0,500;0,600;1,700&family=Barlow+Condensed:wght@600;700;800&display=swap');

:root {
    --mw-red:      #E8220A;
    --mw-red-dark: #b51a08;
    --mw-orange:   #FF6B1A;
    --mw-gold:     #F5C518;
    --mw-dark:     #0D0D0D;
    --mw-dark2:    #151515;
    --mw-dark3:    #1e1e1e;
    --mw-gray:     #888;
    --mw-light:    #f5f0ea;
    --mw-cream:    #FFF9F2;
    --mw-border:   rgba(255,255,255,.08);
    --mw-font-hero: 'Bebas Neue', sans-serif;
    --mw-font-body: 'Barlow', sans-serif;
    --mw-font-cond: 'Barlow Condensed', sans-serif;
    --mw-radius: 12px;
    --mw-radius-lg: 20px;
}

/* ── Reset & Base ────────────────────────────────────────────── */
#mrwings-landing, #mrwings-landing * {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}
#mrwings-landing {
    font-family: var(--mw-font-body);
    color: var(--mw-light);
    background: var(--mw-dark);
    overflow-x: hidden;
    line-height: 1.6;
}
.mw-container {
    max-width: 1140px;
    margin: 0 auto;
    padding: 0 24px;
}

/* ── Section Labels ──────────────────────────────────────────── */
.mw-section-label {
    font-family: var(--mw-font-cond);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 4px;
    text-transform: uppercase;
    color: var(--mw-orange);
    margin-bottom: 12px;
}
.mw-section-title {
    font-family: var(--mw-font-hero);
    font-size: clamp(42px, 6vw, 72px);
    line-height: 1.0;
    color: #fff;
    margin-bottom: 48px;
    letter-spacing: 1px;
}

/* ═══════════════════════════════════════════════════════════════
   HERO
   ═══════════════════════════════════════════════════════════════ */
.mw-hero {
    min-height: 100vh;
    background: var(--mw-dark);
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden;
}
.mw-hero__noise {
    position: absolute;
    inset: 0;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.04'/%3E%3C/svg%3E");
    opacity: 0.6;
    pointer-events: none;
}
.mw-hero__glow {
    position: absolute;
    width: 800px;
    height: 800px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(232,34,10,0.25) 0%, transparent 65%);
    top: 50%;
    left: 50%;
    transform: translate(-50%, -55%);
    pointer-events: none;
    animation: mw-pulse 4s ease-in-out infinite;
}
@keyframes mw-pulse {
    0%,100% { transform: translate(-50%, -55%) scale(1); opacity: 1; }
    50%      { transform: translate(-50%, -55%) scale(1.08); opacity: 0.8; }
}
.mw-hero__content {
    position: relative;
    z-index: 2;
    text-align: center;
    padding: 60px 24px;
    max-width: 900px;
    animation: mw-fade-up .8s ease both;
}
@keyframes mw-fade-up {
    from { opacity:0; transform: translateY(30px); }
    to   { opacity:1; transform: translateY(0); }
}

/* Brand logo */
.mw-brand {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 40px;
    background: rgba(255,255,255,.06);
    border: 1px solid var(--mw-border);
    padding: 16px 32px;
    border-radius: 100px;
}
.mw-brand__logo {
    height: 72px;
    width: auto;
    max-width: 260px;
    object-fit: contain;
    filter: drop-shadow(0 2px 12px rgba(255,120,0,.25));
    transition: filter .3s ease;
}

/* ── Logo animasyon stilleri ────────────────────────────────── */
/* Float + Pulse: Yukarı aşağı sallanma + ışıltı artıp azalma */
.mw-logo-anim--float-pulse {
    animation: mw-float-pulse 3.5s ease-in-out infinite;
}
@keyframes mw-float-pulse {
    0%, 100% {
        transform: translateY(0);
        filter: drop-shadow(0 2px 12px rgba(255,120,0,.25));
    }
    25% {
        transform: translateY(-8px);
        filter: drop-shadow(0 8px 24px rgba(255,120,0,.4));
    }
    50% {
        transform: translateY(0);
        filter: drop-shadow(0 2px 12px rgba(255,120,0,.25));
    }
    75% {
        transform: translateY(-4px);
        filter: drop-shadow(0 6px 18px rgba(255,120,0,.35));
    }
}

/* Bounce: Elastik sıçrama */
.mw-logo-anim--bounce {
    animation: mw-bounce 2.2s cubic-bezier(0.68, -0.55, 0.265, 1.55) infinite;
}
@keyframes mw-bounce {
    0%, 100% {
        transform: translateY(0);
        filter: drop-shadow(0 2px 12px rgba(255,120,0,.25));
    }
    50% {
        transform: translateY(-24px);
        filter: drop-shadow(0 12px 32px rgba(232,34,10,.4));
    }
}

/* Rotate + Glow: Dönerken ışınlı hale gelme */
.mw-logo-anim--rotate-glow {
    animation: mw-rotate-glow 4s linear infinite;
    will-change: transform, filter;
}
@keyframes mw-rotate-glow {
    0% {
        transform: rotate(0deg) scale(1);
        filter: drop-shadow(0 2px 12px rgba(255,120,0,.25));
    }
    50% {
        filter: drop-shadow(0 0 24px rgba(232,34,10,.5)) drop-shadow(0 0 40px rgba(255,120,0,.3));
    }
    100% {
        transform: rotate(360deg) scale(1);
        filter: drop-shadow(0 2px 12px rgba(255,120,0,.25));
    }
}

/* None: Sabit, animasyon yok */
.mw-logo-anim--none {
    animation: none;
}

/* Hover effect - tüm animasyonlar */
.mw-brand:hover .mw-brand__logo {
    filter: drop-shadow(0 4px 20px rgba(232,34,10,.5));
}
.mw-brand__text { display: flex; gap: 4px; align-items: baseline; }
.mw-brand__mr   { font-family: var(--mw-font-hero); font-size: 28px; color: var(--mw-gold); letter-spacing: 2px; }
.mw-brand__wings{ font-family: var(--mw-font-hero); font-size: 28px; color: #fff; letter-spacing: 3px; }

/* Hero title */
.mw-hero__title {
    font-family: var(--mw-font-hero);
    font-size: clamp(48px, 8vw, 96px);
    line-height: 1.0;
    letter-spacing: 1px;
    color: #fff;
    margin-bottom: 24px;
}
.mw-hero__title em {
    font-style: normal;
    color: var(--mw-orange);
}
.mw-highlight {
    -webkit-text-stroke: 2px var(--mw-red);
    color: transparent;
}
.mw-hero__sub {
    font-size: 18px;
    color: rgba(255,255,255,.65);
    max-width: 520px;
    margin: 0 auto 40px;
    line-height: 1.7;
}
.mw-hero__scroll-hint {
    position: absolute;
    bottom: 32px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 12px;
    letter-spacing: 3px;
    color: rgba(255,255,255,.3);
    animation: mw-bob 2s ease-in-out infinite;
}
@keyframes mw-bob {
    0%,100% { transform: translateX(-50%) translateY(0); }
    50%      { transform: translateX(-50%) translateY(6px); }
}

/* Buttons */
.mw-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-family: var(--mw-font-cond);
    font-size: 18px;
    font-weight: 700;
    letter-spacing: 1px;
    text-decoration: none;
    padding: 18px 40px;
    border-radius: 100px;
    border: none;
    cursor: pointer;
    transition: all .2s;
}
.mw-btn--hero {
    background: var(--mw-red);
    color: #fff;
    box-shadow: 0 0 40px rgba(232,34,10,.4);
}
.mw-btn--hero:hover {
    background: var(--mw-red-dark);
    transform: translateY(-2px);
    box-shadow: 0 0 60px rgba(232,34,10,.5);
    color: #fff;
    text-decoration: none;
}
.mw-btn__arrow { transition: transform .2s; }
.mw-btn--hero:hover .mw-btn__arrow { transform: translateX(4px); }

/* ═══════════════════════════════════════════════════════════════
   STATS
   ═══════════════════════════════════════════════════════════════ */
.mw-stats {
    background: var(--mw-red);
    padding: 0;
    overflow: hidden;
}
.mw-stats__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
}
.mw-stat {
    padding: 48px 32px;
    text-align: center;
    border-right: 1px solid rgba(255,255,255,.2);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
}
.mw-stat:last-child { border-right: none; }
.mw-stat__num {
    font-family: var(--mw-font-hero);
    font-size: 64px;
    line-height: 1;
    color: #fff;
}
.mw-stat__suffix {
    font-family: var(--mw-font-hero);
    font-size: 32px;
    color: rgba(255,255,255,.7);
    margin-top: -32px;
}
.mw-stat__label {
    font-family: var(--mw-font-cond);
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: rgba(255,255,255,.8);
}

/* ═══════════════════════════════════════════════════════════════
   WHY / FEATURES
   ═══════════════════════════════════════════════════════════════ */
.mw-why {
    background: var(--mw-dark2);
    padding: 100px 0;
}
.mw-features {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2px;
    background: var(--mw-border);
}
.mw-feature {
    background: var(--mw-dark2);
    padding: 40px 32px;
    transition: background .2s;
}
.mw-feature:hover { background: var(--mw-dark3); }
.mw-feature__icon {
    font-size: 36px;
    margin-bottom: 16px;
    display: block;
}
.mw-feature h3 {
    font-family: var(--mw-font-cond);
    font-size: 22px;
    font-weight: 700;
    color: #fff;
    margin-bottom: 10px;
    letter-spacing: .5px;
}
.mw-feature p {
    font-size: 15px;
    color: var(--mw-gray);
    line-height: 1.7;
}

/* ═══════════════════════════════════════════════════════════════
   STEPS
   ═══════════════════════════════════════════════════════════════ */
.mw-steps {
    background: var(--mw-dark);
    padding: 100px 0;
}
.mw-steps__list {
    display: flex;
    flex-direction: column;
    gap: 0;
    position: relative;
}
.mw-steps__list::before {
    content: '';
    position: absolute;
    left: 48px;
    top: 0;
    bottom: 0;
    width: 1px;
    background: var(--mw-border);
}
.mw-step {
    display: flex;
    gap: 32px;
    align-items: flex-start;
    padding: 32px 0;
    border-bottom: 1px solid var(--mw-border);
}
.mw-step:last-child { border-bottom: none; }
.mw-step__num {
    font-family: var(--mw-font-hero);
    font-size: 48px;
    line-height: 1;
    color: var(--mw-red);
    min-width: 96px;
    text-align: center;
    background: var(--mw-dark);
    position: relative;
    z-index: 1;
}
.mw-step__body h3 {
    font-family: var(--mw-font-cond);
    font-size: 22px;
    font-weight: 700;
    color: #fff;
    margin-bottom: 8px;
    letter-spacing: .5px;
}
.mw-step__body p {
    font-size: 15px;
    color: var(--mw-gray);
    line-height: 1.7;
    max-width: 600px;
}

/* ═══════════════════════════════════════════════════════════════
   APPLICATION FORM
   ═══════════════════════════════════════════════════════════════ */
.mw-apply {
    background: var(--mw-cream);
    padding: 100px 0 80px;
}
.mw-apply .mw-section-label { color: var(--mw-red); }
.mw-apply .mw-section-title { color: var(--mw-dark); }
.mw-apply__subtitle {
    font-size: 17px;
    color: #555;
    margin-top: -30px;
    margin-bottom: 48px;
}
.mw-form-wrap {
    background: #fff;
    border-radius: var(--mw-radius-lg);
    overflow: hidden;
    box-shadow: 0 20px 80px rgba(0,0,0,.15);
}
.mw-form-section {
    padding: 40px 48px;
    border-bottom: 1px solid #f0ebe3;
}
.mw-form-section:last-of-type { border-bottom: none; }
.mw-form-section__label {
    display: flex;
    align-items: center;
    gap: 12px;
    font-family: var(--mw-font-cond);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: var(--mw-red);
    margin-bottom: 28px;
}
.mw-form-section__label span {
    font-family: var(--mw-font-hero);
    font-size: 28px;
    color: #e0d8ce;
    letter-spacing: 0;
}

/* Grid layouts */
.mw-form-grid { display: grid; gap: 20px; }
.mw-form-grid--3 { grid-template-columns: repeat(3, 1fr); }
.mw-form-grid--2 { grid-template-columns: repeat(2, 1fr); }
.mw-form-grid--1 { grid-template-columns: 1fr; }

/* Fields */
.mw-field { display: flex; flex-direction: column; gap: 8px; }
.mw-field label {
    font-size: 13px;
    font-weight: 600;
    color: #333;
    letter-spacing: .3px;
}
.req { color: var(--mw-red); }
.mw-optional { color: #aaa; font-weight: 400; }
.mw-field input[type="text"],
.mw-field input[type="email"],
.mw-field input[type="tel"],
.mw-field select,
.mw-field textarea {
    padding: 14px 16px;
    border: 2px solid #e8e0d8;
    border-radius: 10px;
    font-family: var(--mw-font-body);
    font-size: 15px;
    color: #222;
    background: #faf8f5;
    transition: border-color .2s, box-shadow .2s;
    outline: none;
    width: 100%;
}
.mw-field input:focus,
.mw-field select:focus,
.mw-field textarea:focus {
    border-color: var(--mw-red);
    box-shadow: 0 0 0 4px rgba(232,34,10,.08);
    background: #fff;
}
.mw-field input.mw-invalid,
.mw-field select.mw-invalid,
.mw-field textarea.mw-invalid {
    border-color: #e53e3e;
}
.mw-field__err {
    font-size: 12px;
    color: #e53e3e;
    min-height: 16px;
}

/* Radio cards (property type) */
.mw-radio-group {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
}
.mw-radio-card { cursor: pointer; }
.mw-radio-card input { display: none; }
.mw-radio-card__body {
    border: 2px solid #e8e0d8;
    border-radius: var(--mw-radius);
    padding: 24px 20px;
    text-align: center;
    transition: all .2s;
    background: #faf8f5;
}
.mw-radio-card input:checked + .mw-radio-card__body {
    border-color: var(--mw-red);
    background: #fff5f3;
    box-shadow: 0 0 0 4px rgba(232,34,10,.08);
}
.mw-radio-card__body:hover { border-color: #ccc; }
.mw-radio-card__icon { font-size: 32px; margin-bottom: 8px; }
.mw-radio-card__title { font-weight: 700; font-size: 16px; color: #222; margin-bottom: 4px; }
.mw-radio-card__desc { font-size: 13px; color: #888; }

/* Budget cards */
.mw-budget-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
}
.mw-budget-card {
    cursor: pointer;
    display: block;
}
.mw-budget-card input { display: none; }
.mw-budget-card span {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px 8px;
    border: 2px solid #e8e0d8;
    border-radius: 10px;
    font-family: var(--mw-font-cond);
    font-size: 15px;
    font-weight: 600;
    color: #444;
    text-align: center;
    transition: all .2s;
    background: #faf8f5;
    cursor: pointer;
}
.mw-budget-card input:checked + span {
    border-color: var(--mw-red);
    background: var(--mw-red);
    color: #fff;
    box-shadow: 0 4px 16px rgba(232,34,10,.3);
}
.mw-budget-card span:hover { border-color: #bbb; }

/* Experience toggle */
.mw-toggle-group {
    display: flex;
    gap: 16px;
}
.mw-toggle { cursor: pointer; }
.mw-toggle input { display: none; }
.mw-toggle span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 12px 24px;
    border: 2px solid #e8e0d8;
    border-radius: 100px;
    font-size: 15px;
    font-weight: 600;
    color: #555;
    transition: all .2s;
    background: #faf8f5;
    cursor: pointer;
}
.mw-toggle input:checked + span {
    border-color: var(--mw-red);
    background: var(--mw-red);
    color: #fff;
}

/* Submit */
.mw-form-submit {
    padding: 40px 48px;
    background: var(--mw-dark);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    flex-wrap: wrap;
}
.mw-form-note {
    font-size: 13px;
    color: rgba(255,255,255,.5);
    max-width: 400px;
    line-height: 1.6;
}
.mw-btn--submit {
    background: var(--mw-red);
    color: #fff;
    font-size: 17px;
    padding: 18px 44px;
    border-radius: 100px;
    box-shadow: 0 0 30px rgba(232,34,10,.4);
    white-space: nowrap;
    flex-shrink: 0;
}
.mw-btn--submit:hover:not(:disabled) {
    background: var(--mw-red-dark);
    box-shadow: 0 0 50px rgba(232,34,10,.5);
    transform: translateY(-2px);
}
.mw-btn--submit:disabled { opacity: .6; cursor: not-allowed; }
.btn-text { display: flex; align-items: center; gap: 8px; }
.btn-spinner svg {
    animation: mw-spin 1s linear infinite;
}
@keyframes mw-spin { to { transform: rotate(360deg); } }

/* Form result message */
.mw-form-result {
    padding: 24px 48px;
    font-size: 16px;
    font-weight: 600;
    text-align: center;
}
.mw-form-result.success {
    background: #f0fff4;
    color: #276749;
    border-top: 3px solid #48bb78;
}
.mw-form-result.error {
    background: #fff5f5;
    color: #c53030;
    border-top: 3px solid #fc8181;
}

/* ═══════════════════════════════════════════════════════════════
   FOOTER CTA
   ═══════════════════════════════════════════════════════════════ */
.mw-footer-cta {
    background: var(--mw-dark2);
    padding: 80px 0;
    text-align: center;
    border-top: 1px solid var(--mw-border);
}
.mw-footer-cta h2 {
    font-family: var(--mw-font-hero);
    font-size: 52px;
    color: #fff;
    margin-bottom: 12px;
}
.mw-footer-cta p {
    font-size: 17px;
    color: var(--mw-gray);
    margin-bottom: 32px;
}
.mw-contact-links {
    display: flex;
    gap: 24px;
    justify-content: center;
    flex-wrap: wrap;
}
.mw-contact-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 14px 28px;
    border: 1px solid var(--mw-border);
    border-radius: 100px;
    color: rgba(255,255,255,.8);
    text-decoration: none;
    font-weight: 600;
    transition: all .2s;
    background: rgba(255,255,255,.04);
}
.mw-contact-link:hover {
    border-color: var(--mw-red);
    color: #fff;
    background: rgba(232,34,10,.1);
}

/* ═══════════════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════════════ */
@media (max-width: 900px) {
    .mw-stats__grid { grid-template-columns: repeat(2, 1fr); }
    .mw-stat { border-right: none; border-bottom: 1px solid rgba(255,255,255,.2); }
    .mw-features { grid-template-columns: repeat(2, 1fr); }
    .mw-form-grid--3 { grid-template-columns: 1fr 1fr; }
    .mw-budget-grid { grid-template-columns: repeat(3, 1fr); }
    .mw-form-section { padding: 32px 28px; }
    .mw-form-submit { padding: 32px 28px; }
}
@media (max-width: 600px) {
    .mw-features { grid-template-columns: 1fr; }
    .mw-form-grid--3, .mw-form-grid--2 { grid-template-columns: 1fr; }
    .mw-radio-group { grid-template-columns: 1fr; }
    .mw-budget-grid { grid-template-columns: repeat(2, 1fr); }
    .mw-steps__list::before { display: none; }
    .mw-form-submit { flex-direction: column; align-items: stretch; }
    .mw-btn--submit { text-align: center; justify-content: center; }
    .mw-stats__grid { grid-template-columns: repeat(2, 1fr); }
}