.bloglist-page{min-height:100vh;padding:var(--header-offset) 24px 0;background:#fff;flex-direction:column;gap:60px;display:flex}.bloglist-hero{background:var(--color-purple);border-radius:22.5px;align-items:center;width:100%;max-width:1391px;min-height:380px;margin:0 auto;padding:clamp(40px,5.2vw,75px);display:flex;position:relative;overflow:hidden}.bloglist-hero-content{z-index:1;flex-direction:column;gap:26px;max-width:920px;display:flex;position:relative}.bloglist-hero-title{font-family:var(--font-display);letter-spacing:-.05em;color:#fff;margin:0;font-size:clamp(40px,7vw,100px);font-weight:600;line-height:1.02}.bloglist-hero-sub{font-family:var(--font-sans);letter-spacing:-.02em;color:#fff;opacity:.95;max-width:540px;margin:0;font-size:clamp(16px,1.8vw,26px);font-weight:400;line-height:1.3}.bloglist-hero-mascot{aspect-ratio:1;filter:blur(2px);pointer-events:none;background:radial-gradient(circle at 35% 35%,#1effafb3 0%,#0000 55%),radial-gradient(circle at 65% 65%,#f789b680 0%,#0000 60%),#ffffff1f;border-radius:50%;width:clamp(220px,32vw,460px);position:absolute;top:50%;right:-40px;transform:translateY(-50%)}.bloglist-tabs{background:#ebebff;border-radius:999px;flex-wrap:wrap;align-self:center;gap:1.5px;max-width:100%;padding:1.5px;display:inline-flex}.bloglist-tab{appearance:none;cursor:pointer;font-family:var(--font-sans);letter-spacing:-.04em;color:var(--color-heading);white-space:nowrap;background:0 0;border:0;border-radius:999px;padding:11px 24px;font-size:clamp(14px,1.25vw,18px);font-weight:500;line-height:1.2;transition:background-color .18s,color .18s}.bloglist-tab:hover:not(.bloglist-tab--active){color:var(--color-purple)}.bloglist-tab--active{background:#fff;box-shadow:0 1px 2px #17173c0f}.bloglist-filter-select{align-self:center;width:100%;max-width:360px;display:none}.bloglist-filter-select select{appearance:none;width:100%;font-family:var(--font-sans);letter-spacing:-.02em;color:var(--color-heading);cursor:pointer;background-color:#ebebff;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2317173C' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-position:right 20px center;background-repeat:no-repeat;border:0;border-radius:999px;padding:13px 46px 13px 22px;font-size:16px;font-weight:500}.bloglist-featured{width:100%;max-width:1391px;min-height:340px;color:inherit;cursor:pointer;transition:transform var(--duration-fast,.2s) ease, box-shadow var(--duration-fast,.2s) ease;background:#ebebff;border-radius:22.5px;grid-template-columns:1fr 1fr;align-items:stretch;gap:0;margin:0 auto;padding:7.5px;text-decoration:none;display:grid}.bloglist-featured:hover{transform:translateY(-2px);box-shadow:0 12px 32px #17173c14}.bloglist-featured:focus-visible{outline:3px solid var(--color-purple);outline-offset:4px}.bloglist-featured-image{aspect-ratio:4/3;background:#15183f;border-radius:16px 0 0 16px;position:relative;overflow:hidden}.bloglist-featured-cover{object-fit:cover;width:100%;height:100%;display:block}.bloglist-featured-promo{background:var(--color-purple);color:#fff;border-radius:34px;flex-direction:column;align-items:flex-start;gap:7.5px;max-width:280px;margin:28px;padding:22.5px;display:flex}.bloglist-featured-promo-icon{display:inline-flex}.bloglist-featured-promo-title{font-family:var(--font-display);letter-spacing:-.04em;color:#fff;font-size:21px;font-weight:600;line-height:1.15}.bloglist-featured-promo-sub{font-family:var(--font-sans);letter-spacing:-.01em;color:#ffffffe0;font-size:13px;font-weight:400;line-height:1.3}.bloglist-featured-body{background:#fff;border-radius:0 16px 16px 0;flex-direction:column;justify-content:space-between;gap:18px;padding:30px;display:flex}.bloglist-featured-title{font-family:var(--font-display);letter-spacing:-.03em;color:var(--color-heading);margin:0;font-size:clamp(22px,2.4vw,28px);font-weight:600;line-height:1.18}.bloglist-featured-excerpt{font-family:var(--font-sans);letter-spacing:-.01em;color:#55597f;margin:0;font-size:14px;font-weight:400;line-height:1.45}.bloglist-grid{grid-template-columns:repeat(3,1fr);gap:19.5px;width:100%;max-width:1391px;margin:0 auto;display:grid}.bloglist-card{color:inherit;background:#ebebff;border-radius:22.5px;flex-direction:column;gap:0;padding:7.5px;text-decoration:none;transition:transform .18s;display:flex}.bloglist-card:hover{transform:translateY(-3px)}.bloglist-card-image{aspect-ratio:4/3;background:radial-gradient(circle at 30% 40%,#d8d4ff 0%,#0000 60%),radial-gradient(circle at 70% 60%,#c5c0ff 0%,#0000 50%),linear-gradient(135deg,#b6b4ff,#8a87ff);border-radius:16px;width:100%}img.bloglist-card-image{object-fit:cover;background:0 0;height:auto;display:block}.bloglist-card-body{flex-direction:column;gap:14px;padding:22px 22px 18px;display:flex}.bloglist-card-meta{align-items:center;gap:12px;display:flex}.bloglist-card-tag{background:var(--color-green);color:var(--color-heading);font-family:var(--font-sans);letter-spacing:-.01em;border-radius:999px;align-items:center;padding:5px 12px;font-size:11px;font-weight:600;display:inline-flex}.bloglist-card-readtime-mini{font-family:var(--font-sans);color:#55597f;font-size:11px;font-weight:400}.bloglist-card-title{font-family:var(--font-display);letter-spacing:-.03em;color:var(--color-heading);margin:0;font-size:clamp(18px,1.8vw,24px);font-weight:600;line-height:1.2}.bloglist-card-excerpt{font-family:var(--font-sans);letter-spacing:-.01em;color:#55597f;margin:0;font-size:13.5px;font-weight:400;line-height:1.45}.bloglist-card-footer{justify-content:space-between;align-items:center;gap:16px;display:flex}.bloglist-card-author{align-items:center;gap:10px;display:flex}.bloglist-card-avatar{width:30px;height:30px;font-family:var(--font-sans);color:#fff;background:linear-gradient(135deg,#6e5d4a,#3e3127);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:11px;font-weight:700;display:inline-flex;overflow:hidden}.bloglist-card-avatar-img{object-fit:cover;border-radius:50%;width:100%;height:100%}.bloglist-card-author-meta{flex-direction:column;gap:2px;display:flex}.bloglist-card-author-name{font-family:var(--font-sans);color:var(--color-heading);font-size:12px;font-weight:600}.bloglist-card-date{font-family:var(--font-sans);color:#55597f;font-size:11px;font-weight:400}.bloglist-card-readtime{font-family:var(--font-sans);color:#55597f;align-items:center;gap:6px;font-size:13px;font-weight:500;display:inline-flex}.bloglist-discover{justify-content:center;margin-bottom:40px;display:flex}.bloglist-discover-btn{appearance:none;cursor:pointer;background:var(--color-green);color:var(--color-heading);font-family:var(--font-sans);letter-spacing:-.04em;border:0;border-radius:999px;align-items:center;gap:12px;padding:9px 19px;font-size:19.5px;font-weight:600;line-height:1.2;transition:transform .18s,background-color .18s;display:inline-flex}.bloglist-discover-btn:hover{background:#00d999;transform:translateY(-2px)}@media (max-width:980px){.bloglist-grid{grid-template-columns:repeat(2,1fr)}.bloglist-featured{grid-template-columns:1fr}.bloglist-featured-image{border-radius:16px 16px 0 0;min-height:220px}.bloglist-featured-body{border-radius:0 0 16px 16px}}@media (max-width:640px){.bloglist-grid{grid-template-columns:1fr}.bloglist-page{padding:var(--header-offset) 16px 0;gap:40px}.bloglist-hero-mascot,.bloglist-tabs{display:none}.bloglist-filter-select{display:block}}