.branding-page{max-width:1200px;margin:80px auto 40px;padding:0 20px;color:var(--text-color);transition:color .3s ease,background-color .3s ease}.branding-header{text-align:center;margin-bottom:40px;padding-bottom:20px;border-bottom:1px solid var(--border-color,#e0e0e0)}.branding-title{font-size:36px;margin-bottom:10px;color:var(--text-color)}.branding-subtitle{font-size:18px;color:var(--text-color);opacity:.8;max-width:700px;margin:0 auto}.branding-tabs{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;margin-bottom:30px;border-bottom:1px solid var(--border-color,#e0e0e0);padding-bottom:10px}.tab-button{padding:12px 20px;background:transparent;border:none;border-radius:6px;font-size:16px;font-weight:500;color:var(--text-color);cursor:pointer;transition:var(--theme-transition),box-shadow .3s ease}.tab-button:hover{background-color:rgba(13,124,233,.1)}.tab-button.active{background-color:var(--primary-blue,#0D7CE9);color:white}.tab-content{min-height:500px}.branding-elements{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));grid-gap:30px;gap:30px;margin-top:30px}.branding-element{background:var(--card-bg);border-radius:12px;padding:25px;box-shadow:var(--card-shadow);transition:all .3s ease}.branding-element:hover{transform:translateY(-5px);box-shadow:var(--shadow-large)}.branding-visual-identity{padding:20px 0}.branding-visual-identity .section-intro{text-align:center;margin-bottom:40px}.branding-visual-identity .section-intro h2{font-size:28px;margin-bottom:15px;display:flex;align-items:center;justify-content:center;gap:10px}.logo-section{margin-bottom:40px}.logo-section h3{font-size:24px;margin-bottom:20px;color:var(--text-color)}.logo-showcase{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));grid-gap:30px;margin-top:20px}.logo-container{text-align:center;background:var(--card-bg);border-radius:12px;box-shadow:var(--card-shadow);transition:all .3s ease}.logo-container:hover{transform:translateY(-5px);box-shadow:var(--shadow-large)}.logo-container.primary{border:2px solid var(--primary-blue)}.branding-logo{width:120px;height:120px;margin:0 auto 15px;display:flex;align-items:center;justify-content:center;color:white;font-weight:700;font-size:14px}.branding-logo,.logo-variations{border-radius:12px;text-align:center}.logo-variations{padding:20px;background:var(--card-bg);box-shadow:var(--card-shadow);transition:all .3s ease}.logo-variations:hover{transform:translateY(-5px);box-shadow:var(--shadow-large)}.logo-variations.dark{border:2px solid var(--secondary-blue)}.logo-variations.monochrome{border:2px solid var(--text-muted)}.logo-placeholder{margin:0 auto 15px;border-radius:12px;color:white;font-weight:700;font-size:14px;text-align:center}.logo-placeholder.dark-bg{background:#252833}.logo-placeholder.light-bg{background:#FFFFFF;color:#333333;border:1px solid #e0e0e0}.logo-label{margin:0;font-weight:500}.section-intro{text-align:center;margin-bottom:40px}.section-intro h2{font-size:28px;margin-bottom:15px;display:flex;align-items:center;justify-content:center;gap:10px}.section-icon{color:var(--primary-blue,#0D7CE9)}.branding-elements{display:grid;grid-template-columns:1fr;grid-gap:40px;gap:40px}.branding-element{background-color:var(--card-bg,#f8f9fa);border-radius:10px;padding:30px;box-shadow:var(--card-shadow,0 2px 10px rgba(0,0,0,.05));transition:background-color .3s ease,box-shadow .3s ease}.branding-element h3{font-size:24px;margin-bottom:20px;color:var(--text-color);display:flex;align-items:center;gap:10px}.element-icon{color:var(--primary-blue,#0D7CE9)}.logo-section{padding:20px}.logo-showcase{gap:30px;margin-bottom:30px}.logo-container,.logo-showcase{display:flex;flex-direction:column}.logo-container{align-items:center;gap:15px;border:1px solid var(--border-color,#e0e0e0);border-radius:8px;padding:20px;background-color:var(--card-bg,#f8f9fa)}.logo-container.primary{margin-bottom:20px}.logo-variations{display:flex;gap:30px;justify-content:center}.logo-placeholder{width:120px;height:120px;overflow:hidden}.dark-bg{background-color:#252833}.light-bg{background-color:#f5f5f5}.branding-logo{max-width:100px;height:auto}.logo-placeholder{width:150px;height:150px;display:flex;align-items:center;justify-content:center;border-radius:8px}.dark-bg{background-color:var(--dark-blue,#252833)}.light-bg{background-color:var(--surface-secondary)}.logo-label{font-size:14px;color:var(--text-color);opacity:.8}.logo-guidelines{text-align:left;margin-top:20px}.logo-guidelines h4{font-size:18px;margin-bottom:15px;color:var(--text-color)}.logo-guidelines ul{list-style-type:disc;padding-left:20px;margin-bottom:20px}.logo-guidelines li{margin-bottom:10px;line-height:1.5}.color-palette{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));grid-gap:20px;gap:20px;margin-bottom:20px}.color-item{display:flex;flex-direction:column;border-radius:8px;overflow:hidden;box-shadow:var(--shadow-light);cursor:pointer;transition:transform .2s ease}.color-item:hover{transform:translateY(-5px)}.color-swatch{height:100px}.color-info{padding:15px;background-color:var(--card-bg,white)}.color-name{display:block;font-weight:700;margin-bottom:5px}.color-hex,.color-rgb{display:block;font-size:14px;opacity:.8;margin-bottom:3px}.copy-all-btn{background-color:var(--primary-blue);color:var(--button-text);border:none;padding:10px 15px;border-radius:5px;cursor:pointer;display:flex;align-items:center;gap:8px;margin:20px 0;transition:var(--theme-transition),box-shadow .3s ease}.copy-all-btn:hover{background-color:var(--primary-blue-hover);box-shadow:0 3px 10px var(--shadow-medium)}.color-usage{margin-top:20px}.color-usage h4{font-size:18px;margin-bottom:10px}.color-usage p{line-height:1.6}.typography-showcase{display:flex;flex-direction:column;gap:30px;margin-bottom:30px}.font-family{padding:20px;border-radius:8px;background-color:var(--bg-color,white);border:1px solid var(--border-color,#e0e0e0)}.font-name{font-size:20px;margin-bottom:15px;color:var(--primary-blue,#0D7CE9)}.font-family.primary .font-name,.font-family.primary .font-sample{font-family:Black Ops One}.font-family.secondary .font-name,.font-family.secondary .font-sample{font-family:Inter}.font-sample{font-size:18px;margin-bottom:10px;line-height:1.5}.font-usage{display:inline-block;margin-top:10px;font-size:14px;background-color:var(--primary-blue,#0D7CE9);color:white;padding:5px 10px;border-radius:4px}.typography-guidelines{margin-top:20px}.typography-guidelines h4{font-size:18px;margin-bottom:15px}.typography-guidelines ul{list-style-type:disc;padding-left:20px}.typography-guidelines li{margin-bottom:10px;line-height:1.5}.branding-mission{padding:20px}.branding-mission h2{font-size:28px;margin-bottom:30px;text-align:center}.mission-statement{background-color:var(--card-bg,#f8f9fa);padding:30px;border-radius:10px;margin-bottom:40px;box-shadow:var(--card-shadow,0 2px 10px rgba(0,0,0,.05));text-align:center}.mission-statement h3{font-size:22px;margin-bottom:20px;color:var(--text-color)}.mission-statement blockquote{font-size:18px;line-height:1.6;font-style:italic;color:var(--text-color);border-left:4px solid var(--primary-blue,#0d7ce9);padding-left:20px;margin-left:0}.values-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));grid-gap:20px;gap:20px}.value-card{background-color:var(--card-bg,#f8f9fa);padding:25px;border-radius:8px;box-shadow:var(--card-shadow,0 2px 10px rgba(0,0,0,.05));transition:transform .3s ease,box-shadow .3s ease}.value-card:hover{transform:translateY(-5px);box-shadow:0 8px 20px rgba(0,0,0,.1)}.value-card h3{font-size:20px;margin-bottom:15px;color:var(--primary-blue,#0D7CE9)}.value-card p{line-height:1.6}.branding-tone{padding:20px}.branding-tone h2{font-size:28px;margin-bottom:30px;text-align:center;display:flex;align-items:center;justify-content:center;gap:10px}.tone-principles{display:grid;grid-template-columns:1fr;grid-gap:30px;gap:30px}.tone-principle{background-color:var(--card-bg,#f8f9fa);padding:25px;border-radius:8px;box-shadow:var(--card-shadow,0 2px 10px rgba(0,0,0,.05))}.tone-principle h3{font-size:22px;margin-bottom:15px;color:var(--primary-blue,#0D7CE9)}.tone-principle p{margin-bottom:20px;line-height:1.6}.example-box{background-color:rgba(0,0,0,.03);padding:15px;border-radius:6px}.example-box h4{font-size:16px;margin-bottom:10px;color:var(--text-color)}.bad-example,.good-example{border-radius:4px;margin-bottom:10px;position:relative;padding:10px 10px 10px 30px}.good-example{background-color:rgba(76,175,80,.1);border-left:3px solid #4caf50}.bad-example{background-color:rgba(244,67,54,.1);border-left:3px solid #f44336}.bad-example:before,.good-example:before{position:absolute;left:10px;top:10px}.good-example:before{content:"✓";color:#4CAF50}.bad-example:before{content:"✗";color:#F44336}.branding-usage{padding:20px}.branding-usage h2{font-size:28px;margin-bottom:30px;text-align:center}.usage-guidelines{display:flex;flex-direction:column;gap:40px}.guideline-section{background-color:var(--card-bg,#f8f9fa);padding:25px;border-radius:8px;box-shadow:var(--card-shadow,0 2px 10px rgba(0,0,0,.05))}.guideline-section h3{font-size:22px;margin-bottom:20px;color:var(--text-color)}.do-dont-grid{display:grid;grid-template-columns:1fr 1fr;grid-gap:20px;gap:20px}.do-box,.dont-box{padding:20px;border-radius:6px}.do-box{background-color:rgba(76,175,80,.1);border:1px solid #4caf50}.dont-box{background-color:rgba(244,67,54,.1);border:1px solid #f44336}.do-box h4,.dont-box h4{font-size:18px;margin-bottom:15px;text-align:center}.do-box h4{color:#4CAF50}.dont-box h4{color:#F44336}.do-box ul,.dont-box ul{list-style-type:disc;padding-left:20px}.do-box li,.dont-box li{margin-bottom:8px;line-height:1.5}.guideline-section p{line-height:1.6;margin-bottom:15px}.guideline-section a{color:var(--primary-blue,#0D7CE9);text-decoration:none;transition:color .3s ease}.guideline-section a:hover{text-decoration:underline}.download-btn{display:inline-flex;align-items:center;gap:8px;background-color:var(--primary-blue,#0D7CE9);color:white;padding:12px 20px;border-radius:6px;text-decoration:none;font-weight:500;margin-top:20px;transition:background-color .3s ease,transform .2s ease}.download-btn:hover{background-color:#0a63b8;transform:translateY(-2px)}.download-btn:active{transform:translateY(0)}@media (min-width:768px){.branding-elements{grid-template-columns:1fr}.typography-showcase{flex-direction:row;gap:20px}.font-family{flex:1 1}.tone-principles{grid-template-columns:repeat(3,1fr)}}@media (max-width:767px){.branding-title{font-size:28px}.branding-subtitle{font-size:16px}.tab-button{padding:10px 15px;font-size:14px}.branding-element{padding:20px}.color-palette{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}.do-dont-grid{grid-template-columns:1fr}.logo-variations{flex-direction:column}}@media (max-width:480px){.branding-page{margin:60px auto 30px;padding:0 15px}.branding-title{font-size:24px}.branding-tabs{flex-direction:column;gap:8px}.tab-button{width:100%}.branding-element h3{font-size:20px}.color-palette,.values-grid{grid-template-columns:1fr}}.dark-theme .branding-element,.dark-theme .guideline-section,.dark-theme .mission-statement,.dark-theme .tone-principle,.dark-theme .value-card{background-color:var(--card-bg,#252833);box-shadow:var(--card-shadow,0 2px 10px rgba(0,0,0,.2))}.dark-theme .font-family{background-color:var(--card-bg,#252833);border-color:var(--border-color,#3a3f4d)}.dark-theme .example-box{background-color:rgba(255,255,255,.05)}.dark-theme .color-info{background-color:var(--card-bg,#252833)}.dark-theme .light-bg{background-color:#3a3f4d}.dark-theme .good-example{background-color:rgba(76,175,80,.15)}.dark-theme .bad-example{background-color:rgba(244,67,54,.15)}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.branding-header,.branding-tabs,.tab-content section{animation:fadeIn .6s ease-out forwards}.branding-element,.guideline-section,.tone-principle,.value-card{animation:fadeIn .8s ease-out forwards}.copy-all-btn:focus,.download-btn:focus,.tab-button:focus{outline:2px solid var(--primary-blue,#0D7CE9);outline-offset:2px}@media (prefers-contrast:high){.branding-element,.font-family,.mission-statement,.value-card{border:2px solid var(--text-color)}}@media print{.branding-page{margin:0;padding:0}.branding-tabs{display:none}.tab-content section{display:block!important;page-break-after:always}.branding-element,.guideline-section,.mission-statement,.tone-principle,.value-card{box-shadow:none;border:1px solid #ddd}.copy-all-btn,.download-btn{display:none}}