/* tasarim/style.css */

/* Mobile App Feel Adjustments */
body {
    -webkit-tap-highlight-color: transparent;
    background-color: #FAFAFA;
    color: #1f2937;
    overscroll-behavior-y: none; /* Prevents pull-to-refresh glow */
}

/* Hide Scrollbar but keep functionality */
::-webkit-scrollbar {
    width: 0px;
    height: 0px;
    background: transparent;
}

/* Scroll Lock Class */
.scroll-lock {
    overflow: hidden !important;
    touch-action: none;
}

/* General Reveal Animations */
.reveal {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.8s cubic-bezier(0.5, 0, 0, 1);
}

.reveal.active {
    opacity: 1;
    transform: translateY(0);
}

/* Instagram Story-like Category Animations */
@keyframes slideInRight {
    from {
        opacity: 0;
        transform: translateX(50px) scale(0.9);
    }
    to {
        opacity: 1;
        transform: translateX(0) scale(1);
    }
}

.story-anim {
    opacity: 0;
}

.reveal.active .story-anim {
    animation: slideInRight 0.6s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
}

/* Staggered Delays for Categories */
.story-anim:nth-child(1) { animation-delay: 0.1s; }
.story-anim:nth-child(2) { animation-delay: 0.2s; }
.story-anim:nth-child(3) { animation-delay: 0.3s; }
.story-anim:nth-child(4) { animation-delay: 0.4s; }
.story-anim:nth-child(5) { animation-delay: 0.5s; }
.story-anim:nth-child(6) { animation-delay: 0.6s; }

/* Horizontal Scroll Snap */
.snap-x-mandatory {
    scroll-snap-type: x mandatory;
}
.snap-center {
    scroll-snap-align: center;
}

/* Splash Screen */
#splash-screen {
    transition: opacity 0.3s ease-out, visibility 0.6s ease-out;
}

/* Modals Transition */
.modal-overlay {
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease-out;
}
.modal-overlay.open {
    opacity: 1;
    visibility: visible;
}
.modal-content {
    transform: translateY(100%);
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}
.modal-overlay.open .modal-content {
    transform: translateY(0);
}

/* Mobile Menu Transition */
.side-menu {
    transform: translateX(-100%);
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}
.modal-overlay.open .side-menu {
    transform: translateX(0);
}

/* Gradient Text */
.text-gradient {
    background: linear-gradient(to right, #D4AF37, #AA8C2C);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
/* Light brand surfaces keep the original dark logo legible. */
#splash-screen {
    background: radial-gradient(ellipse at center, #ffffff 0%, #faf7ef 58%, #f0e9da 100%);
    padding: 32px;
}
#splash-screen .splash-logo {
    width: clamp(200px, 28vw, 300px);
    max-width: 80vw;
    height: auto;
    object-fit: contain;
    filter: drop-shadow(0 8px 18px rgba(78, 57, 28, .10));
}
#splash-screen h1 { color: #183d2c; }
#splash-screen p { color: #8b713c; }
.menu-brand-header {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    min-height: 152px;
    padding: 22px 56px;
    background: linear-gradient(135deg, #fffefa, #f3eddf);
    border-bottom: 1px solid #e9e1d0;
    border-radius: 0 0 24px 0;
}
.menu-brand-logo { min-width: 0; text-align: center; }
.menu-logo { display: block; width: 160px; max-width: 100%; height: 106px; object-fit: contain; margin: auto; }
.menu-brand-close, .cookie-policy-close {
    display: flex; align-items: center; justify-content: center;
    width: 40px; height: 40px; flex-shrink: 0;
    border: 1px solid #e4ddcf; border-radius: 50%;
    background: #fffdf8; color: #405044;
    transition: background .2s;
}
.menu-brand-close { position: absolute; right: 12px; top: 16px; }
.menu-brand-close:hover, .cookie-policy-close:hover { background: #eee7d8; }
:is(#cookie-policy-modal, #kvkk-modal) { padding: 24px; align-items: center; }
.cookie-policy-card {
    width: 100%; max-width: 740px; max-height: 88vh; max-height: 88dvh;
    display: flex; flex-direction: column; overflow: hidden;
    border: 1px solid #ece6d9; border-radius: 26px;
    background: #fffefa; box-shadow: 0 28px 90px rgba(0, 0, 0, .24);
}
.cookie-policy-header {
    display: flex; align-items: center; gap: 16px; flex-shrink: 0;
    padding: 26px 28px; background: #f7f2e8; border-bottom: 1px solid #eae2d2;
}
.cookie-policy-icon {
    display: flex; align-items: center; justify-content: center;
    width: 52px; height: 52px; flex-shrink: 0;
    border-radius: 16px; background: #eee3cb; color: #927334; font-size: 25px;
}
.cookie-policy-eyebrow { display: block; font-size: 9px; font-weight: 600; letter-spacing: 1.4px; color: #887043; margin-bottom: 6px; }
:is(#cookie-policy-title, #kvkk-policy-title) { color: #193d2c; font-size: 27px; font-weight: 700; line-height: 1.2; }
.cookie-policy-close { margin-left: auto; }
.cookie-policy-body {
    min-height: 0; overflow-y: auto; overscroll-behavior: contain; touch-action: pan-y;
    padding: 24px 28px; color: #536058; font-size: 14px; line-height: 1.85;
    scrollbar-width: thin; scrollbar-color: #cabea6 transparent; overflow-wrap: anywhere;
}
.cookie-policy-body::-webkit-scrollbar { width: 5px; }
.cookie-policy-body::-webkit-scrollbar-thumb { background: #cabea6; border-radius: 5px; }
.cookie-policy-body section { padding: 18px 20px; background: white; border: 1px solid #ebe6dc; border-radius: 16px; margin-bottom: 14px; }
.cookie-policy-body section:last-child { margin-bottom: 0; }
.cookie-policy-body :is(h1,h2,h3,h4,h5,h6) { color: #234633; font-size: 16px; font-weight: 600; margin: 0 0 9px; line-height: 1.5; }
.cookie-policy-body p { white-space: pre-line; margin: 0 0 12px; }
.cookie-policy-body p:last-child { margin-bottom: 0; }
.cookie-policy-body :is(ul,ol) { padding-left: 22px; margin: 10px 0 16px; }
.cookie-policy-body ul { list-style: disc; }
.cookie-policy-body ol { list-style: decimal; }
.cookie-policy-body li { margin: 6px 0; }
.cookie-policy-body a { color: #234633; text-decoration: underline; }
.cookie-policy-footer {
    padding: 18px 28px; border-top: 1px solid #eae2d2;
    display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-shrink: 0;
    background: #f7f2e8;
}
.cookie-policy-footer span { color: #788076; font-size: 11px; }
.cookie-policy-footer span i { margin-right: 6px; }
.cookie-policy-done { padding: 12px 32px; border-radius: 12px; background: #214b36; color: white; font-size: 14px; font-weight: 500; }
.cookie-policy-done:hover { background: #163b28; }
:is(.menu-brand-close, .cookie-policy-close, .cookie-policy-done, .cookie-policy-body):focus-visible { outline: 3px solid #ad914e; outline-offset: 3px; }
@media (max-width: 600px) {
    :is(#cookie-policy-modal, #kvkk-modal) { padding: 12px; }
    .cookie-policy-card { max-height: 90vh; max-height: 90dvh; border-radius: 22px; }
    .cookie-policy-header { padding: 20px 16px; gap: 10px; }
    .cookie-policy-icon { width: 38px; height: 38px; font-size: 20px; border-radius: 12px; }
    .cookie-policy-eyebrow { font-size: 8px; letter-spacing: .6px; }
    :is(#cookie-policy-title, #kvkk-policy-title) { font-size: 22px; }
    .cookie-policy-close { width: 36px; height: 36px; }
    .cookie-policy-body { padding: 16px; font-size: 13px; }
    .cookie-policy-body section { padding: 16px; }
    .cookie-policy-footer { padding: 14px 16px; }
    .cookie-policy-footer span { max-width: 160px; }
    .cookie-policy-done { padding: 12px 24px; }
}
@media (prefers-reduced-motion: reduce) {
    :is(#cookie-policy-modal, #kvkk-modal), :is(#cookie-policy-modal, #kvkk-modal) .modal-content { transition: none; }
}

/* Fit admin-provided map embeds, including fixed HTML and inline dimensions. */
.contact-map { position: relative; width: 100%; }
.contact-map iframe {
    display: block;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    border: 0;
}
.contact-map > :is(div, p) { width: 100% !important; height: 100% !important; margin: 0; }