/*
Theme Name: memary Theme
Theme URI: https://memary.net
Author: memary
Author URI: https://memary.net
Description: Custom WordPress theme for memary.net - Iranian Architecture Platform
Version: 1.0.0
License: GPL v2 or later
Text Domain: memary
*/

/* Self-hosted Vazirmatn variable font */
@font-face {
    font-family: 'Vazirmatn';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url(fonts/vazirmatn-arabic.woff2) format('woff2');
    unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC4, U+10EFC-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1;
}
@font-face {
    font-family: 'Vazirmatn';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url(fonts/vazirmatn-latin-ext.woff2) format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
    font-family: 'Vazirmatn';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url(fonts/vazirmatn-latin.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Fixed header offset (top bar is static, only nav is fixed) */
.site { padding-top: 104px; }
@media (max-width: 1023px) {
    .site { padding-top: 64px; }
}

/* Admin bar offsets for fixed elements */
.admin-bar #fixedHeader { top: 32px; }
@media screen and (max-width: 782px) {
    .admin-bar #fixedHeader { top: 46px; }
}
.admin-bar .mobile-menu { top: 32px; }
@media screen and (max-width: 782px) {
    .admin-bar .mobile-menu { top: 46px; }
}

/* Block editor heading styles */
.wp-block-heading { color: #0a1628; font-weight: 700; line-height: 1.15; }
h1.wp-block-heading { font-size: 2.25rem; }
h2.wp-block-heading { font-size: 1.875rem; }
h3.wp-block-heading { font-size: 1.5rem; }
h4.wp-block-heading { font-size: 1.25rem; }
h5.wp-block-heading { font-size: 1.125rem; }
h6.wp-block-heading { font-size: 1rem; }

/* Glitch text — subtle idle, intense on switch */
.glitch {
    position: relative;
    display: inline-block;
    animation: glitch-skew-subtle 6s ease-in-out infinite;
}
.glitch::before,
.glitch::after {
    content: attr(data-text);
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    opacity: 0;
}

/* Switching: full glitch */
.glitch.switching { animation: glitch-skew 0.5s linear infinite alternate-reverse; }
.glitch.switching::before,
.glitch.switching::after { opacity: 1; }
.glitch.switching::before {
    left: 2px;
    text-shadow: -2px 0 #ff00c1;
    clip: rect(2px, 9999px, 18px, 0);
    animation: glitch-anim 0.5s steps(8, end) forwards;
}
.glitch.switching::after {
    left: -2px;
    text-shadow: -2px 0 #00fff2, 2px 2px #ff00c1;
    clip: rect(2px, 9999px, 18px, 0);
    animation: glitch-anim2 0.5s steps(6, end) forwards;
}

@keyframes glitch-skew-subtle {
    0%, 85%, 100% { transform: skew(0deg); }
    88% { transform: skew(0.3deg); }
    91% { transform: skew(-0.2deg); }
    94% { transform: skew(0.1deg); }
    97% { transform: skew(-0.3deg); }
}

@keyframes glitch-anim {
    0% { clip: rect(2px, 9999px, 10px, 0); transform: skew(1deg); }
    12% { clip: rect(14px, 9999px, 17px, 0); transform: skew(2deg); }
    25% { clip: rect(5px, 9999px, 9px, 0); transform: skew(-1deg); }
    37% { clip: rect(11px, 9999px, 15px, 0); transform: skew(3deg); }
    50% { clip: rect(3px, 9999px, 7px, 0); transform: skew(-2deg); }
    62% { clip: rect(16px, 9999px, 18px, 0); transform: skew(1deg); }
    75% { clip: rect(8px, 9999px, 13px, 0); transform: skew(-1deg); }
    87% { clip: rect(1px, 9999px, 6px, 0); transform: skew(2deg); }
    100% { clip: rect(10px, 9999px, 16px, 0); transform: skew(0deg); }
}

@keyframes glitch-anim2 {
    0% { clip: rect(12px, 9999px, 16px, 0); }
    16% { clip: rect(3px, 9999px, 8px, 0); }
    33% { clip: rect(15px, 9999px, 18px, 0); }
    50% { clip: rect(5px, 9999px, 11px, 0); }
    66% { clip: rect(1px, 9999px, 6px, 0); }
    83% { clip: rect(9px, 9999px, 14px, 0); }
    100% { clip: rect(13px, 9999px, 17px, 0); }
}

@keyframes glitch-skew {
    0%, 40% { transform: skew(-2deg); }
    10%, 50%, 100% { transform: skew(-1deg); }
    20%, 90% { transform: skew(3deg); }
    30%, 80% { transform: skew(1deg); }
    60% { transform: skew(2deg); }
    70% { transform: skew(-3deg); }
}

/* Custom CSS from HTML */
::selection { background: rgba(1, 85, 153, 0.2); color: rgb(1, 85, 153); }
html { scroll-behavior: smooth; }
body { font-family: 'Vazirmatn', Tahoma, sans-serif; }

.persian-pattern {
    background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg stroke='%2301559908' stroke-width='0.5'%3E%3Cpath d='M30 0L60 30L30 60L0 30z'/%3E%3Cpath d='M30 10L50 30L30 50L10 30z'/%3E%3Cpath d='M30 20L40 30L30 40L20 30z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}
.persian-pattern-dark {
    background-image: url("data:image/svg+xml,%3Csvg width='80' height='80' viewBox='0 0 80 80' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg stroke='%23ffffff0a' stroke-width='0.5'%3E%3Cpath d='M40 0L80 40L40 80L0 40z'/%3E%3Cpath d='M40 15L65 40L40 65L15 40z'/%3E%3Cpath d='M40 25L55 40L40 55L25 40z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}
.paper-texture {
    background-image: url("data:image/svg+xml,%3Csvg width='100' height='100' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.02'/%3E%3C/svg%3E");
}
.hero-overlay {
    background: linear-gradient(135deg, rgba(1, 85, 153, 0.85) 0%, rgba(10, 22, 40, 0.7) 50%, rgba(1, 85, 153, 0.6) 100%);
}

.fade-section { opacity: 1; transform: translateY(0); }
body.anim-ready .fade-section { opacity: 0; transform: translateY(30px); transition: opacity 0.8s ease, transform 0.8s ease; }
body.anim-ready .fade-section.visible { opacity: 1; transform: translateY(0); }

.nav-scrolled { background: rgba(255, 255, 255, 0.97) !important; box-shadow: 0 1px 20px rgba(1, 85, 153, 0.08); }

.project-card .project-overlay { opacity: 1; }
.project-card:hover .project-img { transform: scale(1.05); }
.project-card .project-img { transition: transform 0.7s ease; }

.pub-card:hover { transform: translateY(-4px); box-shadow: 0 12px 40px rgba(1, 85, 153, 0.12); }
.pub-card { transition: all 0.4s ease; }

.award-badge { background: linear-gradient(135deg, rgb(1, 85, 153), #014a7e); }

.mobile-menu { transform: translateX(100%); transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1); }
[dir="rtl"] .mobile-menu { transform: translateX(-100%); }
.mobile-menu.open { transform: translateX(0) !important; }

.toast { transform: translateY(100px); opacity: 0; transition: all 0.4s ease; }
.toast.show { transform: translateY(0); opacity: 1; }

.geo-line { width: 40px; height: 2px; background: rgb(1, 85, 153); position: relative; }
.geo-line::after { content: ''; position: absolute; right: 12px; top: 6px; width: 16px; height: 2px; background: rgb(1, 85, 153); opacity: 0.5; }

::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: #f5f3f0; }
::-webkit-scrollbar-thumb { background: rgb(1, 85, 153); border-radius: 3px; }

.line-clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

/* Filter buttons fallback */
.filter-btn.active { background-color: rgb(1, 85, 153); color: white; border-color: rgb(1, 85, 153); }
.filter-btn:not(.active) { background-color: transparent; color: #64748b; border-color: #e2e8f0; }
.filter-btn:not(.active):hover { border-color: rgb(1, 85, 153); color: rgb(1, 85, 153); }

/* Desktop dropdown menus */
.has-dropdown { position: relative; }
.has-dropdown > a { position: relative; }
.has-dropdown > a::after {
    content: '›';
    margin-left: 6px;
    display: inline-block;
    transition: transform 0.2s;
}
[dir="rtl"] .has-dropdown > a::after {
    content: '‹';
    margin-left: 0;
    margin-right: 6px;
}
.has-dropdown:hover > a::after {
    transform: rotate(90deg);
}
[dir="rtl"] .has-dropdown:hover > a::after {
    transform: rotate(180deg) rotate(90deg);
}

/* Dropdown submenu */
.sub-menu {
    list-style: none;
    margin: 0;
    padding: 0;
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 220px;
    background: white;
    box-shadow: 0 10px 25px rgba(0,0,0,0.1);
    border-radius: 4px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: all 0.2s ease;
    z-index: 50;
    border: 1px solid #e2e8f0;
}
.has-dropdown:hover > .sub-menu,
.has-dropdown:focus-within > .sub-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}
.sub-menu li a {
    display: block;
    padding: 10px 16px;
    color: #475569;
    font-size: 13px;
    border-bottom: 1px solid #f1f5f9;
}
.sub-menu li:last-child a { border-bottom: none; }
.sub-menu li a:hover {
    background-color: #f8fafc;
    color: rgb(1, 85, 153);
}

/* Mobile menu */
.mobile-menu a {
    display: block;
    padding: 12px 16px;
    color: #475569;
    border-bottom: 1px solid #f1f5f9;
    transition: background 0.2s, color 0.2s;
}
.mobile-menu a:hover {
    background-color: #f8fafc;
    color: #015599;
}
.mobile-menu .sub-menu {
    position: static;
    opacity: 1;
    visibility: visible;
    transform: none;
    box-shadow: none;
    border: none;
    border-radius: 0;
    padding-right: 16px;
    list-style: none;
    background-color: #f8fafc;
}
.mobile-menu .sub-menu li a {
    padding-left: 32px;
    border-bottom: 1px solid #f1f5f9;
}
.mobile-menu .sub-menu li a:hover {
    background-color: #f1f5f9;
}

/* Mobile submenu toggle indicator */
.mobile-menu li.menu-item-has-children > a::after {
    content: '+';
    float: left;
    font-weight: bold;
    margin-left: 8px;
}
[dir="rtl"] .mobile-menu li.menu-item-has-children > a::after {
    content: '+';
    float: right;
    margin-left: 0;
    margin-right: 8px;
}