/* Above-the-fold — giữ nhỏ; phần còn lại trong styles.css (tải không chặn) */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
:root{
--primary-dark:#1d4ed8;--accent-pink:#f472b6;--accent-pink-deep:#c43552;--accent-sky:#4fadcf;
--text-dark:#1f2937;--text-light:#6b7280;--bg-light:#f8fafc;--bg-white:#fff;--border-color:#e5e7eb;
--shadow-sm:0 1px 2px 0 rgba(15,23,42,.05);
--shadow-md:0 8px 24px -8px rgba(37,99,235,.1),0 4px 12px -4px rgba(244,114,182,.07);
--gradient-brand:linear-gradient(135deg,#4a6fdc 0%,#5fa8c4 40%,#efdfe8 70%,#d894b8 100%);
--gradient-hero:linear-gradient(152deg,#1e3a8a 0%,#2654c5 24%,#3570ad 46%,#7eb3d6 62%,#c9aeb4 82%,#c98396 96%);
}
html{scroll-behavior:smooth}
body{font-family:'Poppins',system-ui,sans-serif;color:var(--text-dark);line-height:1.6;background:var(--bg-light);overflow-x:hidden}
.giftory-home{background:radial-gradient(1200px 600px at 85% -10%,rgba(244,114,182,.055),transparent 55%),radial-gradient(900px 480px at -5% 30%,rgba(56,189,248,.065),transparent 50%),linear-gradient(180deg,#fdf2f8 0%,#f8fafc 38%,#eff6ff 100%)}
.container{width:100%;max-width:none;margin:0;padding:0 20px}
.header{background:rgba(255,255,255,.82);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid rgba(244,114,182,.14);box-shadow:0 4px 24px -10px rgba(30,64,175,.1),var(--shadow-sm);position:sticky;top:0;z-index:100;padding:1rem 0}
.header-content{display:flex;justify-content:space-between;align-items:center}
.logo{margin-left:-20px}
.logo-img{display:block;height:100px;width:200px;max-width:200px;aspect-ratio:2/1;object-fit:contain}
.logo picture{display:block;width:200px;height:100px;flex-shrink:0}
.nav{display:flex;align-items:center;gap:2rem;flex-wrap:wrap}
.nav-link{text-decoration:none;color:var(--text-dark);font-weight:500;position:relative}
.nav-login{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem 1.2rem;border-radius:2rem;background:var(--gradient-brand);color:#fff;font-weight:600;text-decoration:none;box-shadow:0 5px 16px rgba(56,189,248,.14)}
.hero{position:relative;padding:2.25rem 0 2.35rem;background:var(--gradient-hero);color:#fff;overflow:hidden;min-height:280px;display:flex;flex-direction:column}
.hero::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 90% 70% at 18% 22%,rgba(251,207,232,.26),transparent 52%),radial-gradient(ellipse 85% 60% at 88% 72%,rgba(186,230,253,.28),transparent 48%);pointer-events:none}
.hero::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,23,42,.08) 0%,rgba(30,58,138,.12) 50%,rgba(15,23,42,.14) 100%);pointer-events:none}
.hero-decoration{position:absolute;inset:0;pointer-events:none;z-index:1}
.hero-headline{position:relative;z-index:2;width:100%;padding:0 1rem;margin-bottom:1.85rem;text-align:center}
.hero-headline-inner{max-width:54rem;margin:0 auto}
.hero-headline-primary{margin:0 0 .65rem;font-size:clamp(2rem,6vw,3.15rem);font-weight:400;font-family:'Pacifico',cursive;line-height:1.2;color:rgba(255,255,255,.98);text-shadow:0 3px 18px rgba(15,23,42,.32)}
.hero-headline-tagline{margin:0;padding:.15rem 0 .5rem;font-size:clamp(1.05rem,2.95vw,1.52rem);line-height:1.42;text-align:center;font-weight:500}
.hero-tagline-reveal-line{display:inline-flex;flex-wrap:wrap;justify-content:center;gap:.28em .38em;max-width:min(36rem,100%)}
.hero-tagline-word{display:inline-block;font-family:'Fraunces',Georgia,serif;font-weight:500;color:rgba(255,252,254,.96)}
.hero-content{position:relative;z-index:2;text-align:center;max-width:720px;margin:0 auto}
.hero-features{display:flex;flex-direction:row;gap:2rem;justify-content:center;margin:0 auto 2rem;flex-wrap:nowrap;max-width:800px}
.hero-feature{display:flex;flex-direction:row;align-items:center;gap:1.5rem;background:rgba(255,255,255,.08);padding:1.5rem 2rem;border-radius:18px;border:1px solid rgba(252,231,243,.2);flex:1;min-width:0}
.hero-feature-icon{font-size:2.5rem}
.hero-feature-text h3,.hero-feature-text .hero-feature-title{font-size:1.1rem;font-weight:600;margin-bottom:.25rem;color:#fff}
.hero-feature-text p{font-size:.9rem;opacity:.9;color:#fff;margin:0}
.cta-button{display:inline-block;padding:1rem 2.5rem;background:linear-gradient(135deg,#fafafa 0%,#f5ebf2 100%);color:var(--primary-dark);text-decoration:none;font-weight:600;border-radius:50px;border:1px solid rgba(255,255,255,.65)}
.themes-section{padding:1.15rem 0 4.25rem;background:radial-gradient(ellipse 100% 80% at 50% 0%,rgba(252,231,243,.45),transparent 55%),var(--bg-white)}
.section-header--themes{text-align:center;margin-bottom:2.25rem}
.section-header--themes .themes-title-frame{display:inline-block;max-width:min(42rem,calc(100% - 1.25rem));margin:0 auto;padding:.82rem 1.35rem;border-radius:14px;border:1px solid rgba(244,114,182,.16);background:rgba(255,255,255,.9)}
.section-title--themes{font-size:clamp(1.05rem,2.55vw,1.42rem);font-weight:700;margin:0;line-height:1.52;color:var(--primary-dark);text-align:center}
.themes-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem;margin-top:1.5rem;align-items:stretch}
.themes-grid:not(:empty){min-height:0}
.theme-card{background:var(--bg-white);border-radius:16px;overflow:hidden;box-shadow:var(--shadow-md);border:1px solid rgba(226,232,240,.9);display:flex;flex-direction:column;position:relative}
.theme-image{width:100%;height:170px;position:relative;overflow:hidden;background:var(--bg-light);flex-shrink:0}
.theme-image picture{display:block;width:100%;height:100%}
.theme-image-img{width:100%;height:100%;object-fit:cover;display:block}
.theme-hot-ribbon{position:absolute;top:18px;right:-28px;width:110px;background:#dc2626;color:#fff;font-size:.72rem;font-weight:700;text-align:center;padding:5px 0;transform:rotate(45deg);z-index:2}
.theme-info--lcp-shell .theme-title{font-size:1rem;font-weight:600;padding:.75rem 1rem;margin:0}
@media (max-width:768px){
.header{padding:.45rem 0}
.logo-img{height:52px;width:auto;max-width:200px}
.nav{gap:.75rem;justify-content:center}
.themes-grid{grid-template-columns:1fr;gap:.85rem}
.hero-features{flex-direction:column;gap:.5rem}
.hero-feature{flex-direction:column;text-align:center;padding:.6rem .5rem}
}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:absolute;width:1px;height:1px;padding:.75rem 1rem;margin:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;background:var(--bg-white,#fff);color:var(--primary-dark,#1d4ed8);font-weight:600;text-decoration:none;border-radius:6px;z-index:10000}
.skip-link:focus{position:fixed;top:.75rem;left:.75rem;width:auto;height:auto;clip:auto;overflow:visible;white-space:normal;outline:2px solid var(--primary-dark,#1d4ed8);outline-offset:2px;box-shadow:0 4px 12px rgba(0,0,0,.15)}