.app-hero { text-align: center; padding: 50px 20px 40px; }
.app-hero .subtitle { font-size: 32px; color: #ed5848; font-weight: bold; display: block; margin-bottom: 25px; }
.hero-visual { width: 100%; border-radius: 20px; overflow: hidden; box-shadow: 0 15px 40px rgba(0,0,0,0.1); margin-bottom: 50px; }
.hero-visual img { width: 100%; display: block; }
.sync-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 25px; margin: 50px 0 20px; }
.sync-card { background: #ffffff; border-radius: 15px; overflow: hidden; border: 1px solid #e5e5e5; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.04); display: flex; flex-direction: column; }
.card-header { background-color: #f2f2f2; padding: 25px 15px 10px; text-align: center; }
.card-header h4 { font-size: 19px; color: #111; margin: 0; font-weight: bold; }
.sync-card img { width: 100%; height: 500px; object-fit: contain; background: #f2f2f2; padding: 10px 0; }
.sync-card .card-info { padding: 25px 20px; text-align: center; flex-grow: 1; border-top: 1px solid #eee; }
.sync-card .card-info p { font-size: 15px; color: #ed5848; font-weight: bold; margin: 0; }
.analysis-header { text-align: center; margin: 20px 0 40px; }
.analysis-header h2 { font-family: 'title-font', cursive; font-size: 36px; color: #111; }
.analysis-header p { font-size: 18px; color: #666; margin-top: 15px; }
.report-gallery { display: flex; flex-direction: column; gap: 40px; margin-bottom: 80px; }
.report-img { border-radius: 15px; overflow: hidden; border: 1.5px solid #ddd; box-shadow: 0 10px 30px rgba(0,0,0,0.05); }
.report-img img { width: 100%; display: block; }
.coaching-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 25px; margin-bottom: 100px; }
.coaching-card { background: #fff; border-radius: 12px; border: 1.5px solid #eee; box-shadow: 0 10px 30px rgba(0,0,0,0.03); padding: 35px 25px; transition: transform 0.3s ease; }
.card-header-wrap { display: flex; align-items: center; margin-bottom: 25px; }
.card-num-circle { width: 36px; height: 36px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 18px; font-weight: bold; color: #fff; flex-shrink: 0; margin-right: 15px; }
.coaching-card img { width: 75px; height: auto; flex-shrink: 0; margin-right: 10px; }
.card-title-container { flex: 1; text-align: center; }
.coaching-card h5 { font-size: 27px; color: #333; margin: 0; font-weight: bold; letter-spacing: -0.03em; display: inline-block; }
.coaching-card p { font-size: 18px; color: #555; line-height: 1.8; text-align: left; margin: 0; word-break: keep-all; }
.card-1 .card-num-circle { background-color: #ed5848; }
.card-2 .card-num-circle { background-color: #f7941d; }
.card-3 .card-num-circle { background-color: #0071bc; }
.card-4 .card-num-circle { background-color: #00a651; }
.feature-row { display: flex; align-items: center; gap: 60px; margin-bottom: 120px; }
.feature-row:nth-child(even) { flex-direction: row-reverse; }
.feature-text { flex: 1.2; }
.feature-text h3 { font-family: 'title-font', cursive; font-size: 32px; color: #ed5848; margin-bottom: 25px; }
.feature-text p { font-size: 17px; color: #444; line-height: 1.8; word-break: keep-all; }
.feature-text ul { list-style: none; padding: 0; margin-top: 20px; }
.feature-text li { font-size: 16px; color: #666; margin-bottom: 12px; padding-left: 25px; position: relative; }
.feature-text li::before { content: "✔"; color: #ed5848; position: absolute; left: 0; font-weight: bold; }
.feature-img { flex: 1; border-radius: 15px; overflow: hidden; box-shadow: 0 15px 35px rgba(0,0,0,0.08); border: 1px solid #eee; }
.feature-img img { width: 100%; display: block; }
.guide-container { background: transparent; padding: 60px 0; border: none; box-shadow: none; margin: 40px 0; text-align: center; }
.guide-container h3 { font-family: 'title-font', cursive; font-size: 36px; color: #111; margin-bottom: 60px; }
.step-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; }
.step h5 { font-size: 19px; margin-bottom: 12px; font-weight: bold; }
.step p { font-size: 15px; color: #777; line-height: 1.6; }
.step-num { width: 45px; height: 45px; background: #ed5848; color: #fff; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 20px; font-weight: bold; font-size: 18px; }
.mission-box { text-align: center; padding: 80px 0; border-top: 2px solid #eee; }
.mission-box h4 { font-family: 'title-font', cursive; font-size: 28px; color: #111; margin-bottom: 30px; }
.philosophy { font-size: 16.5px; color: #555; line-height: 1.9; max-width: 850px; margin: 0 auto 50px; word-break: keep-all; text-align: left; }
.philosophy strong { color: #ed5848; border-bottom: 1px solid #ed5848; }
.pdf-btn-wrap { display: flex; justify-content: center; gap: 20px; }
.pdf-btn { background: #282626; color: #fff; padding: 15px 35px; border-radius: 6px; text-decoration: none; font-size: 16px; transition: 0.3s; border: 1.5px solid #282626; font-weight: bold; }
@media (max-width: 768px) { .sync-grid, .coaching-grid, .feature-row, .step-grid { grid-template-columns: 1fr; } .app-hero h1 { font-size: 38px; } .sync-card img { height: 400px; } }