/*
Theme Name: Bryela Rainbow
Description: Custom theme for Bryela Price's Baby Sitting, converted from the original static design.
Version: 1.0.0
Requires at least: 6.5
Text Domain: bryela-rainbow
*/
:root{--ink:#772755;--pink:#fbd4e8;--edge:#f1b9d7}*{box-sizing:border-box}
body{margin:0;background:linear-gradient(135deg,#fff4fa,#f1edff 40%,#ebfaff);font-family:Trebuchet MS,Arial,sans-serif;color:var(--ink)}
.shell{display:block;max-width:990px;margin:20px auto;overflow:hidden;border:3px solid #f9c0df;border-radius:28px;box-shadow:0 12px 40px #8e4b8430;background:#fffaf5}
.site-header{text-align:center;padding:26px 16px;background:#fbe0f2}
.site-header h1{font-size:clamp(25px,5vw,42px);margin:9px 0}
.site-header h1 a{color:inherit;text-decoration:none}
.site-header p{margin:6px}
.rainbow{height:9px;background:linear-gradient(90deg,#f786bc,#ffc85a,#fae36d,#80d9a0,#84cafa,#ba98f6)}

/* Nav: WordPress menu styled like the original tab buttons */
.site-nav{padding:14px;background:#fff6fa}
.site-nav ul{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;list-style:none;margin:0;padding:0}
.site-nav a{display:inline-block;padding:12px 17px;border:2px solid #efc0df;border-radius:13px;background:#fff;color:#8b235f;font-weight:bold;font-size:15px;text-decoration:none}
.site-nav .current-menu-item>a,.site-nav .current_page_item>a,.site-nav a:hover{background:#a92170;color:#fff}

.tab-page{padding:22px;min-height:480px}
.tab-page h2{text-align:center;font-size:29px}
.tab-page .intro{text-align:center}
.tab-page a{color:#a92170}
.tab-page .hero{background:linear-gradient(130deg,#ffe0ee,#d9ecff,#fef2c5,#dff8e5);border-radius:25px;padding:28px;text-align:center}
.tab-page .hero .animals{font-size:clamp(50px,10vw,95px);line-height:1.7;margin:0}
.tab-page .white{background:#fff;padding:18px;border-radius:20px;margin:18px 0;text-align:center}
.tab-page .grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}
.tab-page .grid>*{margin:0}
.tab-page .tile{padding:20px;border-radius:18px;text-align:center;background:#ffe5f1}
.tab-page .tile:nth-child(6n+2){background:#deefff}.tab-page .tile:nth-child(6n+3){background:#fff1c7}.tab-page .tile:nth-child(6n+4){background:#eae0ff}.tab-page .tile:nth-child(6n+5){background:#e0f8e8}.tab-page .tile:nth-child(6n+6){background:#ffe7d8}
.tab-page .tile>*{margin:5px 0}
.tab-page .emoji{font-size:38px}
.tab-page .tile h3{margin:7px 0}
.tab-page .tile p{font-size:14px}
.tab-page .tile p.emoji{font-size:38px}
.tab-page .accordion{margin:10px 0;background:#fce1ef;border-radius:14px;padding:15px}
.tab-page .accordion:nth-of-type(even){background:#e0efff}
.tab-page .accordion summary{cursor:pointer;font-weight:bold}
.tab-page .accordion p{line-height:1.5}
.tab-page .wp-block-button__link{background:#a92170;color:#fff;border:0;border-radius:12px;padding:14px 22px;text-decoration:none;font-size:16px}
.tab-page .review-card{max-width:600px;margin:23px auto 5px;padding:20px;border-radius:22px;background:linear-gradient(130deg,#ffe1f0,#e4efff,#fff0c9);border:2px solid #f6c1dd;text-align:center}
.tab-page .review-card h3{font-size:23px;margin:3px 0 9px}
.tab-page .review-list{margin-top:12px;text-align:left}
.tab-page .review-item{background:#fff;border-radius:12px;padding:10px;margin-top:9px;overflow-wrap:anywhere}
.tab-page .review-item>*{margin:0 0 .6em}
.tab-page .review-item strong{color:#aa286d}
.tab-page .home-portrait{max-width:320px;margin:12px auto 22px;text-align:center;padding:12px;background:linear-gradient(135deg,#ffe0f1,#deeeff,#e7f8df);border-radius:24px;box-shadow:0 5px 18px #b77da23d}
.tab-page .home-portrait img{display:block;width:100%;max-height:340px;object-fit:cover;object-position:center 35%;border-radius:18px}
.tab-page .home-portrait figcaption{font-weight:bold;padding-top:10px;margin:0;color:#92305f;font-size:inherit}
.tab-page img{max-width:100%;height:auto}

.site-footer{background:#e9dfff;text-align:center;padding:22px}
.notice{padding:12px 22px;text-align:center;font-size:13px;color:#6d4760;background:#fff}
@media(max-width:500px){.tab-page{padding:12px}.tab-page .grid{gap:9px}.tab-page .tile{padding:12px}.tab-page .tile h3{font-size:15px}.site-nav a{font-size:12px;padding:10px}}